Screencast: A CSS Framework that is actually a framework. | Hacker News Reader

Screencast: A CSS Framework that is actually a framework.

vimeo.com

69 pointschriseppstein14 comments

Hour long video behind the submitted link. Some bite-sized info about Compass for those who don't want to watch the whole thing:

With Compass, you write your styles in Sass which is compiled to CSS. This helps with code reuse and general cleanliness, not unlike the tool demo'd in the Reddit keynote at PyCon.

You can use Compass to create CSS styles on top of a framework like BluePrint or YUI, which is why Compass calls itself a meta-framework.

Website: http://compass-style.org/

More Info: http://wiki.github.com/chriseppstein/compass

Great link. If you haven't checked this out, do so. I've been using SASS for about 2 years and Compass for about 6 months now and its completely changed that way I do CSS development.

Chris Eppstein is doing amazing work. I think it'll revolutionize how web stylesheets are built.

for me haml/sass is a change like jquery was for html/js

now i have a superclean html structure with haml, the same superclean css structure with sass.

compass adds grid & other useful mixins and run-time automatic compilation of sass and haml files.

in plus everything is dry, my own set of mixins reusable in every web app are growing fast.

with compass growing up i think we'll have an API-like building tool for web frontends.

I used Compass + 960.gs on a recent project. It took me a while to understand, but once I got it, I really saw the value. Simply put, it makes producing good looking websites easier. I particularly like the helpers provided in the Utilities Module:

http://wiki.github.com/chriseppstein/compass/compass-core-ut...

I actually find Sass more useful than Haml. I find Haml gets in my way too much, and I'd rather do things in ERB.

I love HAML most of the time but my major beef with it is that it won't allow midline Ruby injection like ERB. This gets really lame, for instance if you have a <p> and you want to use multiple link_to()s inside it.

SASS + Compass, on the other hand, has been a boon to my productivity.

haml 2.2 has universal interpolation and when you put that together with say a markdown filter, writing your paragraphs of text in haml should be a breeze.

Hour long video explains what I could have picked up in 10 minutes of reading.

SASS looks like it could have been so much more. Its syntax differs from CSS in ways that it doesn't need to (specifically, requiring newlines and prohibiting multiple rules or selectors on a single line), and the lack of local variable also decreases one's mobility with the tool.

It's a good start, but it could have been so much better.

When there's something better, I'll gladly use that.

Until then, I think it's sad that you've chosen to focus on the "negatives" that are largely style instead of the positives that are the substance of the screencast.

For what it's worth, in about a day or so of hacking on the sass source code, one could change it to be white-space inactive and to just rely on css tokens. If someone cared enough, they could add that feature. But, it turns out no one has, because it takes all of 15 minutes to get used to it.

Sass actually does have local variables. All variables are local to the level of nesting at which they're declared.

Also, multiple properties on a single line is a feature planned for version 2.4.

I see the advantages to having CSS variables and all, but can anyone tell me why this (Sass/Compass) would be any better than me defining variables (like grid widths/colors/etc..) in something like PHP, running it through a CSS document and outputting that document as a CSS file?

I tried. If my screencast didn't convey that information, I failed. Did you watch it?

Coincidentally I'm watching Reddit's keynote from PyCon and they wrote their own CSS compiler called C55. Their keynote is at http://blip.tv/file/1951296/ and the slides at (starting with slide 29) http://www.slideshare.net/kn0thing/ride-the-snake-reddit-key...

The thing I like most about what they've done is to embed the functionality into CSS, rather than writing a new meta-language.

Good ideas keep getting re-invented. There's about 4 or 5 versions of this with slightly different syntax, etc. But Sass alone has scripting, mixins, and libraries. These are the language features that make compass possible.

From the feature set I see there, that is where Sass was about 1 to 1.5 years ago.

pretty interesting. blueprint and sass is a worthwhile combination i wouldn't fight. otherwise, i'd hesitate to use one or another as a standalone tool. haml(unrelated here) is the exception.

Reply on news.ycombinator.com