3 ms·
Decouple Bootstrap from your html
- jmadsen 12y agojust an idea I'm playing with - I'm mostly back-end stuff, so interested in thoughts & opinions
- madeofpalk 12y agoTake a look at the Bootstrap LESS[1] source and see how they do it. Want an orange HN button? @brand-hn: #FC6621; .btn-hn { .button-variant(black; @brand-hn; darken(@brand-hn, 5%)); } <button class="btn btn-hn">Hacker News</button> Nearly every component of Bootstrap is made via these 'generator' mixins, including the grid (which is less than 40 lines of actual code)[2] Just don't be tempted to extend the 'base' classes. If you do something like this: .hacker-button { .btn; .button-variant(...); } <button class="hacker-button"></button> You might find it not working properly with things like the input or button groups, for example. [1]: https://github.com/twbs/bootstrap/blob/master/less/ https://github.com/twbs/bootstrap/blob/master/less/ [2]: https://github.com/twbs/bootstrap/blob/master/less/grid.less https://github.com/twbs/bootstrap/blob/master/less/grid.less