54 lines
1.6 KiB
SCSS

@import "restyle";
@include restyle-define(table, (
restyle-var(border-color): set-color(grey, light),
restyle-var(header-color): set-color(grey, light),
restyle-var(horizontal-padding): 10px,
restyle-var(font-size): 16px,
restyle-var(zebra): tint(set-color(grey, light), 80%),
border-collapse: collapse,
border-spacing: 0,
text-align: left,
width: 100%,
table-layout: fixed,
'& th': (
font-size: restyle-var(font-size),
background-color: restyle-var(header-color),
min-height: 36px,
padding: restyle-var(horizontal-padding),
vertical-align: middle,
white-space: nowrap,
),
'& td': (
restyle-var(cell-height): 52px,
box-sizing: border-box,
height: restyle-var(cell-height),
padding: (5px restyle-var(horizontal-padding)),
border-bottom: 1px solid set-color(grey, light),
vertical-align: middle,
word-wrap: break-word
),
restyle-modifiers: (
'with a border': (
border: 1px solid restyle-var(border-color)
),
'with stripped rows': (
'& tr:nth-child(odd)': (
background-color: restyle-var(zebra)
)
)
)
));
.nacho-table {
@include restyle(table);
&--bordered {
@include restyle(table with a border);
}
&--stripped {
@include restyle(table with stripped rows);
}
}