Very impressive CSS3 demo: CSS3 Planetarium

Re:Very impressive CSS3 demo: CSS3 Planetarium by nathos on Wednesday March 16, 2011 @03:56PM (#2333596)

Sass, at least with its default SCSS syntax, is a strict superset of CSS3 so it's a good place to start. Your existing CSS files can be processed by Sass without changes.

Combined with some of the great mixins provided with Compass: http://beta.compass-style.org/reference/compass/css3/transfo..., you can eliminate many of the vendor specific declarations.

[ Parent | on HN ]

Re:Very impressive CSS3 demo: CSS3 Planetarium by grayrest on Wednesday March 16, 2011 @05:20PM (#2333984)

They all either are or can be strict supersets of CSS3. What separates stylus is that you can write valid, non-superset CSS3 and invoke the appropriate functions/mixins:

    @import css3

    #transparent {
        opacity: 0.6;
    }

    ----

    #transparent {
      opacity: 0.6;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);
    }

That's input/output in stylus. This uses an `opacity` mixin defined that's being invoked without the optional parentheses and with the optional colon+semicolon.

I have the beginnings of the Compass CSS3 library that's on hold while TJ fixes bugs and adds features to cover edge cases. The eventual goal is the ability to write straight CSS3 and have everything work.

[ Parent | on HN ]