Recently I walked into project that used Twitter bootstrap for the initial CSS. A prototype was built, relying on the bootstrap CSS, and from that point on it has been hassle to work with the CSS.
I'm really not sure I understand the strategy of dumping so many styles into the global name space. Basically, all of us have been working around the styling as we implement features.. a major refactor is in order and we will likely be ditching bootstrap.
Just a warning if you plan to build beyond the styles provided by bootstrap, it is not straightforward. Really, the entire set of styles should be contained within its own namespace or some other meaningful semantic convention.
Am I missing something? What is intended after 'boot'? am I really supposed to replace these global styles manually?
I suppose this is where you rely on the cascading thing - place a @import at the bottom of your bootstrap for your overrides.
Using a framework favors convention over configuration for the benefit of speed.
I especially like it because the team has a central set of documentation for the UI to use - that means if we override a style, if they followed the convention, everything works out better.
As a counterexample, I just built a site with Bootstrap, and I was very happy with the experience. It's the first site I've ever made that I think looks pretty good.
I worked around the styles I didn't want in two different ways. One, I built my own version of the css that excluded all the form styles (non-native controls are bad). This involved installing some packages that I didn't really understand but didn't need to. It took maybe five minutes start to finish. The second was simply overriding the CSS I didn't want. This is absolutely no different than what you do with any other website, where you're overriding the browser's default styles instead of Bootstrap's.
"This is absolutely no different than what you do with any other website, where you're overriding the browser's default styles instead of Bootstrap's"
Its different. There are all kinds of properties I don't want to have to override. This gives me the option of deleting code from bootstrap css or having duplicate css code in my project, every page load, and every rendering of the dom.
A prototype is fine, but once I'm working with a graphic designer, its mostly undoing vs overriding. Would be so much more bootstrap-able if the styles were constrained to classes.
I agree. The problem I'm facing now is that I customized a lot of the CSS styles directly, but with the new ongoing updates, it's not going to be easy to merge them through.
Deleting code from Bootstrap isn't a big deal, neither is having duplicate CSS. I'd rather do that than stick dozens of little classes everywhere. FWIW, if you prefer the class approach, it's probably not too big of a change to the .less files.
I found that it was much easier to work with bootstrap if you just download the long form css version. Although it is a larger file, it is more straightforward since you can see all of the css for each element and then customize accordingly. The point of bootstrap is that it provides some nice defaults for you to work with for all elements, so you can build simple apps quickly. It is the role of the developer to customize the defaults when they do not suit the needs of the project. It honestly isn't that hard if you know a decent amount of css to quickly customize the classes to suit your own needs.
I know what you're saying. I think the intent--read it in the issue tracker or mailing list--is to put more controls into variables.less and have more of the internal stuff key off what users set in there. As it stands, for instance, you can't even set the base font family. I hope the project moves in that direction. That said, the grid, mixins and forms are a great starting point to work from already.
I'm excited about the form states in this release as well as the bug fixes.
As a generalist developer who does a little bit of everything but has a hard time with the design side of things, I'm loving using Twitter Bootstrap on some of my personal projects. One example where I've used it is http://smacktweets.com. The header bar alone, while extremely simple, is so much better than what I probably would have done on my own.
Twitter Bootstrap gives you great looking design elements with very very little effort. If you are good with the design side of things it's probably overkill and heavier weight than you want in a boilerplate if you are going to customize everything anyways.
Skeleton (http://getskeleton.com/) is another great boiler plate that I have also enjoyed using on all kinds of projects. It is really just a boilerplate and doesn't have all the pretty design elements that bootstrap has.
Just wanted to say thanks for putting this out and for the community continuing development on it. I'm really enjoying it.
I'm really loving how fast they are pushing updates and just using Bootstrap in general. I've already used it for my startups new website (http://www.sponsorfied.com), which turned out pretty awesome, and the time I saved by using Bootstrap was pretty incredible.
I'm definitely using it for any side projects or sites I need to toss up without spending days on them.
It's really comprehensive and covers a lot more than other frameworks. I feel like with Bootstrap you could really crank out a web app, without having to do much presentationally.
The navigational aids also seem really helpful and the default typography and whatnot does look quite nice.
I'm a Rails n00b using bootstrap to get things to look decent so I'm not miserable every time I fire up my app. Thanks for the link, I'm using form_for and was having a few issues with styling..
I like almost everything about bootstrap, except for it's button states...
They don't feel right. The 'hover' state should be the 'down'(active) state; the hover state looks like button is pushed in. The hover needs some kind of glow or subtle gradient change, then when the button is clicked it needs to look like it's pushed in. It's strange they've done this because the buttons on twitter.com feel correct and get pushed in like real life buttons.
Also the fade animation on the button totally unnecessary, it just animates for the sake of being animated, it doesn't serve a purpose. Animations need to serve a purpose, such as the Mac App store whizzing purchased apps into the dock.
Everything else is pretty fantastic, but those button states make my skin crawl, they're the first thing to get changed if I'm using bootstrap.
Sadly there is not change log. I just scrolled through the doc and could not find any features. All this seems to be from 1.3.0 is bug fixes which make it a patch? Please correct me if I'm wrong and I missed something awesome ;)
What has kept me from using this is the lack of media-queries. After investigating the gh repo it looks like there is a 2.0 branch with a responsive design already being built. I'm not sure what keeps them from releasing it but it appears to work.
I'm really not sure I understand the strategy of dumping so many styles into the global name space. Basically, all of us have been working around the styling as we implement features.. a major refactor is in order and we will likely be ditching bootstrap.
Just a warning if you plan to build beyond the styles provided by bootstrap, it is not straightforward. Really, the entire set of styles should be contained within its own namespace or some other meaningful semantic convention.
Am I missing something? What is intended after 'boot'? am I really supposed to replace these global styles manually?