As a developer I see CSS as a language made for designers. I don’t get comfortable with this topic.
That’s why I gave SASS a try and I must admit, it’s easy to use. One can use variables, calculate and include different files easily. Here is a small example taken from the SASS website.
$font-stack: Helvetica, sans-serif;
$primary-color: #333;
body {
font: 100% $font-stack;
color: $primary-color;
}
In cooperation with the Koala Editor one can use about every code edtior available. Koala supports the following languages: Less,Sass, CoffeeScript and Compass Framework.
taken from: http://koala-app.com/
Here are the TOP6 benefits:
- variables like php
- nesting like javascript blocks
- imports of external scss files
- mixins with functions
- inheritance of attributes
- calculations
What I like most is the nesting feature. The elements are easier to find and the SASS processing is cleaning up the mess. So one can concentrate on writing readable and maintainable style code.
Example:
// avoids duplicated code
.listAppeal {
margin: 0;
padding: 0;
list-style: none;
}
body {
nav {
ul {
@extend .listAppeal;
}
li { display: inline-block; }
a {
display: block;
padding: 6px 12px;
text-decoration: none;
}
}
}
When you have seen and used CSS before. Getting started with SASS maybe takes about 60 minutes. With the use of Koala all processed CSS files can be generated automatically after saving the scss files.
Have fun trying…
christian mueller design 