X-Git-Url: http://git.roojs.org/?a=blobdiff_plain;f=cyborg%2Fbootswatch.less;h=7af6abb57b1423164a10f656210c3f3cebaa5a24;hb=48c64127b37be4a692a70cb7b38ed9744163582b;hp=f856175f058104b087ded88d2d04b10e1732b143;hpb=f92ce0f8e3bf510ce012aa744f7e45263503812a;p=bootswatch diff --git a/cyborg/bootswatch.less b/cyborg/bootswatch.less old mode 100755 new mode 100644 index f856175..7af6abb --- a/cyborg/bootswatch.less +++ b/cyborg/bootswatch.less @@ -1,485 +1,141 @@ -// Bootswatch.less -// Swatch: Cyborg -// Version: 2.0.3 +// Cyborg 3.0.1 +// Bootswatch // ----------------------------------------------------- -// TYPOGRAPHY -// ----------------------------------------------------- +@import url("//fonts.googleapis.com/css?family=Droid+Sans:400,700"); -@import url('https://fonts.googleapis.com/css?family=Droid+Sans:400,700'); +// Navbar ===================================================================== .navbar { - font-size: 16px; -} - -.navbar .brand, -.navbar .nav-collapse.in .nav li > a { - color: @grayLighter; - font-weight: normal; - text-shadow: none; -} - -label, input, button, select, textarea, -.navbar .search-query:-moz-placeholder, -.navbar .search-query::-webkit-input-placeholder { - font-family: 'Droid Sans', sans-serif; - color: @gray; -} - -.jumbotron h1 { - font-weight: normal !important; -} - -// SCAFFOLDING -// ----------------------------------------------------- - -body { - #gradient > .vertical (@bodyBackground, #252A30); -} - -.page-header { - border-bottom: 2px solid @blue -} - -// NAVBAR -// ----------------------------------------------------- - -.navbar-inner { - .border-radius(0); - .box-shadow(none); - border-bottom: 2px solid @blue -} - -.navbar .brand { - padding: 12px 20px 8px; -} - -.navbar .nav li > a { - padding: 13px 10px 8px; - border-bottom: 3px solid rgba(0, 0, 0, 0); -} - -.navbar .nav .active > a, -.navbar .nav li > a:hover, -.navbar .brand:hover { - border-bottom: 3px solid @blue -} - -.navbar .search-query, -.navbar .search-query:focus, -.navbar .search-query.focused { - color: @grayLight; - text-shadow: none; - background-color: #222; - .border-radius(1px); - .placeholder(@gray); -} - -.navbar .nav > li > a { - border-left: 1px solid #222; -} - -.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; + border-bottom: 1px solid @gray-dark; } -.dropdown-menu .divider { - background-color: #222; - border-bottom: 0px solid white; -} - -.navbar .dropdown-menu::before, -.navbar .dropdown-menu::after { - display: none; -} - -.navbar .nav-collapse.in .nav > li > a { - border-left: 0; -} +// Buttons ==================================================================== -.navbar .nav-collapse.in .nav a:hover { - background-color: @blue; -} +// Typography ================================================================= -div.subnav { - position: static; - background-color: @grayDarker; - background-image: none; - border: 0; +.text-primary { + color: @brand-primary; } -div.subnav.subnav-fixed { - position: relative; - left: -1px; - top: auto; +.text-success { + color: @brand-success; } -div.subnav .nav > li > a, -div.subnav .nav .active a { - background-color: @grayDarker; - border-left: 1px solid #222; - border-right: 0; - color: @grayLighter; +.text-danger { + color: @brand-danger; } -div.subnav .nav li.nav-header { - text-shadow: none; +.text-warning { + color: @brand-warning; } -.subnav .nav > li > a:hover, -.subnav .nav > li.active > a:hover, -.subnav .nav > li:first-child > a:hover { - background: transparent; - border-bottom: 2px solid @blue; - border-left: 1px solid #222; - color: @white; +.text-info { + color: @brand-info; } -div.subnav .nav .open { - - .dropdown-toggle { - border: 0; - border-left: 1px solid #222; - border-bottom: 2px solid @blue; - background-color: #060606; - } - - .dropdown-menu { - background-color: @grayDarker; - border-left: solid 1px rgba(255, 255, 255, 0.1); - - li > a:hover { - border-bottom: 0; - background: @blue; - } - } -} - -@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; - } -} +// Tables ===================================================================== -// NAVIGATION -// ----------------------------------------------------- +.table { -.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; + tr.success, + tr.warning, + tr.danger { + color: #fff; } } -.nav-tabs { - - border-bottom: 1px solid #222; - - li > a:hover, - li.active > a, - li.active > a:hover { - border: 1px solid #222; - background-color: @blue; - color: @white; - } - - .open .dropdown-toggle { - background-color: #060606 !important; - border: 1px solid #222; - } - - .dropdown-menu li > a:hover { - border: none; - } +.table-responsive > .table { + background-color: @table-bg; } -.nav-pills { +// Forms ====================================================================== - li > a:hover { - background-color: @blue; - color: @white; - } - - .open .dropdown-toggle { - background-color: #060606; +.has-warning { + .help-block, + .control-label { + color: @brand-warning; } - - .dropdown-menu li > a:hover { - border: none; - } -} -.nav-stacked { - - li > a { - border: 1px solid #222 !important; - } - - li > a:hover, - li.active > a { - background-color: @blue; - color: @white; + .form-control, + .form-control:focus { + border-color: @brand-warning; } } -.tabbable { - .nav-tabs, - .nav-tabs li.active > a { - border-color: #222; +.has-error { + .help-block, + .control-label { + color: @brand-danger; } -} -.breadcrumb { - background-color: transparent; - background-image: none; - border-width: 0; - .box-shadow(none); - font-size: 14px; - - li > a { - color: @blue; - text-shadow: none; - } - - li.active { - text-shadow: none; + .form-control, + .form-control:focus { + border-color: @brand-danger; } } -.pagination { - ul { - .box-shadow(none); - } - - a { - border: 0; - font-size: 14px; +.has-success { + .help-block, + .control-label { + color: @brand-success; } - - a:hover, .active a { - background-color: @blue; - color: @white; - } -} - -// BUTTONS -// ----------------------------------------------------- -.btn { - .box-shadow(1px 1px 2px #111); - .buttonBackground(darken(@gray, 20%), darken(@gray, 30%)); - color: @white; - text-shadow: none; - - &:hover { - text-shadow: none; - color: @white; + .form-control, + .form-control:focus { + border-color: @brand-success; } } -.btn-primary { - .buttonBackground(@blueDark, darken(@blueDark, 10%)); -} - -.btn-warning { - .buttonBackground(lighten(@orange, 10%), @orange); -} - -.btn-danger { - .buttonBackground(lighten(@red, 10%), @red); -} - -.btn-success { - .buttonBackground(lighten(@green, 10%), @green); -} - -.btn-info { - .buttonBackground(darken(@gray, 40%), darken(@gray, 50%)); -} - -.btn-inverse { - .buttonBackground(lighten(@purple, 5%), @purple); -} - -.btn .caret { - border-top: 4px solid black; - opacity: 0.3; -} - -.btn-group > .dropdown-menu > li > a:hover { - border-bottom: 0; -} - -.btn.disabled, .btn[disabled] { - background-color: @grayLight; -} - -// FORMS -// ----------------------------------------------------- - -input, textarea, select { - border-width: 2px; -} - -legend, label { - color: @textColor; - border-bottom: 0px solid #222; -} - -input, textarea, select, .uneditable-input { - color: @grayDark; -} - -input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly], .uneditable-input { - background-color: #555; - border-color: #444; -} - -input:focus, -textarea:focus, -input.focused, -textarea.focused { - border-color: rgba(82,168,236,1); - outline: 0; - outline: thin dotted \9; /* IE6-9 */ +legend { + color: #fff; } -input[type="file"]:focus, -input[type="radio"]:focus, -input[type="checkbox"]:focus, -select:focus { - .box-shadow(none); // override for file inputs - .tab-focus(); +.input-group-addon { + background-color: @btn-default-bg; } -.form-actions { - border-top: 1px solid #222; -} - -// MODALS -// ----------------------------------------------------- - -.modal { - .border-radius(1px); - border-top: solid 1px rgba(255, 255, 255, 0.3); - background-color: @grayDark; -} - -.modal-header { - border-bottom: 1px solid #222; -} +// Navs ======================================================================= -.modal-footer { - background-color: @grayDark; - border-top: 1px solid #222; - .border-radius(0 0 6px 6px); - .box-shadow(none); -} +.nav { -// MISCELLANEOUS -// ----------------------------------------------------- - -.table, .well, .hero-unit, .prettyprint, input, textarea, select { - .border-radius(1px); -} - -code, pre { - background-color: @grayLighter; + .caret, + a:hover .caret { + border-top-color: #fff; + border-bottom-color: #fff; + } } -.well, .hero-unit { - background-color: #131517; - border-top: solid 1px rgba(255, 255, 255, 0.1); - .box-shadow(0 2px 4px rgba(0,0,0,.8)); -} +.nav-tabs, +.nav-pills, +.breadcrumb, +.pagination, +.pager { -blockquote { - border-left: 5px solid @blue; - - &.pull-right { - border-right: 5px solid @blue; + a { + color: #fff; } } -.thumbnail { - border-color: #222; -} +// Indicators ================================================================= -.progress { - background-color: #060606; - background-image: none; - .border-radius(0); -} +.alert { -.label { - color: @grayLighter; + .alert-link, + a { + color: @alert-warning-text; + text-decoration: underline; + } } -.label, .alert { background-color: darken(@gray, 20%); } - -.label:hover { background-color: darken(@gray, 30%); } - -.label-important, .alert-danger, -.alert-error { background-color: @red; } - -.label-important:hover { background-color: darken(@red, 10%); } - -.label-warning { background-color: darken(@orange, 10%); } +// Progress bars ============================================================== -.label-warning:hover { background-color: darken(@orange, 20%); } +// Containers ================================================================= -.label-success, .alert-success { background-color: darken(@green, 3%); } +.jumbotron { -.label-success:hover { background-color: darken(@green, 13%); } - -.label-info, .alert-info { background-color: darken(@blueDark, 10%); } - -.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; -} - -footer.footer { - border-top: 1px solid #222; -} + h1, h2, h3, h4, h5, h6 { + color: #fff; + } +} \ No newline at end of file