Bones/src/scss/_tables.scss

144 lines
3.7 KiB
SCSS

//
// #Tables
// --------------------------------------------------
// The majority of concepts here are shamelessly borrowed from Bootstrap and amended to fit
// https://raw.github.com/twitter/bootstrap/master/less/tables.less
table {
max-width: 100%;
background: $table_background;
border-collapse: collapse;
border-spacing: 0;
width: 100%;
margin: $table_margin;
th,
td {
padding: $table_td_th_padding;
line-height: $table_td_th_line_height;
text-align: left;
vertical-align: top;
border-top: 1px solid $table_border_colour;
}
th {
font-weight: bold;
}
thead th {
vertical-align: bottom;
}
caption thead tr:first-child th,
caption thead tr:first-child td,
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;
}
tbody tbody {
border-top: 2px solid $table_border_colour;
}
table {
background: $table_background;
}
}
.table-condensed {
th,
td {
padding: $table_condensed_padding;
}
}
.table-bordered {
border: 1px solid $table_border_colour;
border-collapse: separate;
border-left: 0;
@include border-radius($table_border_radius);
th,
td {
border-left: 1px solid $table_border_colour;
}
caption thead tr:first-child th,
caption tbody tr:first-child th,
caption tbody tr:first-child td,
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;
}
thead:first-child tr:first-child > th:first-child,
tbody:first-child tr:first-child > td:first-child,
tbody:first-child tr:first-child > th:first-child {
@include border-top-left-radius($table_border_radius);
}
thead:first-child tr:first-child > th:last-child,
tbody:first-child tr:first-child > td:last-child,
tbody:first-child tr:first-child > th:last-child {
@include border-top-right-radius($table_border_radius);
}
thead:last-child tr:last-child > th:first-child,
tbody:last-child tr:last-child > td:first-child,
tbody:last-child tr:last-child > th:first-child,
tfoot:last-child tr:last-child > td:first-child,
tfoot:last-child tr:last-child > th:first-child {
@include border-bottom-left-radius($table_border_radius);
}
thead:last-child tr:last-child > th:last-child,
tbody:last-child tr:last-child > td:last-child,
tbody:last-child tr:last-child > th:last-child,
tfoot:last-child tr:last-child > td:last-child,
tfoot:last-child tr:last-child > th:last-child {
@include border-bottom-right-radius($table_border_radius);
}
tfoot tbody:last-child tr:last-child td:first-child {
@include border-bottom-left-radius(0);
}
tfoot tbody:last-child tr:last-child td:last-child {
@include border-bottom-right-radius(0);
}
caption thead tr:first-child th:first-child,
caption tbody tr:first-child td:first-child,
colgroup thead tr:first-child th:first-child,
colgroup tbody tr:first-child td:first-child {
@include border-top-left-radius($table_border_radius);
}
caption thead tr:first-child th:last-child,
caption tbody tr:first-child td:last-child,
colgroup thead tr:first-child th:last-child,
colgroup tbody tr:first-child td:last-child {
@include border-top-right-radius($table_border_radius);
}
}
.table-striped {
tbody {
> tr:nth-child(odd) > td,
> tr:nth-child(odd) > th {
background-color: $table_alt_colour;
}
}
}
.table-hover {
tbody {
tr:hover > td,
tr:hover > th {
background-color: $table_hover_colour;
}
}
}