// some work on style sheets

2013-07-18 18:51:24 +02:00
parent 02921dc9d0
commit 0b4512dbcb
1654 changed files with 171753 additions and 294 deletions
@@ -0,0 +1,262 @@
+//
+// Tables
+// --------------------------------------------------
+
+
+table {
+  max-width: 100%;
+  background-color: @table-bg;
+}
+th {
+  text-align: left;
+}
+
+
+// BASELINE STYLES
+// ---------------
+
+.table {
+  width: 100%;
+  margin-bottom: @line-height-computed;
+  // Cells
+  thead,
+  tbody,
+  tfoot {
+    > tr {
+      > th,
+      > td {
+        padding: 8px;
+        line-height: @line-height-base;
+        vertical-align: top;
+        border-top: 1px solid @table-border-color;
+      }
+    }
+  }
+  // Bottom align for column headings
+  thead > tr > th {
+    vertical-align: bottom;
+  }
+  // Remove top border from thead by default
+  caption + thead,
+  colgroup + thead,
+  thead:first-child {
+    tr:first-child {
+      th, td {
+        border-top: 0;
+      }
+    }
+  }
+  // Account for multiple tbody instances
+  tbody + tbody {
+    border-top: 2px solid @table-border-color;
+  }
+
+  // Nesting
+  .table {
+    background-color: @body-bg;
+  }
+}
+
+
+
+// CONDENSED TABLE W/ HALF PADDING
+// -------------------------------
+
+.table-condensed {
+  thead,
+  tbody,
+  tfoot {
+    > tr {
+      > th,
+      > td {
+        padding: 4px 5px;
+      }
+    }
+  }
+}
+
+
+
+// BORDERED VERSION
+// ----------------
+
+.table-bordered {
+  border: 1px solid @table-border-color;
+  border-collapse: separate; // Done so we can round those corners!
+  border-left: 0;
+  border-radius: @border-radius-base;
+
+  > thead,
+  > tbody,
+  > tfoot {
+    > tr {
+      > th,
+      > td {
+        border-left: 1px solid @table-border-color;
+      }
+    }
+  }
+  // Prevent a double border
+  > caption + thead > tr:first-child th,
+  > caption + tbody > tr:first-child th,
+  > caption + tbody > tr:first-child td,
+  > colgroup + thead > tr:first-child th,
+  > colgroup + tbody > tr:first-child th,
+  > colgroup + tbody > tr:first-child td,
+  > thead:first-child > tr:first-child th,
+  > tbody:first-child > tr:first-child th,
+  > tbody:first-child > tr:first-child td {
+    border-top: 0;
+  }
+  > thead:first-child > tr:first-child > th,
+  > tbody:first-child > tr:first-child > td,
+  > tbody:first-child > tr:first-child > th {
+    // For first th/td in the first row in the first thead or tbody
+    &:first-child{
+      border-top-left-radius: @border-radius-base;
+    }
+    // For last th/td in the first row in the first thead or tbody
+    &:last-child{
+      border-top-right-radius: @border-radius-base;
+    }
+  }
+  > thead:last-child > tr:last-child > th,
+  > tbody:last-child > tr:last-child > td,
+  > tbody:last-child > tr:last-child > th,
+  > tfoot:last-child > tr:last-child > td,
+  > tfoot:last-child > tr:last-child > th {
+    // For first th/td (can be either) in the last row in the last thead, tbody, and tfoot
+    &:first-child{
+      border-bottom-left-radius: @border-radius-base;
+    }
+    // For last th/td (can be either) in the last row in the last thead, tbody, and tfoot
+    &:last-child{
+      border-bottom-right-radius: @border-radius-base;
+    }
+  }
+
+  // Clear border-radius for first and last td in the last row in the last tbody for table with tfoot
+  > tfoot + tbody:last-child > tr:last-child > td:first-child {
+    border-bottom-left-radius: 0;
+  }
+  > tfoot + tbody:last-child > tr:last-child > td:last-child {
+    border-bottom-right-radius: 0;
+  }
+
+  // Special fixes to round the left border on the first td/th
+  > caption,
+  > colgroup {
+    + thead > tr:first-child > th,
+    + tbody > tr:first-child > td {
+      &:first-child {
+        border-top-left-radius: @border-radius-base;
+      }
+      &:last-child {
+        border-top-right-radius: @border-radius-base;
+      }
+    }
+  }
+}
+
+
+
+// ZEBRA-STRIPING
+// --------------
+
+// Default zebra-stripe styles (alternating gray and transparent backgrounds)
+.table-striped {
+  > tbody {
+    > tr:nth-child(odd) {
+      > td,
+      > th {
+        background-color: @table-bg-accent;
+      }
+    }
+  }
+}
+
+
+
+// HOVER EFFECT
+// ------------
+
+// Placed here since it has to come after the potential zebra striping
+.table-hover {
+  > tbody {
+    > tr:hover {
+      > td,
+      > th {
+        background-color: @table-bg-hover;
+      }
+    }
+  }
+}
+
+
+
+// TABLE CELL SIZING
+// -----------------
+
+// Reset default table behavior
+table col[class^="col-"] {
+  float: none;
+  display: table-column;
+}
+table {
+  td,
+  th {
+    &[class^="col-"] {
+      float: none;
+      display: table-cell;
+    }
+  }
+}
+
+
+
+// TABLE BACKGROUNDS
+// -----------------
+// Exact selectors below required to override .table-striped
+
+.table > tbody > tr {
+  > td.success,
+  > th.success,
+  &.success > td {
+    background-color: @state-success-bg;
+    border-color: @state-success-border;
+  }
+  > td.danger,
+  > th.danger,
+  &.danger > td {
+    background-color: @state-danger-bg;
+    border-color: @state-danger-border;
+  }
+  > td.warning,
+  > th.warning,
+  &.warning > td {
+    background-color: @state-warning-bg;
+    border-color: @state-warning-border;
+  }
+}
+
+// Hover states for .table-hover
+.table-hover > tbody > tr {
+  > td.success:hover,
+  > th.success:hover,
+  &.success:hover > td {
+    background-color: darken(@state-success-bg, 5%);
+    border-color: darken(@state-success-border, 5%);
+  }
+  > td.danger:hover,
+  > th.danger:hover,
+  &.danger:hover > td {
+    background-color: darken(@state-danger-bg, 5%);
+    border-color: darken(@state-danger-border, 5%);
+  }
+  > td.warning:hover,
+  > th.warning:hover,
+  &.warning:hover > td {
+    background-color: darken(@state-warning-bg, 5%);
+    border-color: darken(@state-warning-border, 5%);
+  }
+}