Add a shortcode for folding rows of a table on small screens
This commit is contained in:
parent
c5a28bf7ef
commit
869f9d12c8
|
@ -149,10 +149,12 @@ table {
|
|||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
tr {
|
||||
@include below-container-width {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.fold-table + table {
|
||||
tr {
|
||||
@include below-container-width {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -160,11 +162,11 @@ td {
|
|||
@include below-container-width {
|
||||
overflow-x: auto;
|
||||
}
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
th {
|
||||
td, th {
|
||||
padding: 0.5rem;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
div.highlight tr {
|
||||
|
|
1
layouts/shortcodes/foldtable.html
Normal file
1
layouts/shortcodes/foldtable.html
Normal file
|
@ -0,0 +1 @@
|
|||
<span class="fold-table"></span>
|
Loading…
Reference in New Issue
Block a user