.thead-inverse {
th {
color: #fff;
- background-color: $gray-dark;
+ background-color: $table-bg-inverse;
}
}
+
.thead-default {
th {
- color: $gray;
- background-color: $gray-lighter;
+ color: $table-head-color;
+ background-color: $table-head-bg;
}
}
.table-inverse {
- color: $gray-lighter;
- background-color: $gray-dark;
+ color: $body-bg;
+ background-color: $table-bg-inverse;
- &.table-bordered {
- border: 0;
- }
-
th,
td,
thead th {
- border-color: $gray;
+ border-color: $body-bg;
}
+
+ &.table-bordered {
+ border: 0;
+ }
+}
+
+
+
+// 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.
+
+.table-responsive {
+ display: block;
+ width: 100%;
+ min-height: 0%; // Workaround for IE9 bug (see https://github.com/twbs/bootstrap/issues/14837)
+ overflow-x: auto;
+
+ // TODO: find out if we need this still.
+ //
+ // border: $table-border-width solid $table-border-color;
+ // -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057
}
//
// Settings for the `<body>` element.
- $body-bg: #fff !default;
- $body-color: $gray-dark !default;
+ $body-bg: #fff !default;
+ $body-color: $gray-dark !default;
+ $inverse-bg: $gray-dark !default;
+ $inverse-color: $gray-lighter !default;
-// Links
+// 5. Links
//
// Style anchor elements.
$table-sm-cell-padding: .3rem !default;
$table-bg: transparent !default;
-$table-bg-accent: #f9f9f9 !default;
-$table-bg-hover: #f5f5f5 !default;
+ $table-bg-inverse: $gray-dark !default;
++
+$table-bg-accent: rgba(0,0,0,.05) !default;
+$table-bg-hover: rgba(0,0,0,.075) !default;
$table-bg-active: $table-bg-hover !default;
+ $table-head-bg: $gray-lighter !default;
+ $table-head-color: $gray !default;
+
$table-border-width: $border-width !default;
$table-border-color: $gray-lighter !default;
$thumbnail-box-shadow: 0 1px 2px rgba(0,0,0,.075) !default;
-// Figures
+// 30. Figures
$figure-caption-font-size: 90% !default;
+ $figure-caption-color: $gray-light !default;
-// Breadcrumbs
+// 31. Breadcrumbs
$breadcrumb-padding-y: .75rem !default;
$breadcrumb-padding-x: 1rem !default;
// Contextual backgrounds
//
-// Inverse
-// TODO: redo this as a proper class
-.bg-inverse {
- color: $inverse-color;
- background-color: $inverse-bg;
-}
-
.bg-faded {
- background-color: $gray-lightest;
+ background-color: darken($body-bg, 3%);
}
@include bg-variant('.bg-primary', $brand-primary);