Difference between revisions of "Foreground.css"
From Sega Retro
Scarred Sun (talk | contribs) |
Scarred Sun (talk | contribs) |
||
(30 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
− | + | @media (max-width: 40em) { | |
− | + | /* Hide column labels */ | |
− | + | .filehistory thead tr { | |
− | + | position: absolute; | |
− | . | + | top: -9999em; |
− | + | left: -9999em; | |
− | + | } | |
− | + | .filehistory tr { | |
− | . | + | border-bottom: 0; |
− | + | } | |
− | + | /* Leave a space between table rows */ | |
− | + | .filehistory tr + .filehistory tr { | |
− | + | margin-top: 1.5em; | |
− | + | } | |
− | . | + | .filehistory th {display:none;} |
− | . | + | /* Get table cells to act like rows */ |
− | + | .filehistory tr, | |
− | + | .filehistory td { | |
− | . | + | display: block; |
− | . | + | } |
− | + | .filehistory td { | |
− | + | border: none; | |
− | + | /* Leave a space for data labels */ | |
− | + | padding-left: 50%; | |
− | + | } | |
− | + | /* Add data labels */ | |
− | + | .filehistory td:before { | |
− | + | content: attr(data-label) " "; | |
− | + | display: block; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | } | ||
− | |||
− | content: " | ||
− | |||
font-weight: bold; | font-weight: bold; | ||
− | + | } | |
− | |||
− | |||
− | |||
− | |||
− | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
+ | /* Stack labels vertically on smaller screens */ | ||
+ | @media (max-width: 20em) { | ||
+ | .filehistory td { | ||
+ | padding-left: 0.75em; | ||
+ | } | ||
+ | .filehistory td:before { | ||
+ | display: block; | ||
+ | margin-bottom: 0.75em; | ||
+ | margin-left: 0; | ||
+ | } | ||
} | } |
Latest revision as of 13:54, 6 September 2020
@media (max-width: 40em) { /* Hide column labels */ .filehistory thead tr { position: absolute; top: -9999em; left: -9999em; } .filehistory tr { border-bottom: 0; } /* Leave a space between table rows */ .filehistory tr + .filehistory tr { margin-top: 1.5em; } .filehistory th {display:none;} /* Get table cells to act like rows */ .filehistory tr, .filehistory td { display: block; } .filehistory td { border: none; /* Leave a space for data labels */ padding-left: 50%; } /* Add data labels */ .filehistory td:before { content: attr(data-label) " "; display: block; font-weight: bold; } } /* Stack labels vertically on smaller screens */ @media (max-width: 20em) { .filehistory td { padding-left: 0.75em; } .filehistory td:before { display: block; margin-bottom: 0.75em; margin-left: 0; } }