Skip to content

Svelte+ is a Svelte tool written in TypeScript to make building a website easier

License

Notifications You must be signed in to change notification settings

GoPorts/Svelte-Plus

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

19 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Svelte+

About

Pages:
How to use
Code

Svelte+ was coded in StackBlitz with its build in Svelte kit.
Svelte plus will create Svelte code with simple and short terms.
Svelte plus is a programming tool made to build a website easier with little to no effort.
Svelte plus is not accosiated in any way with the official Svelte.
Svelte plus is also in development
Svelte plus has been tested and might give you double-code, where it gives you two of the exact same code.

How to use

1, 2, 3, 4, 5, stands for h1, h2 and so on.
!addcss, adds css.
!addscript, adds javascript to the Svelte code.
bgc , will add a background color if css code is added.
ff , ff is a short term of family font, i recommend sans-serif if you want a nice font.
img , after typing img, put the image link.

Code

let svelte = `
  1 Thank you for using Svelt-Plus,
  2 making developing websites easier.

  !addcss
  ff sans-serif
  bg grey
`;

let imgsrc = '';
let font = '';
let sveltecss = '';
let sveltecode = '';
let svelteSCRIPTADD = 'console.log("Added script");';

const lines = svelte.split('\n').map(line => line.trim()).filter(line => line);

lines.forEach((line) => {
  if (line.startsWith('!addscript')) {
    sveltecode += `<script>${svelteSCRIPTADD}</script>\n`;
  }
  
  if (line.startsWith('1 ')) {
    const content = line.substring(2).trim();
    sveltecode += `<h1>${content}</h1>\n`;
  }

  if (line.startsWith('2 ')) {
    const content = line.substring(2).trim();
    sveltecode += `<h2>${content}</h2>\n`;
  }
  
  if (line.startsWith('img ')) {
    imgsrc = line.substring(4).trim();
    sveltecode += `<img src="${imgsrc}" alt="Image" />\n`;
  }

  if (line.startsWith('bg ')) {
    const bgColor = line.substring(3).trim();
    sveltecss += `  background-color: ${bgColor};\n`;
  }

  if (line.startsWith('ff ')) {
    font = line.substring(3).trim();
    sveltecss += `  font-family: ${font};\n`;
  }

  if (line.startsWith('!addcss')) {
    sveltecode += `<style>\nbody {\n${sveltecss}}\n</style>\n`;
  }
});

console.log(sveltecode);
console.log(sveltecss);

About

Svelte+ is a Svelte tool written in TypeScript to make building a website easier

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published