react-toolbox/components/table/style.scss

55 lines
929 B
SCSS

@import "../base";
@import "./config";
.root {
width: 100%;
font-size: $font-size-tiny;
color: $table-text-color;
text-align: left;
tr {
height: $table-row-height;
line-height: $table-row-height;
border-bottom: $table-row-divider;
}
th {
font-weight: $font-weight-bold;
&:first-letter {
text-transform: capitalize;
}
}
th, td {
position: relative;
padding: 0 $table-row-offset;
&.selectable {
width: 1.8 * $unit;
padding-right: 0;
> * {
margin: 0;
}
}
}
}
.row {
transition: background-color $animation-duration $animation-curve-default;
&:last-child {
border-color: transparent;
}
> td {
> input {
display: block;
width: 100%;
background-color: transparent;
border: 0;
}
}
}
.selected, .row:hover {
background-color: $table-row-highlight;
}
.editable > * {
cursor: pointer;
}