less.js, lessframework & CSS grids ala Blueprint or 960.gs

Question

Ok, so Less.js has come along, and it seems that my dreams of creating a CSS framework (especially a 'grid' system), with an 'abstracted' CSS language might be about to come true.

That is, 960 and Blueprint are great and all... but it so irked me to put style information in HTML markup, such as:

class="article grid_4 pull_2"

or whatever the syntax was :)

So, now it seems that we can do it this way:

.article {
  .grid_container();
  .grid_four();
  .pull_two();
  .last();  
}

Weeeeeee!

So, I'm about to get stuck into developing this for myself -- but I'm sure there are some brainiacs out there that have already done it -- so before I get into any heavy lifting...?

Any leads?

Kindly

Daryl.

Answer 1

I checked out less , it was a push between that and the new sass (scss) syntax, but what made me choose sass is that it has a way to turn css into scss code.

The round trip was something I definitely wanted. Once that happened, then Compass presented itself. I was going to try using something to code everything in python, but it makes perfect sense to me to preprocess the css, especially since I'd like to use HTML5, and if the spec changes, then I can tweak the generation.

Answer 2

BTW folks, I've started that framework I was talking about.

http://github.com/DarylAntony/lesser

I'm having fun with it.