wherein our intrepid hero switches his website to use Sass/SCSS, not LESS.

I’m now long overdue to push my updated site, which is supposed to have been ready for the beginning of this year, live. The bottleneck is, as usual, styling and content mangling.

Content mangling is easy. I just whack some neat hacks into a template, copy and paste the produced output, and off I go. Where I need to actually write things, that’s straightforward.

Styling, however, is hard. I get to build my own style (I call this one ‘SIGURG’), and, while I get to start with Bootstrap, it’s not nice.

I moved from CSS to LESS around the time I started really playing with Twitter Bootstrap. However, I’ve recently switched most of my stuff to use SCSS (“Sassy CSS”) and unsurprisingly it’s easier to get stuff done.

The Sass language itself feels silly — and I have known problems with the notion of indentation significance — but SCSS is surprisingly pleasant as a styling language. It has interesting quirks, but it’s easier to structure stylesheets in a sane way that way. And migrating LESS to SCSS is trivial. They’re pretty much identical, except for some edge-cases about LESS’ mixins, which must be @included in SCSS.

And then there’s Bootstrap itself, which, sadly, is written in LESS. LESS has some nice features, like it’s simplicity, but I much prefer the limitation of brain-damage that SCSS presents. Sure, it’s not as trivial to parse it with JavaScript, but do I really care? No. Not for trading off that much functionality.

Bootstrap could easily take advantage of some beautiful mixin support in SCSS. It’s a crying shame that it doesn’t, especially in the official port, which is called, unhelpfully, bootstrap-sass

But I digress.

I’ve actually made my styleset more legible by simply switching to SCSS, and, although my build is marginally slower — I use Compass because I’m too lazy to work out how to do dependency tracking of both Sass and SCSS, and to make them interoperate nicely — I gain so much that it’s not worth choosing anything less (hah!) than SCSS.