[KaoruAoiShiho]

While Bootstrap is "great" it really needs a viable competitor. There's a tons of things that could be done better.

The competitor must be really nice looking by default, responsive, use Stylus/Sass not LESS, and be modular. There isn't one today, but I hope there will be one in 2013.

[rcsorensen]

I've been using https://github.com/thomas-mcdonald/bootstrap-sass as a SASS version of Bootstrap. It's a nice project, with native support for Compass, so no Rails dependency. ( https://github.com/thomas-mcdonald/bootstrap-sass#compass )

[recycledair]

Zurb Foundation seems to be what you are looking for. It uses SASS and actually predates bootstrap and is being actively maintained. Its a great alternative. http://foundation.zurb.com

[markdotto]

It does use Sass, but was released after Bootstrap.

[sontek]

Bootstrap came out of Zurb, Mark worked with them and learned everything, and then when he went to Twitter he re-used a bunch of zurb to create the first version of bootstrap.

Discussion here: http://news.ycombinator.com/item?id=4588053

[J-H]

Do you realize you are replying to the Mark you're referencing in your comment?

[idan]

Zurb Foundation. (http://foundation.zurb.com)

[zupreme]

Thanks for posting this. I have never heard of ZURB Foundation before, but it looks like exactly what I need for an upcoming project. Thanks again!

[jsdalton]

> use Stylus/Sass not LESS

I really like LESS. What am I missing out on?

[rcsorensen]

The thing that finally pushed me off LESS was animations, and the contortions necessary to get to something even approximating DRY for some concepts.

I think it might be a result of trying to be "better CSS" instead of "a language for generating CSS".

Say you wanted to delay a slide-in-right animation for 50ms per list item. (So item 1 slides in immediately, item 2 50ms later, item 3 50ms later, etc.)

For that portion, this is what the LESS looks like:

  -animation-delay(@delay) { animation-delay: @delay; ...vendor prefixes... }
  .delay-child-animations {
    &:nth-child(2n){ .animation-delay: 50ms;  }
    &:nth-child(3n){ .animation-delay: 100ms;  }
    &:nth-child(4n){ .animation-delay: 150ms;  }
    ... more things here ...
  }

In SASS, we could do something like

  @mixin delay-child-animations($max-children: 20) {
    @for $i from 1 to $max-children {
      &:nth-child(#{$i}n){ .animation-delay: ($i - 1)*50ms;
    }
  }

References:

http://stackoverflow.com/questions/8294400/css-animations-wi... http://radiatingstar.com/css-keyframes-animations-with-less

[pdog]

"Sass is better on a whole bunch of different fronts, but if you are already happy in LESS, that's cool, at least you are doing yourself a favor by preprocessing."

http://css-tricks.com/sass-vs-less/

[ahoge]

Compass (which was built on top of Sass) does sprite sheet generation and cache busting. It's also shipped with a bunch of pre-defined CSS3 mixins.

Sass also allows you to put media queries inside your rule blocks. (In the future, this will be also possible in regular CSS.)

[SkyMarshal]

Fwiw, here's why Bootstrap uses LESS instead Stylus/Sass:

http://www.quora.com/Bootstrap-front-end-framework/Why-did-T...

[mylittlepony]

I too want to know this.

[lemieux]

What about Zurb Foundation?

[jschuur]

Indeed: http://foundation.zurb.com/

[sontek]

Zurb is definitely the way to go. It is a great product.

[cvrajeesh]

I really liked Foundation framework. It is responsive by default, now it my first choice for public facing site. Bootstrap I use mainly for for admin interface.

[mixmastamyk]

And perhaps focused on the semantic web instead of presentation? A guy here turned me on to the idea, although I'm not sure I yet completely understand how it would go from the abstract to the concrete.