diff options
Diffstat (limited to 'flatly')
| -rw-r--r-- | flatly/_bootswatch.scss | 311 | ||||
| -rw-r--r-- | flatly/variables.less | 6 |
2 files changed, 314 insertions, 3 deletions
diff --git a/flatly/_bootswatch.scss b/flatly/_bootswatch.scss new file mode 100644 index 00000000..bebcabf6 --- /dev/null +++ b/flatly/_bootswatch.scss @@ -0,0 +1,311 @@ +// Flatly 3.3.0 +// Bootswatch +// ----------------------------------------------------- + +@import url("//fonts.googleapis.com/css?family=Lato:400,700,400italic"); + +// Navbar ===================================================================== + +.navbar { + border-width: 0; + + &-default { + + .badge { + background-color: #fff; + color: $navbar-default-bg; + } + } + + &-inverse { + + .badge { + background-color: #fff; + color: $navbar-inverse-bg; + } + } + + &-brand { + padding: 18.5px 15px 20.5px; + } +} + +// Buttons ==================================================================== + +.btn:active { + @include box-shadow(none); +} + +.btn-group.open .dropdown-toggle { + @include box-shadow(none); +} + +// Typography ================================================================= + +.text-primary, +.text-primary:hover { + color: $brand-primary; +} + +.text-success, +.text-success:hover { + color: $brand-success; +} + +.text-danger, +.text-danger:hover { + color: $brand-danger; +} + +.text-warning, +.text-warning:hover { + color: $brand-warning; +} + +.text-info, +.text-info:hover { + color: $brand-info; +} + +// Tables ===================================================================== + +table, +.table { + + a:not(.btn) { + text-decoration: underline; + } + + .dropdown-menu a { + text-decoration: none; + } + + .success, + .warning, + .danger, + .info { + color: #fff; + + a { + color: #fff; + } + } + + > thead > tr > th, + > tbody > tr > th, + > tfoot > tr > th, + > thead > tr > td, + > tbody > tr > td, + > tfoot > tr > td { + border: none; + } + + &-bordered > thead > tr > th, + &-bordered > tbody > tr > th, + &-bordered > tfoot > tr > th, + &-bordered > thead > tr > td, + &-bordered > tbody > tr > td, + &-bordered > tfoot > tr > td { + border: 1px solid $table-border-color; + } +} + +// Forms ====================================================================== + +.form-control, +input, { + border-width: 2px; + @include box-shadow(none); + + &:focus { + @include box-shadow(none); + } +} + +.has-warning { + .help-block, + .control-label, + .radio, + .checkbox, + .radio-inline, + .checkbox-inline, + .form-control-feedback { + color: $brand-warning; + } + + .form-control, + .form-control:focus { + border: 2px solid $brand-warning; + } + + .input-group-addon { + border-color: $brand-warning; + } +} + +.has-error { + .help-block, + .control-label, + .radio, + .checkbox, + .radio-inline, + .checkbox-inline, + .form-control-feedback { + color: $brand-danger; + } + + .form-control, + .form-control:focus { + border: 2px solid $brand-danger; + } + + .input-group-addon { + border-color: $brand-danger; + } +} + +.has-success { + .help-block, + .control-label, + .radio, + .checkbox, + .radio-inline, + .checkbox-inline, + .form-control-feedback { + color: $brand-success; + } + + .form-control, + .form-control:focus { + border: 2px solid $brand-success; + } + + .input-group-addon { + border-color: $brand-success; + } +} + +// Navs ======================================================================= + +.nav { + .open > a, + .open > a:hover, + .open > a:focus { + border-color: transparent; + } +} + +.pager { + a, + a:hover { + color: #fff; + } + + .disabled { + &>a, + &>a:hover, + &>a:focus, + &>span { + background-color: $pagination-disabled-bg; + } + } +} + +// Indicators ================================================================= + +.close { + color: #fff; + text-decoration: none; + opacity: 0.4; + + &:hover, + &:focus { + color: #fff; + opacity: 1; + } +} + +.alert { + + .alert-link { + color: #fff; + text-decoration: underline; + } +} + +// Progress bars ============================================================== + +.progress { + height: 10px; + @include box-shadow(none); + .progress-bar { + font-size: 10px; + line-height: 10px; + } +} + +// Containers ================================================================= + +.well { + @include box-shadow(none); +} + +a.list-group-item { + + &.active, + &.active:hover, + &.active:focus { + border-color: $list-group-border; + } + + &-success { + &.active { + background-color: $state-success-bg; + } + + &.active:hover, + &.active:focus { + background-color: darken($state-success-bg, 5%); + } + } + + &-warning { + &.active { + background-color: $state-warning-bg; + } + + &.active:hover, + &.active:focus { + background-color: darken($state-warning-bg, 5%); + } + } + + &-danger { + &.active { + background-color: $state-danger-bg; + } + + &.active:hover, + &.active:focus { + background-color: darken($state-danger-bg, 5%); + } + } +} + +.panel { + &-default { + .close { + color: $text-color; + } + } +} + +.modal { + .close { + color: $text-color; + } +} + +.popover { + color: $text-color; +} diff --git a/flatly/variables.less b/flatly/variables.less index a3f54856..fed4466e 100644 --- a/flatly/variables.less +++ b/flatly/variables.less @@ -236,7 +236,7 @@ //** Hover color for dropdown links. @dropdown-link-hover-color: #fff; //** Hover background for dropdown links. -@dropdown-link-hover-bg: @dropdown-link-active-bg; +@dropdown-link-hover-bg: @component-active-bg; //** Active dropdown menu item text color. @dropdown-link-active-color: #fff; @@ -244,10 +244,10 @@ @dropdown-link-active-bg: @component-active-bg; //** Disabled dropdown menu item background color. -@dropdown-link-disabled-color: @text-muted; +@dropdown-link-disabled-color: @gray-light; //** Text color for headers within dropdown menus. -@dropdown-header-color: @text-muted; +@dropdown-header-color: @gray-light; //** Deprecated `@dropdown-caret-color` as of v3.1.0 @dropdown-caret-color: #000; |