/** * 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-gutter) / 2) var(--spacing-gutter); border-bottom: 1px solid var(--table-border); color: var(--muted-text); font-size: 0.875rem; font-weight: var(--text-weight); text-align: left; } // Titles th, thead td { color: var(--text); font-size: 1rem; } // First row thead { th, td { border-bottom: 3px solid var(--table-border); } } // Striping table[role="grid"] { tbody tr:nth-child(odd) { background-color: var(--table-stripping); } }