Make tables responsive

This commit is contained in:
Timothy Warren 2018-11-05 11:04:19 -05:00
parent 4b75987f21
commit 24f80bc18c
2 changed files with 33 additions and 7 deletions

File diff suppressed because one or more lines are too long

View File

@ -13,7 +13,7 @@
max-width: none; max-width: none;
width: 100%; width: 100%;
} }
/* aside.info { /* aside.info {
order: 1; order: 1;
} */ } */
@ -23,7 +23,7 @@
* { * {
max-width: none !important; max-width: none !important;
} }
table { table {
box-shadow: none; box-shadow: none;
} }
@ -32,6 +32,36 @@
.details .flex > * { .details .flex > * {
margin: 0; margin: 0;
} }
table,
table th,
table td,
table .align-right,
table.align-center {
border: 0;
display: block;
margin: 0 auto;
text-align: left;
width: 100%;
}
table td {
display: inline-block;
}
table.media-details td {
display: block;
text-align: left !important;
}
table thead {
display: none;
}
.details .media-details td:nth-child(2n+1) {
font-weight: bold;
width: 100%;
}
} }
@media screen and (max-width: 40em) { @media screen and (max-width: 40em) {
@ -50,10 +80,6 @@
padding: 0 0.5rem 0.5rem; padding: 0 0.5rem 0.5rem;
} }
table {
display: block;
}
.media { .media {
margin: 2px 0; margin: 2px 0;
} }