Writing more with less
Roy van der Meij wo 30 jun 10
So you would like to use variables and inheritance with css? Now you can! With less.js.
So what is less?
With less you can do exactly what I stated above. Let’s check out some code.
@brand_color: #4D926F; #header { color: @brand_color; } h2 { color: @brand_color; }
How awesome is that :)
But what I like more is the inheritance part.
#header { color: red; a { font-weight: bold; text-decoration: none; } }
Right now less is a gem and a plugin for rails, but they rewritten it entirely in javascript. So you can now use it without any use of a backend.
Just place this in your head tag.
<link rel="stylesheet/less" href="style.less" type="text/css" /> <script src="http://lesscss.googlecode.com/files/less-1.0.21.min.js"></script>
And have fun in your stylesheets/style.less file :-)
For more info check out these links:
lesscss.org
less.js on github
less tutorial
Gepost in hor | 1 reactie
Welcome to Holland On Rails
This weblog is the official Ruby techblog from the guys at Holder, a Ruby development company. Holder is also the company behind the RubyAndRails Europe Conference in Amsterdam.Recente Jobs
Bekijk alle jobs »»
Gereedschapskist
Onmisbare tools vooriedere developer!
- Ruby On Rails
Framework voor de web 2.0 developer. Eindelijk vooruitgang! - TextMate
Editor for true pro's
Typ, tab, top :-)
Nee, niet voor Win. - Made On A Mac
En nou is het over met die saaie grijze Windows bak van je!
Auteurs op deze site
Chris Obdam
'Less is more' evangelist, past dit ook dagelijks toe op zijn tandenborstel.Chiel Wester
Snelheidswonder op Ruby wielen. Leuk om mee te pair-programmen ;-)
Jeroen Bulters do 15 jul 10 09:10
You forget to mention that less.js is also suited for server side node.js apps, serving the same purpose as the less gems for ruby.
Plaats je reactie