Add a shortcode for folding rows of a table on small screens

This commit is contained in:
Danila Fedorin 2022-09-10 17:20:54 -07:00
parent c5a28bf7ef
commit 869f9d12c8
2 changed files with 9 additions and 6 deletions

View File

@ -149,22 +149,24 @@ table {
padding: 0.5rem; padding: 0.5rem;
} }
.fold-table + table {
tr { tr {
@include below-container-width { @include below-container-width {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
} }
}
td { td {
@include below-container-width { @include below-container-width {
overflow-x: auto; overflow-x: auto;
} }
padding: 0.5rem;
} }
th { td, th {
padding: 0.5rem; padding: 0.5rem;
vertical-align: top;
} }
div.highlight tr { div.highlight tr {

View File

@ -0,0 +1 @@
<span class="fold-table"></span>