tables.less in twitter-bootswatch-rails-3.0.1.0

- old
+ new

@@ -16,13 +16,13 @@
 
 .table {
   width: 100%;
   margin-bottom: @line-height-computed;
   // Cells
-  thead,
-  tbody,
-  tfoot {
+  > thead,
+  > tbody,
+  > tfoot {
     > tr {
       > th,
       > td {
         padding: @table-cell-padding;
         line-height: @line-height-base;
@@ -30,26 +30,27 @@
         border-top: 1px solid @table-border-color;
       }
     }
   }
   // 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;
   }
 
   // Nesting
   .table {
@@ -59,13 +60,13 @@
 
 
 // Condensed table w/ half padding
 
 .table-condensed {
-  thead,
-  tbody,
-  tfoot {
+  > thead,
+  > tbody,
+  > tfoot {
     > tr {
       > th,
       > td {
         padding: @table-condensed-cell-padding;
       }
@@ -88,49 +89,39 @@
       > td {
         border: 1px solid @table-border-color;
       }
     }
   }
-  > thead {
-    > tr {
-      > th,
-      > td {
-        border-bottom-width: 2px;
-      }
+  > 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
@@ -174,26 +165,27 @@
 .table-row-variant(warning; @state-warning-bg; @state-warning-border);
 
 
 // Responsive tables
 //
-// Wrap your tables in `.table-scrollable` and we'll make them mobile friendly
+// 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-sm) {
+@media (max-width: @screen-xs-max) {
   .table-responsive {
     width: 100%;
-    margin-bottom: 15px;
+    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 and give a background color
+    // Tighten up spacing
     > .table {
       margin-bottom: 0;
-      background-color: #fff;
 
       // Ensure the content doesn't wrap
       > thead,
       > tbody,
       > tfoot {
@@ -222,15 +214,23 @@
           > 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;
           }
         }
       }
+
     }
   }
 }