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

@ -32,6 +32,36 @@
.details .flex > * {
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) {
@ -50,10 +80,6 @@
padding: 0 0.5rem 0.5rem;
}
table {
display: block;
}
.media {
margin: 2px 0;
}