WIP: Simplifies and improves table backgrounds#24660
WIP: Simplifies and improves table backgrounds#24660andresgalante wants to merge 2 commits intov4-devfrom
Conversation
|
I'm definitely in favor of this, but I always thought there was some specificity reason that led to the current solution. Only @mdo can confirm :) |
|
I think the move from Less to Sass is what broke these selectors. I can't recall any other background on why it's coded the way it is, so I'm definitely open to changing it. |
|
@mdo right! I'll work on it |
53c8664 to
05919cc
Compare
|
@mdo This is a horrible solution, but it fixes the problem. At the moment a stripe table will overide active states: And it has all the problems described above. This horrible selector is needed to get our way around tables when @XhmikosR @mdo can you please take another spin on this one and see what I am missing, or if we can improve the selector |
| .table-striped { | ||
| tbody tr:nth-of-type(odd) { | ||
| background-color: $table-accent-bg; | ||
| /* stylelint-disable */ |
There was a problem hiding this comment.
@andresgalante: please be more explicit with what you disable here.
| &.table-striped { | ||
| tbody tr:nth-of-type(odd) { | ||
| background-color: $table-dark-accent-bg; | ||
| /* stylelint-disable */ |
|
Quick update from me—I've been trying to look into this here and there to see what else can be done with our selectors. Still trying, but not a top priority for me or block to v4 stable right now. |
|
Closing as stale and as something to revisit in v5. |


This PR is needs more clean up and better organization, but bare with me.
The way we use selectors for background on tables doesn't allow to have a different colors within a row, for example:
It also doesn't allow to mark something as active like this:
or to mark something as active within an active row like this:
... and it produces issues like the one described on #24529
By simplifying the selectors it resolves it and I don't see conflicts with nested tables or
.table-striped. I tried to digg up the history of this selector but I couldn't find the root.@mdo @XhmikosR Can you please point me out what I am missing so I can continue with this PR?
Thanks a lot!
This is a WIP but when it's done it will close #24529