Nesting
To make migrating from Less / Sass easier, Jess supports the same nesting syntax.
Here's a basic example of nesting:
caution
While you can write nested blocks like the above, too much nesting should be avoided, as it can really inflate the size of your stylesheets. In general, browsers are more performant when you use single class selectors for each type of element.
At-Rule bubbling#
One of the best ideas to come out of Less/Sass is the idea of at-rule bubbling, which can make your stylesheets easier to read, by putting different property values next to each other.
For example:
This will produce:
caution
Less has unique logic for bubbling behavior of specific at-rules. In Jess, all at-rules will bubble to the root, or the next enclosing at-rule.