Striped table rows cleancss fix

[Yohn]

Its a little dirty, but it works. CleanCSS was causing the issue, and we can tell it to not modify that code block. I tried it a few different ways before I settings with this.

[lucaslarroche]

@Yohn, great find, you are right, it's the minifier.

I did more tests and actually we could do this:

tbody {
  // Striped rows skip hidden elements (`odd of :not([hidden])`), `:is()` prevents minifier issues.
  tr:is(:nth-child(odd of :not([hidden]))) {
    th,
    td {
      background-color: var(#{$css-var-prefix}table-row-stripped-background-color);
    }
  }
}

What do you think?

[Yohn]

Nice find! Idk why I didn't think to try is() when I was messing with that. I'll modify this pull request for that change.

[Amaury]

We applied this fix in µCSS, using tr:nth-child(odd of :not([hidden])) with a basic tr:nth-child(odd) fallback for older browsers.

We didn't need the :is() wrapper since µCSS doesn't use CleanCSS.