Sass (Syntactically Awesome StyleSheets) is a language which simplifies writing and maintains stylesheets in a dynamic way. But it is essentially an CSS3 extension. So Sass fits with all CSS versions.
Sass is used with Ruby and introduces two syntaxes : Sass syntax which is an old version and the SCSS (Sassy CSS) syntax, which is more recent. This tool allows to save time and optimizes integration works because of a non-exhaustive list of functionnalities such as nested selectors allowing you to put them together inside other selectors, to create keyboard shortcuts.
Jade Ah Heng, our Front-End Developer, is glad to share her Sass experience :
« The use of a preprocessor such as Sass has made me more productive. I code less but it's much more efficient work.
Variables in Sass offer consistency and a lot of flexibility. For instance, I can store the primary color of my site in a variable and reuse this variable throughout my stylesheets. At any time, if I want to change the color, I only have to modify one line of code (my primary color variable) and the change will be effected everywhere.
Mixins are another great feature available with Sass. A good, basic use of mixins is to store chunks of CSS that will be re-used throughout the site. When needed, I just have to call the mixins instead of writing repetitive code over and over again. Adding arguments to mixins is even more useful, allowing me to re-use repeated blocks of CSS but dynamically setting values for one or more properties on a case-by-case basis. ».
- Log in to post comments
