Posted by haakon, Have you heard of them? In their own words, Sass is:
a meta-language on top of CSS that‘s used to describe the style of a document cleanly and structurally, with more power than flat CSS allows. Sass both provides a simpler, more elegant syntax for CSS and implements various features that are useful for creating manageable stylesheets.
It has cool features like:
- Better formatting for complexly nested selectors
- Math support (use simple mathematical expressions)
- Constants – define a color in one place and use it throughout your file. Want to change it later? Change it in one place only!
To learn more, check out the Sass Documentation. Sounds nifty, eh? I just came across Sass last week and have since change my css files over and it is a definite improvement. Less typing, more readable, better in every way. The only downside is that my editor didn’t give me nice color syntax highlighting for my .sass files.
I’ve just started using the NetBeans 6 editor which has some very nice ruby support. Here is a movie showing off some of it’s features. Unfortunately, it currently does not have support for sass files. So, I took a little bit of time and created a NetBeans module to provide syntax highlighting for Sass files. The beauty of syntax highlighting is that in many ways it works like a compiler, letting you know of errors in your code earlier rather than later. While working with Sass I found it a little annoying to make a mistake in my Sass file and not see the problem until I actually refreshed the page in a browser. Color highlighting can make your mistakes more obvious and findable. For example, when I was converting my css files to sass files, I would often make an error like follows:
a :font-size: 10px
I would put the colon to the front of the property name, but forget to remove the colon at the end. Color highlighting can highlight that as you are working on the file making it easier to catch errors. At the moment this is very much in a beta state, but please feel welcome to download and install the module. Currently it only supports sass property names with the colon at the front, rather than at the end.
[Update]
I’ve since found a more recent plugin that someone else is doing a fine job of maintaining. Download the plugin by Dylan Bruzenak
Enjoy!
~haakon
