diff options
Diffstat (limited to 'app/assets/stylesheets/content/_table.scss')
-rw-r--r-- | app/assets/stylesheets/content/_table.scss | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/app/assets/stylesheets/content/_table.scss b/app/assets/stylesheets/content/_table.scss new file mode 100644 index 0000000..d70cfd7 --- /dev/null +++ b/app/assets/stylesheets/content/_table.scss @@ -0,0 +1,50 @@ +/** + * Table + */ + +// Reboot based on : +// - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css +// - sanitize.css v13.0.0 | CC0 1.0 Universal | github.com/csstools/sanitize.css +// –––––––––––––––––––– + +// 1. Collapse border spacing in all browsers (opinionated) +// 2. Remove text indentation from table contents in Chrome, Edge, and Safari +:where(table) { + width: 100%; + border-collapse: collapse; // 1 + border-spacing: 0; + text-indent: 0; // 2 +} + +// Pico +// –––––––––––––––––––– + +// Cells +th, +td { + padding: calc(var(--spacing) / 2) var(--spacing); + border-bottom: var(--border-width) solid var(--table-border-color); + color: var(--color); + font-weight: var(--font-weight); + font-size: var(--font-size); + text-align: left; + text-align: start; +} + +// 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); + } + } +} |