80 lines
1.9 KiB
SCSS
80 lines
1.9 KiB
SCSS
|
//
|
||
|
|
// Table Variables
|
||
|
|
//
|
||
|
|
|
||
|
|
// These control the background color for the table and even rows
|
||
|
|
$table-bg: #fff !default;
|
||
|
|
$table-even-row-bg: #f9f9f9 !default;
|
||
|
|
|
||
|
|
// These control the table cell border style
|
||
|
|
$table-border-style: solid !default;
|
||
|
|
$table-border-size: 1px !default;
|
||
|
|
$table-border-color: #ddd !default;
|
||
|
|
|
||
|
|
// These control the table head styles
|
||
|
|
$table-head-bg: #f5f5f5 !default;
|
||
|
|
$table-head-font-size: emCalc(14px) !default;
|
||
|
|
$table-head-font-color: #222 !default;
|
||
|
|
$table-head-font-weight: bold !default;
|
||
|
|
$table-head-padding: emCalc(8px) emCalc(10px) emCalc(10px) !default;
|
||
|
|
|
||
|
|
// These control the row padding and font styles
|
||
|
|
$table-row-padding: emCalc(9px) emCalc(10px) !default;
|
||
|
|
$table-row-font-size: emCalc(14px) !default;
|
||
|
|
$table-row-font-color: #222 !default;
|
||
|
|
$table-line-height: emCalc(18px) !default;
|
||
|
|
|
||
|
|
// These are for controlling the display and margin of tables
|
||
|
|
$table-display: table-cell !default;
|
||
|
|
$table-margin-bottom: emCalc(20px) !default;
|
||
|
|
|
||
|
|
|
||
|
|
//
|
||
|
|
// Table Mixin
|
||
|
|
//
|
||
|
|
@mixin table {
|
||
|
|
background: $table-bg;
|
||
|
|
margin-bottom: $table-margin-bottom;
|
||
|
|
border: $table-border-style $table-border-size $table-border-color;
|
||
|
|
|
||
|
|
thead,
|
||
|
|
tfoot {
|
||
|
|
background: $table-head-bg;
|
||
|
|
font-weight: $table-head-font-weight;
|
||
|
|
|
||
|
|
tr {
|
||
|
|
th,
|
||
|
|
td {
|
||
|
|
padding: $table-head-padding;
|
||
|
|
font-size: $table-head-font-size;
|
||
|
|
color: $table-head-font-color;
|
||
|
|
text-align: $default-float;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
tr {
|
||
|
|
th,
|
||
|
|
td {
|
||
|
|
padding: $table-row-padding;
|
||
|
|
font-size: $table-row-font-size;
|
||
|
|
color: $table-row-font-color;
|
||
|
|
}
|
||
|
|
|
||
|
|
&.even,
|
||
|
|
&.alt,
|
||
|
|
&:nth-of-type(even) { background: $table-even-row-bg; }
|
||
|
|
}
|
||
|
|
|
||
|
|
thead tr th,
|
||
|
|
tfoot tr th,
|
||
|
|
tbody tr td,
|
||
|
|
tr td,
|
||
|
|
tfoot tr td { display: $table-display; line-height: $table-line-height; }
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/* Tables */
|
||
|
|
table {
|
||
|
|
@include table;
|
||
|
|
}
|