ECSS is an english implementation of CSS written in Javascript.
$ npm install ecss-lang -g
To select a tag, use the for keyword.
for button
for h3
To add styling, replace the usual colon with "is", and omit semicolons and hyphens.
for button
background color is blue
outline is none
for h3
text align is center
Once you're done, run this command:
$ ecss -o path/to/file.ecss
The parsed ECSS should output in the console.
button{background-color:blue;outline:none;}h3{text-align:center;}
To parse to a file, make a ecssconfig.json
in your root directory with these contents.
{
"compilerOptions": {
"outDir": "css/"
}
}
Then, in your console, type
ecss -p path/to/file.ecss
The ecss should output in a css folder.
To make a variable, use:
variable main color is orange
To use a variable, surround it with parenthesis:
variable main color is orange
for .navbar
background color is (main color)
To extend the styles from another selector, use:
for h1
font style is cursive
for p
extend h1
MIT