diff options
Diffstat (limited to 'docs/css/bootswatch.less')
-rw-r--r-- | docs/css/bootswatch.less | 212 |
1 files changed, 79 insertions, 133 deletions
diff --git a/docs/css/bootswatch.less b/docs/css/bootswatch.less index 3c353e9822..5a4dbac4a2 100644 --- a/docs/css/bootswatch.less +++ b/docs/css/bootswatch.less @@ -1,181 +1,127 @@ -// Cerulean 2.2.2 +// Cerulean 3.3.0 // Bootswatch // ----------------------------------------------------- - -// TYPOGRAPHY -// ----------------------------------------------------- - @import url(//fonts.googleapis.com/css?family=Telex); -// SCAFFOLDING -// ----------------------------------------------------- +.btn-shadow(@color) { + #gradient > .vertical-three-colors(lighten(@color, 8%), @color, 60%, darken(@color, 4%)); + filter: none; + border-bottom: 1px solid darken(@color, 10%); +} -// NAVBAR -// ----------------------------------------------------- +// Navbar ===================================================================== .navbar { + .btn-shadow(@navbar-default-bg); + filter: none; + .box-shadow(0 1px 10px rgba(0, 0, 0, 0.1)); + &-default { - .brand { - padding: 14px 20px 16px; - font-family: @headingsFontFamily; - text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2); - } - - li { - line-height: 20px; - } - - .nav > li > a { - padding: 16px 10px 14px; - font-family: @headingsFontFamily; - text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2); - } - - .search-query { - border: 1px solid darken(@linkColor, 10%); - line-height: normal; - } - - .navbar-text { - padding: 19px 10px 18px; - line-height: 13px; - color: rgba(0, 0, 0, 0.5); - text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3); - } - - &-inverse { - - .navbar-search .search-query { - color: @textColor; - } - } -} - -@media (max-width: @navbarCollapseWidth) { - - .navbar .nav-collapse { - - .nav li > a { + .badge { + background-color: #fff; + color: @navbar-default-bg; + } + } - font-family: @headingsFontFamily; - font-weight: normal; - color: @white; - text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2); + &-inverse { + #gradient > .vertical-three-colors(lighten(@navbar-inverse-bg, 8%), lighten(@navbar-inverse-bg, 4%), 60%, darken(@navbar-inverse-bg, 2%)); + filter: none; + border-bottom: 1px solid darken(@navbar-inverse-bg, 10%); - &:hover { - background-color: #2B7CAC; - } - } + .badge { + background-color: #fff; + color: @navbar-inverse-bg; + } + } - .nav .active > a { - .box-shadow(none); - background-color: #2B7CAC; - } + .navbar-nav > li > a, + &-brand { + text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1); + } +} - .dropdown-menu li > a:hover, - .dropdown-menu li > a:focus, - .dropdown-submenu:hover > a { - background-image: none; - } +@media (max-width: @grid-float-breakpoint-max) { - .navbar-form, - .navbar-search { - border: none; - } + .navbar { - .nav-header { - color: #2B7CAC; - } - } + .dropdown-header { + color: #fff; + } + } +} - .navbar-inverse .nav-collapse { +// Buttons ==================================================================== - .nav li > a { - color: @navbarInverseLinkColor; +.btn { - &:hover { - background-color: rgba(0, 0, 0, 0.1); - } - } + text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1); - .nav .active > a, - .nav > li > a:hover, - .dropdown-menu a:hover { - background-color: rgba(0, 0, 0, 0.1) !important; - } - } + .caret { + border-top-color: #fff; + } } -div.subnav { +.btn-default { + + .btn-shadow(@btn-default-bg); - font-family: @headingsFontFamily; - text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.2); + &:hover { + color: @btn-default-color; + } - &-fixed { - top: @navbarHeight; - } + .caret { + border-top-color: @text-color; + } } -// NAV -// ----------------------------------------------------- - -// BUTTONS -// ----------------------------------------------------- - -.btn { - #gradient > .vertical-three-colors(@white, @white, 5%, darken(@white, 0%)); - @shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05); - .box-shadow(@shadow); - - &:hover { - background-position: 0 0; - } +.btn-default { + .btn-shadow(@btn-default-bg); } .btn-primary { - .buttonBackground(lighten(@btnPrimaryBackground, 5%), @btnPrimaryBackground); + .btn-shadow(@btn-primary-bg); } -.btn-info { - .buttonBackground(lighten(@btnInfoBackground, 5%), @btnInfoBackground); +.btn-success { + .btn-shadow(@btn-success-bg); } -.btn-success { - .buttonBackground(lighten(@btnSuccessBackground, 5%), @btnSuccessBackground); +.btn-info { + .btn-shadow(@btn-info-bg); } .btn-warning { - .buttonBackground(lighten(@btnWarningBackground, 5%), @btnWarningBackground); + .btn-shadow(@btn-warning-bg); } .btn-danger { - .buttonBackground(lighten(@btnDangerBackground, 5%), @btnDangerBackground); + .btn-shadow(@btn-danger-bg); } -.btn-inverse { - .buttonBackground(lighten(@btnInverseBackground, 5%), @btnInverseBackground); -} +// Typography ================================================================= -// TABLES -// ----------------------------------------------------- +// Tables ===================================================================== -// FORMS -// ----------------------------------------------------- +// Forms ====================================================================== -// DROPDOWNS -// ----------------------------------------------------- +// Navs ======================================================================= -// ALERTS, LABELS, BADGES -// ----------------------------------------------------- +// Indicators ================================================================= -// MISC -// ----------------------------------------------------- +// Progress bars ============================================================== -i[class^="icon-"]{ - opacity: 0.8; -} +// Containers ================================================================= -// MEDIA QUERIES -// ----------------------------------------------------- +.panel-primary, +.panel-success, +.panel-warning, +.panel-danger, +.panel-info { + + .panel-heading, + .panel-title { + color: #fff; + } +} |