diff options
Diffstat (limited to '2/cosmo/bootswatch.less')
| -rw-r--r-- | 2/cosmo/bootswatch.less | 624 |
1 files changed, 624 insertions, 0 deletions
diff --git a/2/cosmo/bootswatch.less b/2/cosmo/bootswatch.less new file mode 100644 index 00000000..d7c85cf6 --- /dev/null +++ b/2/cosmo/bootswatch.less @@ -0,0 +1,624 @@ +// Cosmo 2.3.2 +// Bootswatch +// ----------------------------------------------------- + + +// TYPOGRAPHY +// ----------------------------------------------------- + +@import url('//fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700'); + +body { + font-weight: 300; +} + +h1 { + font-size: 50px; +} + +h2, h3 { + font-size: 26px; +} + +h4 { + font-size: 14px; +} + +h5, h6 { + font-size: 11px; +} + +blockquote { + + padding: 10px 15px; + background-color: @grayLighter; + border-left-color: @gray; + + &.pull-right { + padding: 10px 15px; + border-right-color: @gray; + } + + small { + color: @gray; + } +} + +.muted { + color: @gray; +} + +.text-warning { color: @orange; } +a.text-warning:hover { color: darken(@orange, 10%); } + +.text-error { color: @red; } +a.text-error:hover { color: darken(@red, 10%); } + +.text-info { color: @purple; } +a.text-info:hover { color: darken(@purple, 10%); } + +.text-success { color: @green; } +a.text-success:hover { color: darken(@green, 10%); } + +// SCAFFOLDING +// ----------------------------------------------------- + +// NAVBAR +// ----------------------------------------------------- + +.navbar { + + .navbar-inner { + background-image: none; + .box-shadow(none); + .border-radius(0); + } + + .brand { + + &:hover { + color: @navbarLinkColorHover; + } + } + + .nav > .active > a, + .nav > .active > a:hover, + .nav > .active > a:focus { + .box-shadow(none); + background-color: @navbarLinkBackgroundHover; + } + + .nav li.dropdown.open > .dropdown-toggle, + .nav li.dropdown.active > .dropdown-toggle, + .nav li.dropdown.open.active > .dropdown-toggle { + color: @white; + + &:hover { + color: @grayLighter; + } + } + + .navbar-search .search-query { + line-height: normal; + } + + &-inverse { + + .brand, + .nav > li > a { + text-shadow: none; + } + + .brand:hover, + .nav > .active > a, + .nav > .active > a:hover, + .nav > .active > a:focus { + background-color: @navbarInverseLinkBackgroundHover; + .box-shadow(none); + color: @white; + } + + .navbar-search .search-query { + color: @grayDarker; + } + } +} + +div.subnav { + + margin: 0 1px; + background: @grayLight none; + .box-shadow(none); + border: none; + .border-radius(0); + + .nav { + background-color: transparent; + } + + .nav > li > a { + border-color: transparent; + } + + .nav > .active > a, + .nav > .active > a:hover { + border-color: transparent; + background-color: @black; + color: @white; + .box-shadow(none); + } + + &-fixed { + top: @navbarHeight + 1; + margin: 0; + } +} + +// NAV +// ----------------------------------------------------- + +.nav { + + .open .dropdown-toggle, + & > li.dropdown.open.active > a:hover { + color: @blue; + } +} + +.nav-tabs { + + & > li > a { + .border-radius(0); + } + + &.nav-stacked { + + & > li > a:hover { + background-color: @blue; + color: @white; + } + + & > .active > a, + & > .active > a:hover { + background-color: @white; + color: @gray; + } + + & > li:first-child > a, + & > li:last-child > a { + .border-radius(0); + } + } +} + +.tabs-below, +.tabs-left, +.tabs-right { + + & > .nav-tabs > li > a{ + .border-radius(0); + } +} + +.nav-pills { + + & > li > a { + background-color: @grayLight; + .border-radius(0); + color: @black; + + &:hover { + background-color: @black; + color: @white; + } + } + + & > .disabled > a, + & > .disabled > a:hover { + background-color: @grayLighter; + color: @grayDark; + } +} + +.nav-list { + + & > li > a { + color: @grayDarker; + + &:hover { + background-color: @blue; + color: @white; + text-shadow: none; + } + } + + .nav-header { + color: @grayDarker; + } + + .divider { + background-color: @gray; + border-bottom: none; + } +} + +.pagination { + + ul { + + .box-shadow(none); + + & > li > a, + & > li > span { + margin-right: 6px; + color: @grayDarker; + + &:hover { + background-color: @grayDarker; + color: @white; + } + } + + & > li:last-child > a, + & > li:last-child > span { + margin-right: 0; + } + + & > .active > a, + & > .active > span { + color: @white; + } + + & > .disabled > span, + & > .disabled > a, + & > .disabled > a:hover { + background-color: @grayLighter; + color: @grayDark; + } + } +} + +.pager { + + li > a, + li > span { + background-color: @grayLight; + border: none; + .border-radius(0); + color: @grayDarker; + + &:hover { + background-color: @grayDarker; + color: @white; + } + } + + .disabled > a, + .disabled > a:hover, + .disabled > span { + background-color: @grayLighter; + color: @grayDark; + } + +} + +.breadcrumb { + background-color: @grayLight; + + li { + text-shadow: none; + } + + .divider, + .active { + color: @grayDarker; + text-shadow: none; + } +} + +// BUTTONS +// ----------------------------------------------------- + +.btn { + padding: 5px 12px; + background-image: none; + .box-shadow(none); + border: none; + .border-radius(0); + text-shadow: none; + + &.disabled { + box-shadow: inset 0 2px 4px rgba(0,0,0,.15),~" "0 1px 2px rgba(0,0,0,.05); + } +} + +.btn-large { + padding: 22px 30px; +} + +.btn-small { + padding: 2px 10px; +} + +.btn-mini { + padding: 2px 6px; +} + +.btn-group { + + & > .btn:first-child, + & > .btn:last-child, + & > .dropdown-toggle { + .border-radius(0); + } + + & > .btn + .dropdown-toggle { + .box-shadow(none); + } +} + +// TABLES +// ----------------------------------------------------- + +.table { + + tbody tr.success td, + tbody tr.error td, + tbody tr.info td, + tbody tr.warning td { + color: @white; + } + + &-bordered { + .border-radius(0); + + thead:first-child tr:first-child th:first-child, + tbody:first-child tr:first-child td:first-child { + .border-radius(0); + } + + thead:last-child tr:last-child th:first-child, + tbody:last-child tr:last-child td:first-child, + tfoot:last-child tr:last-child td:first-child { + .border-radius(0); + } + } +} + +// FORMS +// ----------------------------------------------------- + +select, textarea, input[type="text"], input[type="password"], input[type="datetime"], +input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], +input[type="week"], input[type="number"], input[type="email"], input[type="url"], +input[type="search"], input[type="tel"], input[type="color"] { + color: @grayDarker; +} + +.control-group { + + &.warning { + + .control-label, + .help-block, + .help-inline { + color: @orange; + } + + input, + select, + textarea { + border-color: @orange; + color: @grayDarker; + } + } + + &.error { + + .control-label, + .help-block, + .help-inline { + color: @red; + } + + input, + select, + textarea { + border-color: @red; + color: @grayDarker; + } + } + + &.info { + + .control-label, + .help-block, + .help-inline { + color: @purple; + } + + input, + select, + textarea { + border-color: @purple; + color: @grayDarker; + } + } + + &.success { + + .control-label, + .help-block, + .help-inline { + color: @green; + } + + input, + select, + textarea { + border-color: @green; + color: @grayDarker; + } + } +} + +legend { + border-bottom: none; + color: @grayDarker; +} + +.form-actions { + border-top: none; + background-color: @grayLighter; +} + +// DROPDOWNS +// ----------------------------------------------------- + +.dropdown-menu { + .border-radius(0); +} + +// ALERTS, LABELS, BADGES +// ----------------------------------------------------- + +.alert { + .border-radius(0); + text-shadow: none; + + &-heading, h1, h2, h3, h4, h5, h6 { + color: @white; + } +} + +.label { + min-width: 80px; + min-height: 80px; + .border-radius(0); + font-weight: 300; + text-shadow: none; + + &-success { + background-color: @green; + } + + &-important { + background-color: @red; + } + + &-info { + background-color: @purple; + } + + &-inverse { + background-color: @black; + } +} + +.badge { + + .border-radius(0); + font-weight: 300; + text-shadow: none; + + &-success { + background-color: @green; + } + + &-important { + background-color: @red; + } + + &-info { + background-color: @purple; + } + + &-inverse { + background-color: @black; + } +} + +// MISC +// ----------------------------------------------------- + +.hero-unit { + border: none; + .border-radius(0); + .box-shadow(none); +} + +.well { + border: none; + .border-radius(0); + .box-shadow(none); +} + +[class^="icon-"], [class*=" icon-"] { + margin: 0 2px; + vertical-align: -2px; +} + +a.thumbnail { + background-color: @grayLight; + + &:hover { + background-color: @gray; + border-color: transparent; + } +} + +.progress { + height: 6px; + .border-radius(0); + .box-shadow(none); + background-color: @grayLighter; + background-image: none; + + .bar { + background-color: @blue; + background-image: none; + } + + &-info { + background-color: @purple; + } + + &-success { + background-color: @green; + } + + &-warning { + background-color: @orange; + } + + &-danger { + background-color: @red; + } +} + +.modal { + .border-radius(0); + + &-header { + border-bottom: none; + } + + &-footer { + border-top: none; + background-color: transparent; + } +} + +.popover { + .border-radius(0); + color: @white; + + &-title { + border-bottom: none; + color: @white; + } + +} + +// MEDIA QUERIES +// ----------------------------------------------------- |