ViMaSter/hackertours-theme
Watch
0
0
Fork
You've already forked hackertours-theme
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Rework the tables componets styles to work for all browsers, :has() support is limited.

Browse source
This commit is contained in:
Fredrik Jonsson 2023-04-24 09:20:25 +02:00
commit 3bf7c9ad3a
1 changed files with 21 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

31
assets/sass/components/tables/_tables.scss
View file

@ -7,17 +7,22 @@
padding: var(--padding); padding: var(--padding);
} }
tr:nth-child(odd) { thead {
tr {
background-color: var(--color-row-header);
}
}
tbody {
tr {
&:nth-child(odd) {
background-color: var(--color-row-odd); background-color: var(--color-row-odd);
} }
tr:nth-child(even) { &:nth-child(even) {
background-color: var(--color-row-even); background-color: var(--color-row-even);
} }
}
// Add first-of-type to increase specificity.
tr:first-of-type:has(th) {
background-color: var(--color-row-header);
} }
} }
@ -26,11 +31,6 @@
--padding: .5rem; --padding: .5rem;
@include respond-to-max(s) { @include respond-to-max(s) {
th,
td {
padding: var(--padding);
}
th { th {
display: none; display: none;
} }
@ -44,7 +44,14 @@
content: attr(aria-label) ':'; content: attr(aria-label) ':';
font-weight: var(--fw-bold); font-weight: var(--fw-bold);
} }
}
&:first-of-type {
padding-block-start: var(--padding);
} }
&:last-of-type {
padding-block-end: var(--padding);
}
}
}
} }