3.0.0 -> 3.0.1
[bootswatch] / bower_components / bootstrap / less / tables.less
index 05c0919..0deadc7 100755 (executable)
@@ -13,15 +13,14 @@ th {
 
 
 // Baseline styles
-// ---------------
 
 .table {
   width: 100%;
   margin-bottom: @line-height-computed;
   // Cells
-  thead,
-  tbody,
-  tfoot {
+  thead,
+  tbody,
+  tfoot {
     > tr {
       > th,
       > td {
@@ -33,21 +32,23 @@ th {
     }
   }
   // Bottom align for column headings
-  thead > tr > th {
+  thead > tr > th {
     vertical-align: bottom;
+    border-bottom: 2px solid @table-border-color;
   }
   // Remove top border from thead by default
-  caption + thead,
-  colgroup + thead,
-  thead:first-child {
-    tr:first-child {
-      th, td {
+  > caption + thead,
+  > colgroup + thead,
+  > thead:first-child {
+    > tr:first-child {
+      > th,
+      > td {
         border-top: 0;
       }
     }
   }
   // Account for multiple tbody instances
-  tbody + tbody {
+  tbody + tbody {
     border-top: 2px solid @table-border-color;
   }
 
@@ -58,14 +59,12 @@ th {
 }
 
 
-
 // Condensed table w/ half padding
-// -------------------------------
 
 .table-condensed {
-  thead,
-  tbody,
-  tfoot {
+  thead,
+  tbody,
+  tfoot {
     > tr {
       > th,
       > td {
@@ -76,9 +75,9 @@ th {
 }
 
 
-
 // Bordered version
-// ----------------
+//
+// Add borders all around the table and between all the columns.
 
 .table-bordered {
   border: 1px solid @table-border-color;
@@ -92,56 +91,51 @@ th {
       }
     }
   }
+  > thead > tr {
+    > th,
+    > td {
+      border-bottom-width: 2px;
+    }
+  }
 }
 
 
-
 // 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;
-      }
-    }
+
+.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-hover > tbody > tr:hover {
+  > td,
+  > th {
+    background-color: @table-bg-hover;
   }
 }
 
 
-
 // Table cell sizing
-// -----------------
-
+//
 // Reset default table behavior
-table col[class^="col-"] {
+
+table col[class*="col-"] {
   float: none;
   display: table-column;
 }
 table {
   td,
   th {
-    &[class^="col-"] {
+    &[class*="col-"] {
       float: none;
       display: table-cell;
     }
@@ -149,9 +143,8 @@ table {
 }
 
 
-
 // Table backgrounds
-// -----------------
+//
 // Exact selectors below required to override `.table-striped` and prevent
 // inheritance to nested tables.
 
@@ -166,10 +159,78 @@ table {
   }
 }
 
-// Contextual variants
-// -------------------
+// Generate the contextual variants
 .table-row-variant(success; @state-success-bg; @state-success-border);
-
 .table-row-variant(danger; @state-danger-bg; @state-danger-border);
-
 .table-row-variant(warning; @state-warning-bg; @state-warning-border);
+
+
+// Responsive tables
+//
+// Wrap your tables in `.table-responsive` and we'll make them mobile friendly
+// by enabling horizontal scrolling. Only applies <768px. Everything above that
+// will display normally.
+
+@media (max-width: @screen-xs-max) {
+  .table-responsive {
+    width: 100%;
+    margin-bottom: (@line-height-computed * 0.75);
+    overflow-y: hidden;
+    overflow-x: scroll;
+    -ms-overflow-style: -ms-autohiding-scrollbar;
+    border: 1px solid @table-border-color;
+    -webkit-overflow-scrolling: touch;
+
+    // Tighten up spacing
+    > .table {
+      margin-bottom: 0;
+
+      // Ensure the content doesn't wrap
+      > thead,
+      > tbody,
+      > tfoot {
+        > tr {
+          > th,
+          > td {
+            white-space: nowrap;
+          }
+        }
+      }
+    }
+
+    // Special overrides for the bordered tables
+    > .table-bordered {
+      border: 0;
+
+      // Nuke the appropriate borders so that the parent can handle them
+      > thead,
+      > tbody,
+      > tfoot {
+        > tr {
+          > th:first-child,
+          > td:first-child {
+            border-left: 0;
+          }
+          > th:last-child,
+          > td:last-child {
+            border-right: 0;
+          }
+        }
+      }
+
+      // Only nuke the last row's bottom-border in `tbody` and `tfoot` since
+      // chances are there will be only one `tr` in a `thead` and that would
+      // remove the border altogether.
+      > tbody,
+      > tfoot {
+        > tr:last-child {
+          > th,
+          > td {
+            border-bottom: 0;
+          }
+        }
+      }
+
+    }
+  }
+}