Permalink
Switch branches/tags
Nothing to show
Find file
Fetching contributors…
Cannot retrieve contributors at this time
128 lines (86 sloc) 2.33 KB
// BASE TABLES
table
max-width: 100%
border-collapse: collapse
border-spacing: 0
// BASELINE STYLES
.table
width: 100%
margin-bottom: BASE_LINE_HEIGHT
th,
td
padding: 8px
line-height: BASE_LINE_HEIGHT
text-align: left
vertical-align: top
border-top: 1px solid #ddd
th
font-weight: bold
thead th
vertical-align: bottom
thead:first-child tr th,
thead:first-child tr td
border-top: 0
tbody + tbody
border-top: 2px solid #ddd
// CONDENSED TABLE W/ HALF PADDING
.table-condensed
th,
td
padding: 4px 5px
// BORDERED VERSION
.table-bordered
border: 1px solid #ddd
border-collapse: separate // Done so we can round those corners!
*border-collapse: collapsed // IE7 can't round corners anyway
border-radius: 4px
th + th,
td + td,
th + td,
td + th
border-left: 1px solid #ddd
// Prevent a double border
thead:first-child tr:first-child th,
tbody:first-child tr:first-child th,
tbody:first-child tr:first-child td
border-top: 0
// For first th or td in the first row in the first thead or tbody
thead:first-child tr:first-child th:first-child,
tbody:first-child tr:first-child td:first-child
border-radius: 4px 0 0 0
thead:first-child tr:first-child th:last-child,
tbody:first-child tr:first-child td:last-child
border-radius: 0 4px 0 0
// For first th or td in the first row in the first thead or tbody
thead:last-child tr:last-child th:first-child,
tbody:last-child tr:last-child td:first-child
border-radius: 0 0 0 4px
thead:last-child tr:last-child th:last-child,
tbody:last-child tr:last-child td:last-child
border-radius:0 0 4px 0
// ZEBRA-STRIPING
// --------------
// Default zebra-stripe styles (alternating gray and transparent backgrounds)
.table-striped
tbody
tr:nth-child(odd) td,
tr:nth-child(odd) th
background-color: #f9f9f9
// HOVER EFFECT
// ------------
// Placed here since it has to come after the potential zebra striping
.table
tbody tr:hover td,
tbody tr:hover th
background-color: #f5f5f5
// TABLE CELL SIZING
// -----------------
// Change the columns
tableColumns($columnSpan = 1)
float: none
width: ((GRID_COLUMN_WIDTH) * $columnSpan) + (GRID_GUTTER_WIDTH * ($columnSpan - 1)) - 16
margin-left: 0
table
for $i in 1..12
.span{$1}
tableColumns($i)