Change to adding bootstrap class to tables

Will add the responsive class to all tables
This commit is contained in:
Jake
2021-05-11 14:28:41 -07:00
parent 71d396450f
commit 155bb9e273
4 changed files with 11 additions and 71 deletions

View File

@@ -28,76 +28,6 @@ td:nth-child(1) {
}
// Tables on mobile
@include media-breakpoint-down(md) {
/* Force table to not be like tables anymore */
table, thead, tbody, th, td, tr {
display: block;
}
/* Hide table headers (but not display: none;, for accessibility) */
thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
tr {
margin: 0 0 1rem 0;
}
tr:nth-child(odd) {
background: #151515;
}
td {
/* Behave like a "row" */
border: none;
border-bottom: 1px solid #eee;
position: relative;
// padding-left: 25%;
}
td:before {
position: absolute;
/* Top/left values mimic padding */
top: 12px;
left: 6px;
width: 25%;
padding-right: 10px;
white-space: nowrap;
}
// display headers inline.
#table_accounts + table {
td {
padding-left: 25%;
}
td:nth-of-type(1):before { content: "Address"; }
td:nth-of-type(2):before { content: "Name"; }
td:nth-of-type(3):before { content: "Meaning"; }
td:nth-of-type(4):before { content: "Black Hole?"; }
}
#table_ledgers + table {
td {
padding-left: 25%;
}
td:nth-of-type(1):before { content: "Ledger Type:"; }
td:nth-of-type(2):before { content: "Open"; }
td:nth-of-type(3):before { content: "Closed"; }
td:nth-of-type(4):before { content: "Validated"; }
}
}
.dblue {
color: #656E81;