add something like semantic.gs?

[moleculezz]

I like semantic.gs approach to the grid system. https://github.com/twigkit/semantic.gs
Wouldn't this be a nice feature to add to the bootstrap?

[fat]

Mark's working on some cool grid stuff for 2.0 - responsive, etc. But we'll take a look at what they're doing, thanks!

[gagarine]

Just to be clear. You can use makeColumn to make a column.

// makeColumn can be used to mark any element (e.g., .content-primary) as a column without changing markup to .span something
.makeColumn(@columnSpan: 1) {
  .gridColumn();
  .columns(@columnSpan);
}

and to make a row just .row I guess.

[akshatpradhan]

gagarine, this doesn't work. The closest I could get was this for twitter bootstrap 2:

//custom-mixins.less
.col (@col) {
  #gridSystem > .gridColumn(@gridGutterWidth);
  #gridSystem > .columns(@gridGutterWidth, @gridColumnWidth, @gridRowWidth, @col);
}

//styles.less
  .greetings {
  .col(3);
}

lessc will generate the following in styles.css

//styles.css
.greetings {
  float: left;
  margin-left: 20px;
  width: 220px;
}

[gagarine]

Did you try?:

.myclassColumn{
makeColumn(2)
}

What CSS this will generate?

I will like to reopen the issue because @fat didn't really answer the question but I don't have the right for that.

[kristianmandrup]

Has anyone got this working or gone further down this road?
I'd really like to use Twitter Bootstrap with Semantic markup as much as possible!

Check this: https://gist.github.com/1792587#comments

The best I could find so far.... anyone?

[fabiozc]

I wont use the Twitter Bootstrap grid because i dont want do write the size of column on my HTML, but I spent at least 2 days searching for some way to make this happen from my less file!

This code bellow works to make certain column get width, but, not like a grid system.
.grid(@col){ #grid .core .span(@col);}
.sidebar{ .grid(4);}

I'll keep looking for.

Twitter bootstrap guys, PLEASE, make us more happy! =)

[fabiozc]

Done! Sorry for the last post =)

Try this:

.content{ .makeRow();
.main-content{ .makeColumn(5);}
.sidebar{ .makeColumn(3); }
}

Finally!

[kristianmandrup]

Yeah! Great stuff!!!
I think I will make a separate github project called semantic-sass-bootstrap, with mixin functions around bootstrap elements to allow creation of semantic elements in order to avoid having to hardcode the layout classes on the DOM elements.
For now, the focus will be on buttons, navigation and grid elements (what other elements are essential?).
A similar project could be made (kept in sync?) for less ;) What do u think?

[kristianmandrup]

Here it is... just on the idea stage, suggestions are welcome. targeting 2.0.4 for now, until bootstrap-sass catches up with 2.1 (or is there a more recent or better sass bootstrap out there?)

https://github.com/kristianmandrup/semantic-sass-bootstrap

[kristianmandrup]

There i a good article about how to achieve semantic bootstrap here:

http://ruby.bvision.com/blog/please-stop-embedding-bootstrap-classes-in-your-html