snappymail/vendors/bootstrap/less/tables.less
2021-09-17 12:08:16 +02:00

124 lines
2.9 KiB
Text

//
// Tables
// --------------------------------------------------
// BASE TABLES
// -----------------
// table {
.table {
max-width: 100%;
background-color: @tableBackground;
border-collapse: collapse;
border-spacing: 0;
width: 100%;
margin-bottom: @baseLineHeight;
// Cells
th,
td {
padding: 8px;
line-height: @baseLineHeight;
text-align: left;
vertical-align: text-top;
border-top: 1px solid @tableBorder;
}
th {
font-weight: bold;
}
// Bottom align for column headings
thead th {
vertical-align: bottom;
}
// Remove top border from thead by default
colgroup + thead tr:first-child th,
colgroup + thead tr:first-child td,
thead:first-child tr:first-child th,
thead:first-child tr:first-child td {
border-top: 0;
}
}
// BORDERED VERSION
// ----------------
.table-bordered {
border: 1px solid @tableBorder;
border-collapse: separate; // Done so we can round those corners!
border-radius: 4px;
th + th,
td + td {
border-left: 1px solid @tableBorder;
}
// Prevent a double border
colgroup + thead tr:first-child th,
colgroup + tbody tr:first-child th,
colgroup + tbody tr:first-child td,
thead:first-child tr:first-child th,
tbody:first-child tr:first-child th,
tbody:first-child tr:first-child td {
border-top: 0;
}
// For first th or td in the first row in the first thead or tbody
thead:first-child tr:first-child th:first-child,
tbody:first-child tr:first-child td:first-child {
border-radius: 4px 0 0 0;
}
thead:first-child tr:first-child th:last-child,
tbody:first-child tr:first-child td:last-child {
border-radius: 0 4px 0 0;
}
// For first th or td in the first row in the first thead or tbody
thead:last-child tr:last-child th:first-child,
tbody:last-child tr:last-child td:first-child,
tfoot:last-child tr:last-child td:first-child {
border-radius: 0 0 0 4px;
}
thead:last-child tr:last-child th:last-child,
tbody:last-child tr:last-child td:last-child,
tfoot:last-child tr:last-child td:last-child {
border-radius: 0 0 4px 0;
}
// Special fixes to round the left border on the first td/th
colgroup + thead tr:first-child th:first-child,
colgroup + tbody tr:first-child td:first-child {
border-radius: 4px 0 0 0;
}
colgroup + thead tr:first-child th:last-child,
colgroup + tbody tr:first-child td:last-child {
border-radius: 0 4px 0 0;
}
}
// ZEBRA-STRIPING
// --------------
// Default zebra-stripe styles (alternating gray and transparent backgrounds)
.table-striped {
tbody {
tr:nth-child(odd) td,
tr:nth-child(odd) th {
background-color: @tableBackgroundAccent;
}
}
}
// HOVER EFFECT
// ------------
// Placed here since it has to come after the potential zebra striping
.table-hover {
tbody {
tr:hover td,
tr:hover th {
background-color: @tableBackgroundHover;
}
}
}