557
edits
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
/* Universal responsive wrapper behavior */ | /* Universal responsive wrapper behavior */ | ||
.table-responsive { | .table-responsive { | ||
display: block; | display: block; | ||
| Line 7: | Line 8: | ||
/* Make focused wrappers keyboard-visible (a11y) */ | /* Make focused wrappers keyboard-visible (a11y) */ | ||
.table-responsive:focus { | .table-responsive:focus { | ||
outline: 2px solid #777; | outline: 2px solid #777; | ||
| Line 34: | Line 36: | ||
/* Opt-out: any table with .no-responsive will not be wrapped */ | /* Opt-out: any table with .no-responsive will not be wrapped */ | ||
.no-responsive { /* marker class only */ } | .no-responsive { /* marker class only */ } | ||
/* (Optional) tiny-screen tweaks */ | /* (Optional) tiny-screen tweaks */ | ||
@media (max-width: 480px) { | @media (max-width: 480px) { | ||
.wikitable td, .wikitable th { font-size: 14px; } | .wikitable td, .wikitable th { font-size: 14px; } | ||
} | } | ||
/* small arrows for sortable columns */ | /* small arrows for sortable columns */ | ||
table.sortable th.headerSortUp:after { content: " ▲"; } | table.sortable th.headerSortUp:after { content: " ▲"; } | ||
table.sortable th.headerSortDown:after { content: " ▼"; } | table.sortable th.headerSortDown:after { content: " ▼"; } | ||
/* keep word-wrap and mobile scroll (if you haven't already) */ | /* keep word-wrap and mobile scroll (if you haven't already) */ | ||
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; display:block; } | .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; display:block; } | ||
.wikitable td, .wikitable th { white-space: normal; word-break: break-word; padding:6px 8px; } | .wikitable td, .wikitable th { white-space: normal; word-break: break-word; padding:6px 8px; } | ||