/** * Table */ // Reboot based on : // - normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css // - sanitize.css v12.0.1 | CC0 1.0 Universal | github.com/csstools/sanitize.css // –––––––––––––––––––– // 1. Collapse border spacing in all browsers (opinionated). // 2. Correct table border color inheritance in all Chrome, Edge, and Safari. // 3. Remove text indentation from table contents in Chrome, Edge, and Safari. table { width: 100%; border-color: inherit; // 2 border-collapse: collapse; // 1 border-spacing: 0; text-indent: 0; // 3 } // 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; } // Striped table { &[role="grid"] { tbody tr:nth-child(odd) { background-color: var(--table-row-stripped-background-color); } } }