Tuesday, September 10, 2013

Less Css and Umbraco

Or in this case more css.  I often run into limitations and annoyances with the limitations of Css rules. But there are solutions for this, namely Less the css preprocessor.  It very simply lets you markup Css files with additional logic and features that css doesn't support.  Then runes a processing function over the file to generate a second rewritten version in raw Css code.  This quickly allows for things like variable,  functions, inheritance, nested rules, and basic math.

Any way this can be implemented a few ways but I crated the simple package for Umbraco to completely automate this process.  It very simply looks for *.less.css files in the normal umbraco Css folder and auto-compiles them on save.  So install this and then simply create a new stylesheet called test.less in Umbraco and you are good to go. Just make sure you always edit the .less version as the compiled file is read only.