News for hackers. Stuff that matters.
Re:Scalable and Maintainable CSS Approaches by roryokane on Saturday June 16, 2012 @03:58PM (#4121442)
If that's the case, I would be interested to see a tutorial on OOCSS that assumes you're already using Sass, and skips explaining the parts of OOCSS that Sass already solves. I hadn't really taken OOCSS seriously because I thought Sass solved everything that OOCSS did.
Re:Scalable and Maintainable CSS Approaches by cwebbdesign on Saturday June 16, 2012 @04:11PM (#4121480)
There's a good starting tutorial in the SMACSS book discussing the integration of SMACSS and preprocessors. I'll see if I can make some time to write a more in-depth treatment discussing pre-processors and OOCSS. If anybody already knows of one, I'd love to see it as well!
Re:Scalable and Maintainable CSS Approaches by philipwalton on Saturday June 16, 2012 @06:56PM (#4121705)
What part of OOCSS do you think SASS already solves? Perhaps there's some disagreement about this that can help me answer your question.
Re:Scalable and Maintainable CSS Approaches by nilliams on Sunday June 17, 2012 @05:32AM (#4122575)
I would assume (perhaps wrongly?) he's referring to mixins, which allow you to easily re-use chunks of declarations (or objects). The pure OOCSS alternative to this is to separate your classes more.

Quick example, OOCSS way of making the notion of 'fancifying a thing', is to make a separate class to represent 'fanciness'.

  .fancy { color: hotpink; font-style: italic }
  .thing { width: 100px; height: 40px }
Then in your HTML apply both classes to make a fancy thing: <div class="thing fancy">ta-da</div>

Whereas in SASS you could do that with a mixin instead:

  @mixin fancy { color: hotpink; font-style: italic }
  .fancy-thing { width: 100px; height: 40px; @include fancy }
And in your HTML, you then apply a single class: <div class="fancy-thing">bam</div>

There are advantages of both, and there are clearly variations you could make on the SASS version (i.e. you could make a separate thing mixin too, then mix both into a single fancy-thing class - making the thing concept as reusable as in the CSS version).

Personally I like the level of understanding that doing it the CSS way brings (note this is also an example of the separating 'skin' from 'structure' idea, which I think is very valuable). You could argue that it could lead to class-itis though. Swings and roundabouts.