updated to 2.2.1
[bootswatch] / cyborg / bootswatch.less
index 419d507..2662ef7 100755 (executable)
@@ -1,8 +1,8 @@
-// Bootswatch.less
-// Swatch: Cyborg
-// Version: 2.1.0
+// Cyborg 2.2.1
+// Bootswatch
 // -----------------------------------------------------
 
+
 // TYPOGRAPHY
 // -----------------------------------------------------
 
@@ -15,8 +15,16 @@ label, input, button, select, textarea,
        color: @gray;
 }
 
-.jumbotron h1 {
-       font-weight: normal !important;
+code, pre {
+       background-color: @grayLighter;
+}
+
+blockquote {
+       border-left: 5px solid @blue;
+
+       &.pull-right {
+               border-right: 5px solid @blue;
+       }
 }
 
 // SCAFFOLDING
@@ -106,20 +114,50 @@ body {
                .placeholder(@gray);
        }
 
-       .nav-collapse.collapse {
+       &-inverse {
+
+               .navbar-inner {
+                       border: none;
+                       border-bottom: 3px solid @black;
+               }
+
+               .brand:hover {
+                       border-bottom: none;
+                       background-color: @black;
+               }
+
+               .nav li > a:hover {
+                       border-bottom-color: transparent;
+               }
+
+               .nav .active > a {
+                       border-bottom-color: transparent;
+               }
+       }
+}
+
+@media (max-width: @navbarCollapseWidth) {
+
+       .navbar .nav-collapse {
 
                .nav li > a {
-                       border-left: 0;
+                       border: none;
                        color: @grayLighter;
                        font-weight: normal;
                        text-shadow: none;
 
                        &:hover {
+                               border: none;
                                background-color: @blue;
                        }
                }
 
                .nav .active > a {
+                       border: none;
+                       background-color: @blue;
+               }
+
+               .dropdown-menu a:hover {
                        background-color: @blue;
                }
 
@@ -134,37 +172,22 @@ body {
                }
        }
 
-       &-inverse {
-
-               .navbar-inner {
-                       border: none;
-                       border-bottom: 3px solid @black;
-               }
-
-               .brand:hover {
-                       border-bottom: none;
-                       background-color: @black;
-               }
+       .navbar-inverse .nav-collapse {
 
                .nav li > a:hover {
-                       border-bottom-color: transparent;
+                       background-color: #111;
                }
 
                .nav .active > a {
-                       border-bottom-color: transparent;
+                       background-color: #111;
                }
-       }
-}
-
-.dropdown-menu {
-       background-color: #191A1A;
-       // border-left: solid 1px rgba(255, 255, 255, 0.1);
-       .box-shadow(0 2px 4px rgba(0, 0, 0, 0.8));
-}
 
-.dropdown-menu li > a:hover {
-       background-color: @blue;
-       // border-bottom: 3px solid transparent;
+               .nav li.dropdown.open > .dropdown-toggle,
+               .nav li.dropdown.active > .dropdown-toggle,
+               .nav li.dropdown.open.active > .dropdown-toggle {
+                       background-color: #111;
+               }
+       }
 }
 
 div.subnav {
@@ -219,44 +242,9 @@ div.subnav {
        }
 }
 
-@media (max-width: 768px) {
-       div.subnav .nav > li + li > a,
-       div.subnav .nav > li:first-child > a {
-               border-top: 1px solid #222;
-               border-left: 1px solid #222;
-       }
-
-       .subnav .nav > li + li > a:hover,
-       .subnav .nav > li:first-child > a:hover {
-                       border-bottom: 0;
-                       background-color: @blue;
-       }
-}
-
-// NAVIGATION
+// NAV
 // -----------------------------------------------------
 
-.nav-list {
-
-       li > a {
-               text-shadow: none;
-       }
-
-       li > a:hover {
-               background-color: @blue;
-               color: @white;
-       }
-
-       .nav-header {
-               text-shadow: none;
-       }
-
-       .divider {
-               background-color: transparent;
-               border-bottom: 1px solid #222;
-       }
-}
-
 .nav-tabs {
 
        border-bottom: 1px solid #222;
@@ -295,6 +283,27 @@ div.subnav {
        }
 }
 
+.nav-list {
+
+       li > a {
+               text-shadow: none;
+       }
+
+       li > a:hover {
+               background-color: @blue;
+               color: @white;
+       }
+
+       .nav-header {
+               text-shadow: none;
+       }
+
+       .divider {
+               background-color: transparent;
+               border-bottom: 1px solid #222;
+       }
+}
+
 .nav-stacked {
 
        li > a {
@@ -316,40 +325,50 @@ div.subnav {
 }
 
 .breadcrumb {
+       
        background-color: transparent;
        background-image: none;
        border-width: 0;
        .box-shadow(none);
        font-size: 14px;
 
-       li > a {
-               color: @blue;
+       li {
                text-shadow: none;
        }
 
-       li.active {
+       li > a {
+               color: @blue;
                text-shadow: none;
        }
 }
 
 .pagination {
+
        ul {
                .box-shadow(none);
        }
 
-       a {
+       ul > li > a,
+       ul > li > span {
                border: 0;
                font-size: 14px;
        }
 
-       a:hover, .active a {
+       ul > li > a:hover {
                background-color: @blue;
                color: @white;
        }
 
-       .disabled span,
-       .disabled a,
-       .disabled a:hover {
+       ul > .active > a,
+       ul > .active > span {
+               background-color: @blue;
+               color: @white;  
+       }
+
+       ul > .disabled > a,
+       ul > .disabled > a:hover,
+       ul > .disabled > span,
+       ul > .disabled > span:hover {
                background-color: rgba(0, 0, 0, 0.2);
        }
 }
@@ -429,6 +448,7 @@ div.subnav {
 
 input, textarea, select {
        border-width: 2px;
+       .border-radius(1px);
 }
 
 legend, label {
@@ -466,27 +486,7 @@ select:focus {
        border-top: 1px solid #222;
 }
 
-// MODALS
-// -----------------------------------------------------
-
-.modal {
-       .border-radius(1px);
-       border-top: solid 1px lighten(@grayDark, 5%);
-       background-color: @grayDark;
-}
-
-.modal-header {
-       border-bottom: 1px solid #222;
-}
-
-.modal-footer {
-       background-color: @grayDark;
-       border-top: 1px solid #222;
-       .border-radius(0 0 6px 6px);
-       .box-shadow(none);
-}
-
-// MISCELLANEOUS
+// TABLES
 // -----------------------------------------------------
 
 .table {
@@ -507,41 +507,36 @@ select:focus {
                background-color: @blue;
                color: @white;
        }
-
-
-}
-
-
-
-.well, .hero-unit, .prettyprint, input, textarea, select {
-       .border-radius(1px);
 }
 
-code, pre {
-       background-color: @grayLighter;
-}
+// DROPDOWNS
+// -----------------------------------------------------
 
-.well, .hero-unit {
-       border-top: solid 1px lighten(@grayDark, 5%);
-       .box-shadow(0 2px 4px rgba(0,0,0,.8));
+.dropdown-menu {
+       background-color: #191A1A;
+       .box-shadow(0 2px 4px rgba(0, 0, 0, 0.8));
 }
 
-blockquote {
-       border-left: 5px solid @blue;
-
-       &.pull-right {
-               border-right: 5px solid @blue;
-       }
+.dropdown-menu li > a:hover {
+       background-color: @blue;
 }
 
-.thumbnail {
-       border-color: #222;
-}
+// ALERTS, LABELS, BADGES
+// -----------------------------------------------------
 
-.progress {
-       background-color: #060606;
-       background-image: none;
-       .border-radius(0);
+.alert,
+.alert .alert-heading,
+.alert-success,
+.alert-success .alert-heading,
+.alert-danger,
+.alert-error,
+.alert-danger .alert-heading,
+.alert-error .alert-heading,
+.alert-info,
+.alert-info .alert-heading {
+  color: @grayLighter;
+  text-shadow: none;
+  border: none;
 }
 
 .label {
@@ -552,7 +547,8 @@ blockquote {
 
 .label:hover { background-color: darken(@gray, 30%); }
 
-.label-important, .alert-danger,
+.label-important,
+.alert-danger,
 .alert-error { background-color: @red; }
 
 .label-important:hover { background-color: darken(@red, 10%); }
@@ -569,21 +565,62 @@ blockquote {
 
 .label-info:hover { background-color: darken(@blueDark, 20%); }
 
-.alert,
-.alert .alert-heading,
-.alert-success,
-.alert-success .alert-heading,
-.alert-danger,
-.alert-error,
-.alert-danger .alert-heading,
-.alert-error .alert-heading,
-.alert-info,
-.alert-info .alert-heading {
-  color: @grayLighter;
-  text-shadow: none;
-  border: none;
+// MISC
+// -----------------------------------------------------
+
+.well, .hero-unit {
+       .border-radius(1px);
 }
 
-footer.footer {
+.well, .hero-unit {
+       border-top: solid 1px lighten(@grayDark, 5%);
+       .box-shadow(0 2px 4px rgba(0,0,0,.8));
+}
+
+.thumbnail {
+       border-color: #222;
+}
+
+.progress {
+       background-color: #060606;
+       background-image: none;
+       .border-radius(0);
+}
+
+.modal {
+       .border-radius(1px);
+       border-top: solid 1px lighten(@grayDark, 5%);
+       background-color: @grayDark;
+}
+
+.modal-header {
+       border-bottom: 1px solid #222;
+}
+
+.modal-footer {
+       background-color: @grayDark;
+       border-top: 1px solid #222;
+       .border-radius(0 0 6px 6px);
+       .box-shadow(none);
+}
+
+.footer {
        border-top: 1px solid #222;
 }
+
+// MEDIA QUERIES
+// -----------------------------------------------------
+
+@media (max-width: 768px) {
+       div.subnav .nav > li + li > a,
+       div.subnav .nav > li:first-child > a {
+               border-top: 1px solid #222;
+               border-left: 1px solid #222;
+       }
+
+       .subnav .nav > li + li > a:hover,
+       .subnav .nav > li:first-child > a:hover {
+                       border-bottom: 0;
+                       background-color: @blue;
+       }
+}