src/modules/app/less/tables.less
@import (reference) '~assets/styles/shared';
// TABLES
// Styles + mixins for the display of tables
.table-cell-spacing {
padding: 0.8em 0;
@media @breakpoint-mobile {
padding: 1.5em 0;
}
}
.table {
display: flex;
flex-direction: column;
}
.table-header {
display: flex;
flex: 1;
font-weight: 400;
& > * {
.table-cell-spacing();
}
}
.table-row {
.border(true, @border-top, @border-light);
display: flex;
flex: 1;
& > * {
.table-cell-spacing();
&:not(:first-child) {
.border(true, @border-left, @border-light);
}
}
&.selected {
.border(true, @border-top, @color-blue-light);
.border(true, @border-right, @color-blue-light);
.border(true, @border-bottom, @color-blue-light);
.border(true, @border-left, @color-blue, @border-width-3);
background-color: @color-blue-extra-light;
}
&:hover,
&:active {
background-color: @color-blue-extra-light;
}
&.not-selectable:hover {
background-color: @color-gray-light;
}
}