bootswatch-sass 3.3.1.3 → 3.3.1.4

data/assets/stylesheets/superhero/_variables.scss

@@ -76,7 +76,7 @@ $headings-color:          inherit;
 //## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
 
 //** Load fonts from this directory.
-$icon-font-path:          "bootstrap/";
+$icon-font-path:          "bootstrap/" !default;
 //** File name for all font files.
 $icon-font-name:          "glyphicons-halflings-regular";
 //** Element ID within SVG icon file.

data/assets/stylesheets/united/_bootswatch.scss

@@ -1,9 +1,42 @@
+// United 3.3.1
+// Bootswatch
+// -----------------------------------------------------
+
 @import url("//fonts.googleapis.com/css?family=Ubuntu");
-.navbar-default .badge {
-  background-color: #fff;
-  color: #dd4814;
-}
-.navbar-inverse .badge {
-  background-color: #fff;
-  color: #772953;
+
+// Navbar =====================================================================
+
+.navbar {
+
+  &-default {
+
+    .badge {
+      background-color: #fff;
+      color: $navbar-default-bg;
+    }
+  }
+
+  &-inverse {
+
+    .badge {
+      background-color: #fff;
+      color: $navbar-inverse-bg;
+    }
+  }
 }
+
+// Buttons ====================================================================
+
+// Typography =================================================================
+
+// Tables =====================================================================
+
+// Forms ======================================================================
+
+// Navs =======================================================================
+
+// Indicators =================================================================
+
+// Progress bars ==============================================================
+
+// Containers =================================================================

data/assets/stylesheets/united/_variables.scss

@@ -76,7 +76,7 @@ $headings-color:          inherit;
 //## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
 
 //** Load fonts from this directory.
-$icon-font-path:          "bootstrap/";
+$icon-font-path:          "bootstrap/" !default;
 //** File name for all font files.
 $icon-font-name:          "glyphicons-halflings-regular";
 //** Element ID within SVG icon file.

data/assets/stylesheets/yeti/_bootswatch.scss

@@ -1,308 +1,437 @@
+// Yeti 3.3.1
+// Bootswatch
+// -----------------------------------------------------
+
 @import url("//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700");
+
+// Navbar =====================================================================
+
 .navbar {
   border: none;
   font-size: 13px;
   font-weight: 300;
-}
-.navbar .navbar-toggle:hover .icon-bar {
-  background-color: #b3b3b3;
-}
-.navbar-collapse {
-  border-top-color: rgba(0, 0, 0, 0.2);
-  -webkit-box-shadow: none;
-  box-shadow: none;
-}
-.navbar .btn {
-  padding-top: 6px;
-  padding-bottom: 6px;
-}
-.navbar-form {
-  margin-top: 7px;
-  margin-bottom: 5px;
-}
-.navbar-form .form-control {
-  height: auto;
-  padding: 4px 6px;
-}
-.navbar .dropdown-menu {
-  border: none;
-}
-.navbar .dropdown-menu > li > a,
-.navbar .dropdown-menu > li > a:focus {
-  background-color: transparent;
-  font-size: 13px;
-  font-weight: 300;
-}
-.navbar .dropdown-header {
-  color: rgba(255, 255, 255, 0.5);
-}
-.navbar-default .dropdown-menu {
-  background-color: #333333;
-}
-.navbar-default .dropdown-menu > li > a,
-.navbar-default .dropdown-menu > li > a:focus {
-  color: #ffffff;
-}
-.navbar-default .dropdown-menu > li > a:hover,
-.navbar-default .dropdown-menu > .active > a,
-.navbar-default .dropdown-menu > .active > a:hover {
-  background-color: #272727;
-}
-.navbar-inverse .dropdown-menu {
-  background-color: #008cba;
-}
-.navbar-inverse .dropdown-menu > li > a,
-.navbar-inverse .dropdown-menu > li > a:focus {
-  color: #ffffff;
-}
-.navbar-inverse .dropdown-menu > li > a:hover,
-.navbar-inverse .dropdown-menu > .active > a,
-.navbar-inverse .dropdown-menu > .active > a:hover {
-  background-color: #006687;
-}
+
+  .navbar-toggle:hover .icon-bar {
+    background-color: #b3b3b3;
+  }
+
+  &-collapse {
+    border-top-color: $dropdown-divider-bg;
+    @include box-shadow(none);
+  }
+
+  .btn {
+    padding-top: 6px;
+    padding-bottom: 6px;
+  }
+
+  &-form {
+    margin-top: 7px;
+    margin-bottom: 5px;
+
+    .form-control {
+      height: auto;
+      padding: $padding-xs-vertical $padding-xs-horizontal;
+    }
+  }
+
+  .dropdown {
+
+    &-menu {
+      border: none;
+
+      > li > a,
+      > li > a:focus {
+        background-color: transparent;
+        font-size: 13px;
+        font-weight: 300;
+      }
+    }
+
+    &-header {
+      color: rgba(255, 255, 255, 0.5);
+    }
+
+  }
+
+  &-default {
+
+    .dropdown-menu {
+      background-color: $navbar-default-bg;
+
+      > li > a,
+      > li > a:focus {
+        color: $navbar-default-color;
+      }
+
+      > li > a:hover,
+      > .active > a,
+      > .active > a:hover {
+        background-color: $navbar-default-link-hover-bg;
+      }
+    }
+  }
+
+  &-inverse {
+
+    .dropdown-menu {
+      background-color: $navbar-inverse-bg;
+
+      > li > a,
+      > li > a:focus {
+        color: $navbar-inverse-color;
+      }
+
+      > li > a:hover,
+      > .active > a,
+      > .active > a:hover {
+        background-color: $navbar-inverse-link-hover-bg;
+      }
+    }
+  }
+}
+
+// Buttons ====================================================================
+
 .btn {
-  padding: 8px 12px;
-}
-.btn-lg {
-  padding: 16px 20px;
-}
-.btn-sm {
-  padding: 8px 12px;
-}
-.btn-xs {
-  padding: 4px 6px;
-}
-.btn-group .btn ~ .dropdown-toggle {
-  padding-left: 16px;
-  padding-right: 16px;
-}
-.btn-group .dropdown-menu {
-  border-top-width: 0;
-}
-.btn-group.dropup .dropdown-menu {
-  border-top-width: 1px;
-  border-bottom-width: 0;
-  margin-bottom: 0;
-}
-.btn-group .dropdown-toggle.btn-default ~ .dropdown-menu {
-  background-color: #e7e7e7;
-  border-color: #cccccc;
-}
-.btn-group .dropdown-toggle.btn-default ~ .dropdown-menu > li > a {
-  color: #333333;
-}
-.btn-group .dropdown-toggle.btn-default ~ .dropdown-menu > li > a:hover {
-  background-color: #d3d3d3;
-}
-.btn-group .dropdown-toggle.btn-primary ~ .dropdown-menu {
-  background-color: #008cba;
-  border-color: #0079a1;
-}
-.btn-group .dropdown-toggle.btn-primary ~ .dropdown-menu > li > a {
-  color: #ffffff;
-}
-.btn-group .dropdown-toggle.btn-primary ~ .dropdown-menu > li > a:hover {
-  background-color: #006d91;
-}
-.btn-group .dropdown-toggle.btn-success ~ .dropdown-menu {
-  background-color: #43ac6a;
-  border-color: #3c9a5f;
-}
-.btn-group .dropdown-toggle.btn-success ~ .dropdown-menu > li > a {
-  color: #ffffff;
-}
-.btn-group .dropdown-toggle.btn-success ~ .dropdown-menu > li > a:hover {
-  background-color: #388f58;
-}
-.btn-group .dropdown-toggle.btn-info ~ .dropdown-menu {
-  background-color: #5bc0de;
-  border-color: #46b8da;
-}
-.btn-group .dropdown-toggle.btn-info ~ .dropdown-menu > li > a {
-  color: #ffffff;
-}
-.btn-group .dropdown-toggle.btn-info ~ .dropdown-menu > li > a:hover {
-  background-color: #39b3d7;
-}
-.btn-group .dropdown-toggle.btn-warning ~ .dropdown-menu {
-  background-color: #e99002;
-  border-color: #d08002;
-}
-.btn-group .dropdown-toggle.btn-warning ~ .dropdown-menu > li > a {
-  color: #ffffff;
-}
-.btn-group .dropdown-toggle.btn-warning ~ .dropdown-menu > li > a:hover {
-  background-color: #c17702;
-}
-.btn-group .dropdown-toggle.btn-danger ~ .dropdown-menu {
-  background-color: #f04124;
-  border-color: #ea2f10;
-}
-.btn-group .dropdown-toggle.btn-danger ~ .dropdown-menu > li > a {
-  color: #ffffff;
-}
-.btn-group .dropdown-toggle.btn-danger ~ .dropdown-menu > li > a:hover {
-  background-color: #dc2c0f;
-}
+  padding: $padding-base-vertical $padding-base-horizontal;
+
+  &-lg {
+    padding: $padding-large-vertical $padding-large-horizontal;
+  }
+
+  &-sm {
+    padding: $padding-small-vertical $padding-small-horizontal;
+  }
+
+  &-xs {
+    padding: $padding-xs-vertical $padding-xs-horizontal;
+  }
+}
+
+.btn-group {
+
+  .btn ~ .dropdown-toggle {
+    padding-left: 16px;
+    padding-right: 16px;
+  }
+
+  .dropdown-menu {
+    border-top-width: 0;
+  }
+
+  &.dropup .dropdown-menu {
+    border-top-width: 1px;
+    border-bottom-width: 0;
+    margin-bottom: 0;
+  }
+
+  .dropdown-toggle {
+
+    &.btn-default ~ .dropdown-menu {
+      background-color: $btn-default-bg;
+      border-color: $btn-default-border;
+
+      > li > a {
+        color: $btn-default-color;
+      }
+
+      > li > a:hover {
+        background-color: darken($btn-default-bg, 8%);
+      }
+    }
+
+    &.btn-primary ~ .dropdown-menu {
+      background-color: $btn-primary-bg;
+      border-color: $btn-primary-border;
+
+      > li > a {
+        color: $btn-primary-color;
+      }
+
+      > li > a:hover {
+        background-color: darken($btn-primary-bg, 8%);
+      }
+    }
+
+    &.btn-success ~ .dropdown-menu {
+      background-color: $btn-success-bg;
+      border-color: $btn-success-border;
+
+      > li > a {
+        color: $btn-success-color;
+      }
+
+      > li > a:hover {
+        background-color: darken($btn-success-bg, 8%);
+      }
+    }
+
+    &.btn-info ~ .dropdown-menu {
+      background-color: $btn-info-bg;
+      border-color: $btn-info-border;
+
+      > li > a {
+        color: $btn-info-color;
+      }
+
+      > li > a:hover {
+        background-color: darken($btn-info-bg, 8%);
+      }
+    }
+
+    &.btn-warning ~ .dropdown-menu {
+      background-color: $btn-warning-bg;
+      border-color: $btn-warning-border;
+
+      > li > a {
+        color: $btn-warning-color;
+      }
+
+      > li > a:hover {
+        background-color: darken($btn-warning-bg, 8%);
+      }
+    }
+
+    &.btn-danger ~ .dropdown-menu {
+      background-color: $btn-danger-bg;
+      border-color: $btn-danger-border;
+
+      > li > a {
+        color: $btn-danger-color;
+      }
+
+      > li > a:hover {
+        background-color: darken($btn-danger-bg, 8%);
+      }
+    }
+  }
+}
+
+// Typography =================================================================
+
 .lead {
-  color: #6f6f6f;
+  color: $gray;
 }
+
 cite {
   font-style: italic;
 }
+
 blockquote {
   border-left-width: 1px;
-  color: #6f6f6f;
-}
-blockquote.pull-right {
-  border-right-width: 1px;
-}
-blockquote small {
-  font-size: 12px;
-  font-weight: 300;
-}
+  color: $gray;
+
+  &.pull-right {
+    border-right-width: 1px;
+  }
+
+  small {
+    font-size: $font-size-small;
+    font-weight: 300;
+  }
+}
+
+// Tables =====================================================================
+
 table {
-  font-size: 12px;
+  font-size: $font-size-small;
 }
+
+// Forms ======================================================================
+
 label,
 .control-label,
 .help-block,
 .checkbox,
 .radio {
-  font-size: 12px;
+  font-size: $font-size-small;
   font-weight: normal;
 }
+
 input[type="radio"],
 input[type="checkbox"] {
   margin-top: 1px;
 }
-.nav .open > a,
-.nav .open > a:hover,
-.nav .open > a:focus {
-  border-color: transparent;
-}
-.nav-tabs > li > a {
-  background-color: #e7e7e7;
-  color: #222222;
-}
-.nav-tabs .caret {
-  border-top-color: #222222;
-  border-bottom-color: #222222;
-}
+
+// Navs =======================================================================
+
+.nav {
+  .open > a,
+  .open > a:hover,
+  .open > a:focus {
+    border-color: transparent;
+  }
+}
+
+.nav-tabs {
+  > li > a {
+    background-color: $btn-default-bg;
+    color: $text-color;
+  }
+
+  .caret {
+    border-top-color: $text-color;
+    border-bottom-color: $text-color;
+  }
+}
+
 .nav-pills {
   font-weight: 300;
 }
+
 .breadcrumb {
-  border: 1px solid #dddddd;
+  border: 1px solid $table-border-color;
   border-radius: 3px;
   font-size: 10px;
   font-weight: 300;
   text-transform: uppercase;
 }
+
 .pagination {
-  font-size: 12px;
+  font-size: $font-size-small;
   font-weight: 300;
-  color: #999999;
-}
-.pagination > li > a,
-.pagination > li > span {
-  margin-left: 4px;
-  color: #999999;
-}
-.pagination > .active > a,
-.pagination > .active > span {
-  color: #fff;
-}
-.pagination > li > a,
-.pagination > li:first-child > a,
-.pagination > li:last-child > a,
-.pagination > li > span,
-.pagination > li:first-child > span,
-.pagination > li:last-child > span {
-  border-radius: 3px;
-}
-.pagination-lg > li > a {
-  padding-left: 22px;
-  padding-right: 22px;
-}
-.pagination-sm > li > a {
-  padding: 0 5px;
-}
+  color: $gray-light;
+
+  > li {
+    > a,
+    > span {
+      margin-left: 4px;
+      color: $gray-light;
+    }
+  }
+
+  > .active {
+    > a,
+    > span {
+      color: #fff;
+    }
+  }
+
+  > li,
+  > li:first-child,
+  > li:last-child {
+    > a,
+    > span {
+      border-radius: 3px;
+    }
+  }
+
+  &-lg > li > a {
+    padding-left: 22px;
+    padding-right: 22px;
+  }
+
+  &-sm > li > a {
+    padding: 0 5px;
+  }
+}
+
 .pager {
-  font-size: 12px;
+  font-size: $font-size-small;
   font-weight: 300;
-  color: #999999;
+  color: $gray-light;
 }
+
 .list-group {
-  font-size: 12px;
+  font-size: $font-size-small;
   font-weight: 300;
 }
+
+// Indicators =================================================================
+
 .close {
   opacity: 0.4;
   text-decoration: none;
   text-shadow: none;
+
+  &:hover,
+  &:focus {
+    opacity: 1;
+  }
 }
-.close:hover,
-.close:focus {
-  opacity: 1;
-}
+
 .alert {
-  font-size: 12px;
+  font-size: $font-size-small;
   font-weight: 300;
-}
-.alert .alert-link {
-  font-weight: normal;
-  color: #fff;
-  text-decoration: underline;
-}
+
+  .alert-link {
+    font-weight: normal;
+    color: #fff;
+    text-decoration: underline;
+  }
+}
+
 .label {
   padding-left: 1em;
   padding-right: 1em;
   border-radius: 0;
   font-weight: 300;
+
+  &-default {
+    background-color: $btn-default-bg;
+    color: $btn-default-color;
+  }
 }
-.label-default {
-  background-color: #e7e7e7;
-  color: #333333;
-}
+
 .badge {
   font-weight: 300;
 }
+
+// Progress bars ==============================================================
+
 .progress {
   height: 22px;
   padding: 2px;
   background-color: #f6f6f6;
   border: 1px solid #ccc;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-}
-.dropdown-menu {
-  padding: 0;
-  margin-top: 0;
-  font-size: 12px;
-}
-.dropdown-menu > li > a {
-  padding: 12px 15px;
-}
-.dropdown-header {
-  padding-left: 15px;
-  padding-right: 15px;
-  font-size: 9px;
-  text-transform: uppercase;
-}
+  @include box-shadow(none);
+}
+
+// Containers =================================================================
+
+.dropdown {
+
+  &-menu {
+    padding: 0;
+    margin-top: 0;
+    font-size: $font-size-small;
+
+    > li > a {
+      padding: 12px 15px;
+    }
+  }
+
+  &-header {
+    padding-left: 15px;
+    padding-right: 15px;
+    font-size: 9px;
+    text-transform: uppercase;
+  }
+}
+
 .popover {
   color: #fff;
   font-size: 12px;
   font-weight: 300;
 }
-.panel-heading,
-.panel-footer {
-  border-top-right-radius: 0;
-  border-top-left-radius: 0;
-}
-.panel-default .close {
-  color: #222222;
-}
-.modal .close {
-  color: #222222;
+
+.panel {
+  &-heading,
+  &-footer {
+    border-top-right-radius: 0;
+    border-top-left-radius: 0;
+  }
+
+  &-default {
+    .close {
+      color: $text-color;
+    }
+  }
+}
+
+.modal {
+  .close {
+    color: $text-color;
+  }
 }