-
-
Notifications
You must be signed in to change notification settings - Fork 78.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Decoupling styles from HTML #18975
Comments
Bootstrap v4 is moving towards using explicit classes wherever feasible, and avoiding tag name selectors and child selectors, which should help with this generally, although perhaps not in the specific case of accordions. @wesleycho Out of curiosity, what's the technical reason that UI Bootstrap can't generate |
@cvrebert problem is that we must explicitly set the |
@wesleycho Could you set |
@cvrebert for those situations, that would work - for something like the carousel or tabs, in v3 they have some direct child selectors, which creates a tighter coupling. Perhaps this would be enough to override that problem though, would need to investigate this more deeply. |
As @cvrebert mentioned, we're trying to decouple structured markup from styles through the use of singular classes in our selectors. That's about all we can offer right now I'm afraid. |
Hello,
Just to give a background on this request, I am one of the developers on the UI Bootstrap project, and am on the ng-bootstrap team for implementing Bootstrap 4 with Angular 2 usage through writing idiomatic Angular 2 components around Bootstrap.
One problem we have had in UI Bootstrap with Bootstrap 3 is that the DOM structure is very tightly coupled by the CSS in a way that is hard to negotiate with. One example of this is with the accordion groups/tabs. There is no allowance for intermediary empty elements, so this creates a problem if our generated HTML ends up like
This situation results in third party libraries having to hack around this undesired coupling in a way that goes against consumption in libraries such as Angular. I realize in Bootstrap 4 that implementations are a little different, but a good solution here is important to us. Any guidance/thoughts on the Bootstrap's team's position here is much appreciated.
Reference to issue where this causes problem in Angular 1.x: angular/angular.js#13805
The text was updated successfully, but these errors were encountered: