mirror of
https://github.com/picocss/pico.git
synced 2025-04-21 17:16:14 -04:00
Merge pull request #98 from picocss/fix/table
Tables: Remove explicit background-color and add tfoot support
This commit is contained in:
commit
ab75fca7d1
24 changed files with 97 additions and 44 deletions
|
@ -168,11 +168,13 @@ h5 {
|
|||
}
|
||||
|
||||
thead th,
|
||||
thead td {
|
||||
thead td,
|
||||
tfoot th,
|
||||
tfoot td {
|
||||
--border-width: 3px;
|
||||
}
|
||||
|
||||
:not(thead) > * > td {
|
||||
:not(thead):not(tfoot) > * > td {
|
||||
--font-size: 0.875em;
|
||||
}
|
||||
|
||||
|
@ -1663,12 +1665,14 @@ td {
|
|||
text-align: start;
|
||||
}
|
||||
|
||||
tr {
|
||||
background-color: var(--background-color);
|
||||
tfoot th,
|
||||
tfoot td {
|
||||
border-top: var(--border-width) solid var(--table-border-color);
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
table[role=grid] tbody tr:nth-child(odd) {
|
||||
--background-color: var(--table-row-stripped-background-color);
|
||||
background-color: var(--table-row-stripped-background-color);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
File diff suppressed because one or more lines are too long
2
css/pico.classless.min.css
vendored
2
css/pico.classless.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
14
css/pico.css
14
css/pico.css
|
@ -173,11 +173,13 @@ h5 {
|
|||
}
|
||||
|
||||
thead th,
|
||||
thead td {
|
||||
thead td,
|
||||
tfoot th,
|
||||
tfoot td {
|
||||
--border-width: 3px;
|
||||
}
|
||||
|
||||
:not(thead) > * > td {
|
||||
:not(thead):not(tfoot) > * > td {
|
||||
--font-size: 0.875em;
|
||||
}
|
||||
|
||||
|
@ -1850,12 +1852,14 @@ td {
|
|||
text-align: start;
|
||||
}
|
||||
|
||||
tr {
|
||||
background-color: var(--background-color);
|
||||
tfoot th,
|
||||
tfoot td {
|
||||
border-top: var(--border-width) solid var(--table-border-color);
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
table[role=grid] tbody tr:nth-child(odd) {
|
||||
--background-color: var(--table-row-stripped-background-color);
|
||||
background-color: var(--table-row-stripped-background-color);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -168,11 +168,13 @@ h5 {
|
|||
}
|
||||
|
||||
thead th,
|
||||
thead td {
|
||||
thead td,
|
||||
tfoot th,
|
||||
tfoot td {
|
||||
--border-width: 3px;
|
||||
}
|
||||
|
||||
:not(thead) > * > td {
|
||||
:not(thead):not(tfoot) > * > td {
|
||||
--font-size: 0.875em;
|
||||
}
|
||||
|
||||
|
@ -1633,12 +1635,14 @@ td {
|
|||
text-align: start;
|
||||
}
|
||||
|
||||
tr {
|
||||
background-color: var(--background-color);
|
||||
tfoot th,
|
||||
tfoot td {
|
||||
border-top: var(--border-width) solid var(--table-border-color);
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
table[role=grid] tbody tr:nth-child(odd) {
|
||||
--background-color: var(--table-row-stripped-background-color);
|
||||
background-color: var(--table-row-stripped-background-color);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
File diff suppressed because one or more lines are too long
2
css/pico.fluid.classless.min.css
vendored
2
css/pico.fluid.classless.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
2
css/pico.min.css
vendored
2
css/pico.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -105,11 +105,13 @@ h5 {
|
|||
}
|
||||
|
||||
thead th,
|
||||
thead td {
|
||||
thead td,
|
||||
tfoot th,
|
||||
tfoot td {
|
||||
--border-width: 3px;
|
||||
}
|
||||
|
||||
:not(thead) > * > td {
|
||||
:not(thead):not(tfoot) > * > td {
|
||||
--font-size: 0.875em;
|
||||
}
|
||||
|
||||
|
@ -1393,12 +1395,14 @@ td {
|
|||
text-align: start;
|
||||
}
|
||||
|
||||
tr {
|
||||
background-color: var(--background-color);
|
||||
tfoot th,
|
||||
tfoot td {
|
||||
border-top: var(--border-width) solid var(--table-border-color);
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
table[role=grid] tbody tr:nth-child(odd) {
|
||||
--background-color: var(--table-row-stripped-background-color);
|
||||
background-color: var(--table-row-stripped-background-color);
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
File diff suppressed because one or more lines are too long
2
css/pico.slim.min.css
vendored
2
css/pico.slim.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -169,11 +169,13 @@ h5 {
|
|||
}
|
||||
|
||||
thead th,
|
||||
thead td {
|
||||
thead td,
|
||||
tfoot th,
|
||||
tfoot td {
|
||||
--border-width: 3px;
|
||||
}
|
||||
|
||||
:not(thead) > * > td {
|
||||
:not(thead):not(tfoot) > * > td {
|
||||
--font-size: 0.875em;
|
||||
}
|
||||
|
||||
|
|
File diff suppressed because one or more lines are too long
2
css/themes/default.min.css
vendored
2
css/themes/default.min.css
vendored
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -58,6 +58,16 @@
|
|||
<td>Cell</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<th scope="row">#</th>
|
||||
<td>Total</td>
|
||||
<td>Total</td>
|
||||
<td>Total</td>
|
||||
<td>Total</td>
|
||||
<td>Total</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</figure>
|
||||
|
||||
|
@ -98,6 +108,16 @@
|
|||
<<b>td</b>>Cell</<b>td</b>>
|
||||
</<b>tr</b>>
|
||||
</<b>tbody</b>>
|
||||
<<b>tfoot</b>>
|
||||
<<b>tr</b>>
|
||||
<<b>th</b> <i>scope</i>=<u>"col"</u>>#</<b>th</b>>
|
||||
<<b>td</b> <i>scope</i>=<u>"col"</u>>Total</<b>td</b>>
|
||||
<<b>td</b> <i>scope</i>=<u>"col"</u>>Total</<b>td</b>>
|
||||
<<b>td</b> <i>scope</i>=<u>"col"</u>>Total</<b>td</b>>
|
||||
<<b>td</b> <i>scope</i>=<u>"col"</u>>Total</<b>td</b>>
|
||||
<<b>td</b> <i>scope</i>=<u>"col"</u>>Total</<b>td</b>>
|
||||
</<b>tr</b>>
|
||||
</<b>tfoot</b>>
|
||||
</<b>table</b>></code></pre>
|
||||
|
||||
<p><code><i>role</i>=<u>"grid"</u></code> enable striped rows.</p>
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -33,16 +33,20 @@ td {
|
|||
text-align: start;
|
||||
}
|
||||
|
||||
// Rows
|
||||
tr {
|
||||
background-color: var(--background-color);
|
||||
// Footer
|
||||
tfoot {
|
||||
th,
|
||||
td {
|
||||
border-top: var(--border-width) solid var(--table-border-color);
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Striped
|
||||
table {
|
||||
&[role="grid"] {
|
||||
tbody tr:nth-child(odd) {
|
||||
--background-color: var(--table-row-stripped-background-color);
|
||||
background-color: var(--table-row-stripped-background-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -211,14 +211,15 @@ h5 {
|
|||
}
|
||||
|
||||
// Table
|
||||
thead {
|
||||
thead,
|
||||
tfoot {
|
||||
th,
|
||||
td {
|
||||
--border-width: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
:not(thead) > * > td {
|
||||
:not(thead):not(tfoot) > * > td {
|
||||
--font-size: 0.875em;
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue