Skip to content
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 

sss2

A CSS preprocessor using an alternative easy-to-parse syntax

Tokens

name    -> [\-_a-zA-Z0-9\.:]+
varName -> @[\-_a-zA-Z0-9]+
string  -> "[^"]+"

Grammar

document        -> (rule|varElement)*
rule            -> selector '{' body '}'
selector        -> '(' selectorPath (',' selectorPath)* ')'
selectorPath    -> (name|selector) ('>'? selectorPath)?
body            -> bodyElement*
bodyElement     -> nestedRule | propertyElement | varElement
nestedRule      -> nestedSelector '{' body '}'
nestedSelector  -> '>'? selector
propertyElement -> name '=' value ';'
varElement      -> varName '=' value ';'
value           -> (string|varName)+

Example

(div > (span,a)) {
  background-color = "red";
  >(img) {
    max-width = "100%";
  }
  (img) {
    max-height = "100%";
  }
}

transforms to

div > span > img,
div > a > img {
  max-width : 100%;
}

div > span img,
div > a img {
  max-height : 100%;
}

div > span,
div > a {
  background-color : red;
}

About

A CSS preprocessor using an alternative easy-to-parse syntax

Resources

Releases

No releases published

Packages

No packages published