+// Simplex 2.2.1
// Bootswatch.less
-// Swatch: Simplex
-// Version: 2.0.4
// -----------------------------------------------------
-@import url('https://fonts.googleapis.com/css?family=Josefin+Sans:300,400,700');
@boxShadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
// TYPOGRAPHY
// -----------------------------------------------------
-h6 {
- color: @headingsColor;
+@import url('https://fonts.googleapis.com/css?family=Josefin+Sans:300,400,700');
+
+// SCAFFOLDING
+// -----------------------------------------------------
+
+hr {
+ border-bottom: none;
}
// NAVBAR
.navbar {
.navbar-inner {
- .box-shadow(inset 0 -1px #CFCACA);
+ .box-shadow(none);
}
.brand {
padding: 12px 20px 8px;
+ font-family: @headingsFontFamily;
font-weight: bold;
&:hover {
- color: @orange;
+ color: @linkColor;
}
}
- .navbar-text {
- padding: 14px 15px 7px;
- line-height: 19px;
- color: @grayLight;
- }
-
- .divider-vertical {
- height: @navbarHeight - 1;
- background-color: @hrBorder;
- }
-
.nav > li > a {
- padding: 14px 15px 7px;
+ padding: 13px 15px 6px;
+ font-family: @headingsFontFamily;
+ font-weight: bold;
text-shadow: none;
&:hover {
background-color: transparent;
}
+ .navbar-text {
+ padding: 13px 15px 7px;
+ line-height: 19px;
+ font-family: @headingsFontFamily;
+ color: @grayLight;
+ }
+
+ .divider-vertical {
+ height: @navbarHeight - 1;
+ background-color: @hrBorder;
+ }
+
.navbar-search {
margin-top: 5px;
}
}
- .nav li.dropdown.open > .dropdown-toggle,
- .nav li.dropdown.active > .dropdown-toggle:hover {
- color: @linkColor;
+ .dropdown-menu a {
+ font-family: @headingsFontFamily;
}
- .nav li.dropdown .dropdown-toggle .caret {
- border-top-color: @textColor;
- border-bottom-color: @textColor;
- opacity: 1;
- }
+ &-inverse {
- .nav li.dropdown .dropdown-toggle:hover .caret,
- .nav li.dropdown.active > .dropdown-toggle .caret,
- .nav li.dropdown.open .dropdown-toggle .caret {
- border-top-color: @linkColor;
- border-bottom-color: @linkColor;
+ .navbar-inner {
+ .box-shadow(none);
+ }
+
+ .brand:hover {
+ color: @white;
+ }
}
+}
+
+@media (max-width: @navbarCollapseWidth) {
- .nav-collapse.collapse {
+ .navbar .nav-collapse {
.nav li > a {
color: @textColor;
&:hover {
- background-color: @grayLighter;
+ background-image: none;
+ background-color: @dropdownLinkBackgroundHover;
}
}
+
+ .nav .active > a {
+ .box-shadow(none);
+ }
+
+ .navbar-form,
+ .navbar-search {
+ border-top: 1px solid rgba(128, 128, 128, 0.3);
+ border-bottom: 1px solid rgba(128, 128, 128, 0.3);
+ }
+ }
+
+ .navbar-inverse .nav-collapse {
+
+ .nav li > a {
+ color: @white;
+
+ &:hover {
+ background-color: rgba(255, 255, 255, 0.1) !important;
+ }
+ }
+
+ .nav-header {
+ color: rgba(255, 255, 255, 0.7);
+ }
}
}
background-color: @navbarBackground;
border-bottom: 1px solid transparent;
.box-shadow(@boxShadow);
+ font-family: @headingsFontFamily;
&.subnav-fixed {
.box-shadow(inset 0 5px #fff~"," @boxShadow);
.nav > li > a {
padding: 14px 12px 10px;
- color: @navbarText;
border-left-color: transparent;
border-right-color: transparent;
+ color: @navbarText;
+ font-weight: bold;
&:hover {
background-color: transparent;
.box-shadow(none);
color: @linkColor;
}
-
- .nav > li.dropdown.open > a,
- .nav > li.dropdown.open > a:hover {
- border-left-color: transparent;
- border-right-color: transparent;
- background-color: transparent;
- color: @linkColor;
- }
-
- .nav li.dropdown .dropdown-toggle .caret {
- border-top-color: @textColor;
- border-bottom-color: @textColor;
- opacity: 1;
- }
-
- .nav li.dropdown .dropdown-toggle:hover .caret,
- .nav li.dropdown.active .dropdown-toggle .caret,
- .nav li.dropdown.open .dropdown-toggle .caret {
- border-top-color: @linkColor;
- border-bottom-color: @linkColor;
- opacity: 1;
- }
-
- .dropdown.open:hover .dropdown-toggle {
- background-color: transparent;
- }
-}
-
-@media (max-width: 979px) {
- form.navbar-form, form.navbar-search {
- border-top: 1px solid #ccc;
- border-bottom: 1px solid #ccc;
- }
}
// NAV
}
}
-// FORMS
-// -----------------------------------------------------
+.breadcrumb {
+ background-color: @white;
+ border: 0px solid transparent;
+ .box-shadow(@boxShadow~", "-1px -1px 0 rgba(0, 0, 0, 0.1));
-legend {
- border-bottom: 1px solid #ddd;
-}
+ li {
+ padding-top: 2px;
+ text-shadow: none;
+ }
-.navbar-search .search-query {
- border: 1px solid #ddd;
- .border-radius(0);
- background-color: @bodyBackground;
- color: @gray;
-}
+ .active {
+ color: @textColor;
+ }
-.help-inline, .help-block {
- font-size: 13px;
+ a {
+ text-shadow: none;
+ }
+
+ a:hover {
+ text-decoration: none;
+ }
}
-// BUTTONS
-// -----------------------------------------------------
+.pagination {
-.btn {
- padding: 6px 10px 2px;
-}
+ ul > li > a,
+ ul > li > span {
+ padding: 2px 14px 0;
+ color: @textColor;
-.btn-large {
- padding: 11px 14px 8px;
-}
+ &:hover {
+ background-color: @dropdownLinkBackgroundHover;
+ color: @linkColor;
+ }
+ }
-.btn-small {
- padding: 5px 9px 3px;
-}
+ ul > .active > a,
+ ul > .active > span {
+ background-color: @dropdownLinkBackgroundHover;
+ color: @linkColor;
+ }
-.btn-micro {
- padding: 3px 6px 1px;
+ ul > .disabled > a,
+ ul > .disabled > a:hover,
+ ul > .disabled > span,
+ ul > .disabled > span:hover {
+ background-color: transparent;
+ color: @textColor;
+ }
}
-// MODALS
+
+// BUTTONS
// -----------------------------------------------------
-.modal-header {
- border-bottom: none;
+.btn {
+ padding-top: .6em;
+ font-family: @headingsFontFamily;
+ font-weight: bold;
}
-.modal-header,
-.modal-body {
- background-color: @navbarBackground;
+// TABLES
+// -----------------------------------------------------
+
+// FORMS
+// -----------------------------------------------------
+
+legend {
+ border-bottom: 1px solid #ddd;
+ font-family: @headingsFontFamily;
}
-.modal-footer {
+.navbar-search .search-query {
+ border: 1px solid #ddd;
+ .border-radius(0);
background-color: @bodyBackground;
+ color: @gray;
}
-// MISCELLANEOUS
-// -----------------------------------------------------
-
-i[class^="icon-"]{
- opacity: 0.5;
- vertical-align: -2px;
+.help-inline, .help-block {
+ font-size: 13px;
}
-hr {
- border-bottom: none;
+.input-append .btn,
+.input-prepend .btn {
+ line-height: 16px;
}
-.progress {
- #gradient > .vertical(#e0e0e0, #e8e8e8);
-}
+// DROPDOWNS
+// -----------------------------------------------------
+
+// ALERTS, LABELS, BADGES
+// -----------------------------------------------------
.label {
padding: 4px 4px 3px;
font-weight: normal;
}
-.hero-unit {
- background-color: @navbarBackground;
- .box-shadow(@boxShadow~", "-1px -1px 0 rgba(0, 0, 0, 0.1));
+// MISCELLANEOUS
+// -----------------------------------------------------
+
+i[class^="icon-"]{
+ opacity: 0.5;
+ vertical-align: -2px;
}
.well {
.box-shadow(@boxShadow~", "-1px -1px 0 rgba(0, 0, 0, 0.1));
- background-color: @white;
border: none;
}
+.hero-unit {
+ background-color: @navbarBackground;
+ .box-shadow(@boxShadow~", "-1px -1px 0 rgba(0, 0, 0, 0.1));
+}
+
.thumbnail {
padding: 10px;
background-color: @white;
}
-.breadcrumb {
- .box-shadow(@boxShadow~", "-1px -1px 0 rgba(0, 0, 0, 0.1));
- border: 0px solid transparent;
-
- li {
- padding-top: 5px;
- text-shadow: none;
- }
-
- a {
- text-shadow: none;
- }
-
- a:hover {
- text-decoration: none;
- }
+.progress {
+ #gradient > .vertical(#e0e0e0, #e8e8e8);
}
-.pagination {
-
- li > a {
- padding: 4px 14px 0;
- color: @textColor;
+.modal {
- &:hover {
- background-color: @dropdownLinkBackgroundHover;
- color: @linkColor;
- }
+ &-header {
+ border-bottom: none;
}
- li.active > a {
- background-color: @dropdownLinkBackgroundHover;
- color: @linkColor;
+ &-header,
+ &-body {
+ background-color: @navbarBackground;
}
-}
-
-@media (max-width: 979px) {
- .nav-collapse.collapse .navbar-form,
- .nav-collapse.collapse .navbar-search {
- border-top: 1px solid @grayLighter;
- border-bottom: 1px solid @grayLighter;
+ &-footer {
+ background-color: @bodyBackground;
}
}
+
+// MEDIA QUERIES
+// -----------------------------------------------------
projects / bootswatch / blobdiff