mirror of
https://github.com/thomaspark/bootswatch.git
synced 2025-10-15 22:12:58 +00:00
306 lines
5.4 KiB
Plaintext
Executable File
306 lines
5.4 KiB
Plaintext
Executable File
// Spacelab 2.3.2
|
|
// Bootswatch
|
|
// -----------------------------------------------------
|
|
|
|
|
|
// TYPOGRAPHY
|
|
// -----------------------------------------------------
|
|
|
|
@import url('//fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700');
|
|
|
|
.text-warning { color: @warningBackground; }
|
|
a.text-warning:hover,
|
|
a.text-warning:focus { color: darken(@warningBackground, 10%); }
|
|
|
|
.text-error { color: @errorBackground; }
|
|
a.text-error:hover,
|
|
a.text-error:focus { color: darken(@errorBackground, 10%); }
|
|
|
|
.text-info { color: @infoBackground; }
|
|
a.text-info:hover,
|
|
a.text-info:focus { color: darken(@infoBackground, 10%); }
|
|
|
|
.text-success { color: @successBackground; }
|
|
a.text-success:hover,
|
|
a.text-success:focus { color: darken(@successBackground, 10%); }
|
|
|
|
// SCAFFOLDING
|
|
// -----------------------------------------------------
|
|
|
|
// NAVBAR
|
|
// -----------------------------------------------------
|
|
|
|
.navbar {
|
|
|
|
.brand {
|
|
|
|
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
|
|
.transition(color ease-in-out .2s);
|
|
|
|
&:hover {
|
|
color: @navbarLinkColorHover;
|
|
.transition(color ease-in-out .2s);
|
|
}
|
|
}
|
|
|
|
.nav > li > a {
|
|
padding: 11px 10px 8px;
|
|
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
|
|
.transition(color ease-in-out .2s);
|
|
|
|
&:hover {
|
|
.transition(color ease-in-out .2s);
|
|
}
|
|
}
|
|
|
|
.navbar-text {
|
|
padding: 11px 10px 8px;
|
|
line-height: inherit;
|
|
}
|
|
|
|
.navbar-search .search-query,
|
|
.navbar-search .search-query:hover {
|
|
margin-bottom: 0;
|
|
line-height: normal;
|
|
color: @grayLight;
|
|
.placeholder(@grayLight);
|
|
.box-shadow(inset 0 1px 2px rgba(0, 0, 0, 0.5));
|
|
|
|
&:focus,
|
|
&.focused {
|
|
.box-shadow(inset 0 1px 2px rgba(0, 0, 0, 0.5));
|
|
color: @textColor;
|
|
}
|
|
}
|
|
|
|
&-inverse {
|
|
|
|
.brand {
|
|
text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
|
|
|
|
&:hover {
|
|
color: @white;
|
|
}
|
|
}
|
|
|
|
.nav > li > a {
|
|
text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
.nav li.dropdown.open > .dropdown-toggle .caret,
|
|
.nav li.dropdown:hover > .dropdown-toggle .caret,
|
|
.nav li.dropdown.open:hover > .dropdown-toggle .caret {
|
|
border-top-color: @white;
|
|
}
|
|
|
|
.navbar-search .search-query,
|
|
.navbar-search .search-query:hover {
|
|
|
|
color: @white;
|
|
|
|
.placeholder(@grayLighter);
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (max-width: @navbarCollapseWidth) {
|
|
|
|
.navbar .nav-collapse {
|
|
|
|
.nav li > a:hover {
|
|
background-color: @linkColor;
|
|
color: @white;
|
|
text-shadow: none;
|
|
}
|
|
|
|
.navbar-search {
|
|
border-top: none;
|
|
border-bottom: none;
|
|
}
|
|
}
|
|
|
|
.navbar-inverse .nav-collapse {
|
|
|
|
.nav li > a {
|
|
color: @grayLight !important;
|
|
|
|
&:hover {
|
|
background-color: @linkColor !important;
|
|
}
|
|
}
|
|
|
|
.nav-header {
|
|
color: @grayLighter;
|
|
}
|
|
}
|
|
}
|
|
|
|
div.subnav {
|
|
|
|
.nav > li > a {
|
|
|
|
color: @navbarLinkColor;
|
|
.transition(color ease-in-out .2s);
|
|
|
|
&:hover {
|
|
border-left-color: @grayLight;
|
|
color: @navbarLinkColorHover;
|
|
.transition(color ease-in-out .2s);
|
|
}
|
|
}
|
|
|
|
.nav > li.active > a {
|
|
|
|
color: @textColor;
|
|
|
|
&:hover {
|
|
color: @textColor;
|
|
}
|
|
}
|
|
|
|
.nav > li.dropdown > .dropdown-toggle {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.nav > li.dropdown.open > .dropdown-toggle {
|
|
|
|
border-left: 1px solid whiteSmoke;
|
|
border-right: 1px solid #E5E5E5;
|
|
color: @textColor;
|
|
|
|
&:hover {
|
|
color: @linkColor;
|
|
}
|
|
}
|
|
|
|
&-fixed {
|
|
top: @navbarHeight + 1;
|
|
}
|
|
}
|
|
|
|
// NAV
|
|
// -----------------------------------------------------
|
|
|
|
.nav > li > a:hover,
|
|
.nav > li > a:focus {
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
}
|
|
|
|
.nav > li.dropdown > .dropdown-toggle,
|
|
.nav > li.dropdown.active > .dropdown-toggle,
|
|
.nav > li.dropdown.open > .dropdown-toggle,
|
|
.nav > li.dropdown.open.active > .dropdown-toggle {
|
|
|
|
.caret {
|
|
border-top: 4px solid @textColor;
|
|
border-top-color: @textColor;
|
|
opacity: 1;
|
|
}
|
|
|
|
&:hover .caret {
|
|
border-top: 4px solid @linkColorHover;
|
|
border-top-color: @linkColorHover;
|
|
}
|
|
}
|
|
|
|
.nav-list .divider {
|
|
background-color: @dropdownDividerTop;
|
|
border-bottom-color: @dropdownDividerBottom;
|
|
}
|
|
|
|
// BUTTONS
|
|
// -----------------------------------------------------
|
|
|
|
[class^="icon-"],
|
|
[class*=" icon-"] {
|
|
margin-top: 4px;
|
|
}
|
|
|
|
// TABLES
|
|
// -----------------------------------------------------
|
|
|
|
.table {
|
|
|
|
tbody tr.success > td,
|
|
tbody tr.error > td,
|
|
tbody tr.info > td {
|
|
color: @white;
|
|
}
|
|
|
|
}
|
|
|
|
// FORMS
|
|
// -----------------------------------------------------
|
|
|
|
.control-group.warning {
|
|
.formFieldState(#E29235, #E29235, @warningBackground);
|
|
}
|
|
|
|
.control-group.error {
|
|
.formFieldState(#C00, #C00, @errorBackground);
|
|
}
|
|
|
|
.control-group.success {
|
|
.formFieldState(#2BA949, #2BA949, @successBackground);
|
|
}
|
|
|
|
.control-group.info {
|
|
.formFieldState(@blue, @blue, @infoBackground);
|
|
}
|
|
|
|
// DROPDOWNS
|
|
// -----------------------------------------------------
|
|
|
|
// ALERTS, LABELS, BADGES
|
|
// -----------------------------------------------------
|
|
|
|
.alert {
|
|
|
|
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
color: @white;
|
|
font-weight: bold;
|
|
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
|
|
}
|
|
|
|
a {
|
|
color: @white;
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
|
|
.label, .badge {
|
|
|
|
&-important {
|
|
background-color: @red;
|
|
}
|
|
|
|
&-warning {
|
|
background-color: @orange;
|
|
}
|
|
|
|
&-success {
|
|
background-color: @green;
|
|
}
|
|
|
|
&-info {
|
|
background-color: @blue;
|
|
}
|
|
}
|
|
|
|
// MISC
|
|
// -----------------------------------------------------
|
|
|
|
.well {
|
|
// .box-shadow(inset 1px 1px 0 rgba(0,0,0,.1));
|
|
}
|
|
|
|
.hero-unit {
|
|
// .box-shadow(inset 1px 1px 0 rgba(0,0,0,.1));
|
|
border: 1px solid rgba(0,0,0,.1);
|
|
}
|
|
|
|
// MEDIA QUERIES
|
|
// -----------------------------------------------------
|