Ordering of styles makes some button Bootstrap styles unusable

[ssorallen]

'static/bootstrap' is always included before 'static/atom', which means Atom's styles win on document order precedence. Atom's buttons.less re-declares the .btn class, which means its styles have the same specificity as Bootstrap's button "sub"classes like .btn-link.

<button class="btn btn-link"></button> inside Atom looks like a regular button because Atom's .btn declares background color and border, overriding the .btn-link declaration.

Is it feasible to import Bootstrap as less and set Less variables for Bootstrap rather than re-declaring the class names? Bootstrap exposes dozens of variables for customization: http://getbootstrap.com/customize/

[benogle]

Ideally, we'd like to get rid of bootstrap at some point. cc @simurai

[mnquintana]

Refs #6351

IMO, if we are going to phase out Bootstrap, we should do it piece-by-piece (and honestly, we may end up deciding to keep Tooltips, if nothing else - that component is rather handy).

[ssorallen]

I'm not sold that Bootstrap was a bad idea, but the way customization was done (re-declaring classes from Bootstrap) makes it difficult to know which pieces of Bootstrap actually work as expected inside Atom.

[benogle]

IMO, if we are going to phase out Bootstrap, we should do it piece-by-piece

I agree with this totally.

we may end up deciding to keep Tooltips, if nothing else

We would write our own implementation. They are currently kind of a jank part of the system, and it's tough to get fixes in if we need them.

[simurai]

The plan is to "merge" bootstrap/less/buttons.less into atom/static/buttons.less. Then there is less overriding needed and should simplify things a bit. Same with the rest of the components.

we may end up deciding to keep Tooltips

Not sure how to organize components that need JS. Maybe atom/static/js/tooltip.js. Or atom/static/tooltip/ that would contain CSS and JS. I think the tooltips in Atom also have other JS somewhere.

And then maybe move the whole atom/atom/static/ into an own package like atom/ui-kit or so.

[simurai]

The button styles got moved to https://github.com/atom/atom-ui a while ago. Please holler if this is still an issue.

[lock]

This issue has been automatically locked since there has not been any recent activity after it was closed. If you can still reproduce this issue in Safe Mode then please open a new issue and fill out the entire issue template to ensure that we have enough information to address your issue. Thanks!