| 1 | // stylelint-disable selector-no-qualifying-type, selector-max-compound-selectors
|
|---|
| 2 |
|
|---|
| 3 | /*!
|
|---|
| 4 | * Bootstrap v3.4.1 (https://getbootstrap.com/)
|
|---|
| 5 | * Copyright 2011-2019 Twitter, Inc.
|
|---|
| 6 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
|
|---|
| 7 | */
|
|---|
| 8 |
|
|---|
| 9 | //
|
|---|
| 10 | // Load core variables and mixins
|
|---|
| 11 | // --------------------------------------------------
|
|---|
| 12 |
|
|---|
| 13 | @import "variables.less";
|
|---|
| 14 | @import "mixins.less";
|
|---|
| 15 |
|
|---|
| 16 |
|
|---|
| 17 | //
|
|---|
| 18 | // Buttons
|
|---|
| 19 | // --------------------------------------------------
|
|---|
| 20 |
|
|---|
| 21 | // Common styles
|
|---|
| 22 | .btn-default,
|
|---|
| 23 | .btn-primary,
|
|---|
| 24 | .btn-success,
|
|---|
| 25 | .btn-info,
|
|---|
| 26 | .btn-warning,
|
|---|
| 27 | .btn-danger {
|
|---|
| 28 | text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);
|
|---|
| 29 | @shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
|
|---|
| 30 | .box-shadow(@shadow);
|
|---|
| 31 |
|
|---|
| 32 | // Reset the shadow
|
|---|
| 33 | &:active,
|
|---|
| 34 | &.active {
|
|---|
| 35 | .box-shadow(inset 0 3px 5px rgba(0, 0, 0, .125));
|
|---|
| 36 | }
|
|---|
| 37 |
|
|---|
| 38 | &.disabled,
|
|---|
| 39 | &[disabled],
|
|---|
| 40 | fieldset[disabled] & {
|
|---|
| 41 | .box-shadow(none);
|
|---|
| 42 | }
|
|---|
| 43 |
|
|---|
| 44 | .badge {
|
|---|
| 45 | text-shadow: none;
|
|---|
| 46 | }
|
|---|
| 47 | }
|
|---|
| 48 |
|
|---|
| 49 | // Mixin for generating new styles
|
|---|
| 50 | .btn-styles(@btn-color: #555) {
|
|---|
| 51 | #gradient > .vertical(@start-color: @btn-color; @end-color: darken(@btn-color, 12%));
|
|---|
| 52 | .reset-filter(); // Disable gradients for IE9 because filter bleeds through rounded corners; see https://github.com/twbs/bootstrap/issues/10620
|
|---|
| 53 | background-repeat: repeat-x;
|
|---|
| 54 | border-color: darken(@btn-color, 14%);
|
|---|
| 55 |
|
|---|
| 56 | &:hover,
|
|---|
| 57 | &:focus {
|
|---|
| 58 | background-color: darken(@btn-color, 12%);
|
|---|
| 59 | background-position: 0 -15px;
|
|---|
| 60 | }
|
|---|
| 61 |
|
|---|
| 62 | &:active,
|
|---|
| 63 | &.active {
|
|---|
| 64 | background-color: darken(@btn-color, 12%);
|
|---|
| 65 | border-color: darken(@btn-color, 14%);
|
|---|
| 66 | }
|
|---|
| 67 |
|
|---|
| 68 | &.disabled,
|
|---|
| 69 | &[disabled],
|
|---|
| 70 | fieldset[disabled] & {
|
|---|
| 71 | &,
|
|---|
| 72 | &:hover,
|
|---|
| 73 | &:focus,
|
|---|
| 74 | &.focus,
|
|---|
| 75 | &:active,
|
|---|
| 76 | &.active {
|
|---|
| 77 | background-color: darken(@btn-color, 12%);
|
|---|
| 78 | background-image: none;
|
|---|
| 79 | }
|
|---|
| 80 | }
|
|---|
| 81 | }
|
|---|
| 82 |
|
|---|
| 83 | // Common styles
|
|---|
| 84 | .btn {
|
|---|
| 85 | // Remove the gradient for the pressed/active state
|
|---|
| 86 | &:active,
|
|---|
| 87 | &.active {
|
|---|
| 88 | background-image: none;
|
|---|
| 89 | }
|
|---|
| 90 | }
|
|---|
| 91 |
|
|---|
| 92 | // Apply the mixin to the buttons
|
|---|
| 93 | .btn-default {
|
|---|
| 94 | .btn-styles(@btn-default-bg);
|
|---|
| 95 | text-shadow: 0 1px 0 #fff;
|
|---|
| 96 | border-color: #ccc;
|
|---|
| 97 | }
|
|---|
| 98 | .btn-primary { .btn-styles(@btn-primary-bg); }
|
|---|
| 99 | .btn-success { .btn-styles(@btn-success-bg); }
|
|---|
| 100 | .btn-info { .btn-styles(@btn-info-bg); }
|
|---|
| 101 | .btn-warning { .btn-styles(@btn-warning-bg); }
|
|---|
| 102 | .btn-danger { .btn-styles(@btn-danger-bg); }
|
|---|
| 103 |
|
|---|
| 104 |
|
|---|
| 105 | //
|
|---|
| 106 | // Images
|
|---|
| 107 | // --------------------------------------------------
|
|---|
| 108 |
|
|---|
| 109 | .thumbnail,
|
|---|
| 110 | .img-thumbnail {
|
|---|
| 111 | .box-shadow(0 1px 2px rgba(0, 0, 0, .075));
|
|---|
| 112 | }
|
|---|
| 113 |
|
|---|
| 114 |
|
|---|
| 115 | //
|
|---|
| 116 | // Dropdowns
|
|---|
| 117 | // --------------------------------------------------
|
|---|
| 118 |
|
|---|
| 119 | .dropdown-menu > li > a:hover,
|
|---|
| 120 | .dropdown-menu > li > a:focus {
|
|---|
| 121 | #gradient > .vertical(@start-color: @dropdown-link-hover-bg; @end-color: darken(@dropdown-link-hover-bg, 5%));
|
|---|
| 122 | background-color: darken(@dropdown-link-hover-bg, 5%);
|
|---|
| 123 | }
|
|---|
| 124 | .dropdown-menu > .active > a,
|
|---|
| 125 | .dropdown-menu > .active > a:hover,
|
|---|
| 126 | .dropdown-menu > .active > a:focus {
|
|---|
| 127 | #gradient > .vertical(@start-color: @dropdown-link-active-bg; @end-color: darken(@dropdown-link-active-bg, 5%));
|
|---|
| 128 | background-color: darken(@dropdown-link-active-bg, 5%);
|
|---|
| 129 | }
|
|---|
| 130 |
|
|---|
| 131 |
|
|---|
| 132 | //
|
|---|
| 133 | // Navbar
|
|---|
| 134 | // --------------------------------------------------
|
|---|
| 135 |
|
|---|
| 136 | // Default navbar
|
|---|
| 137 | .navbar-default {
|
|---|
| 138 | #gradient > .vertical(@start-color: lighten(@navbar-default-bg, 10%); @end-color: @navbar-default-bg);
|
|---|
| 139 | .reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered
|
|---|
| 140 | border-radius: @navbar-border-radius;
|
|---|
| 141 | @shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
|
|---|
| 142 | .box-shadow(@shadow);
|
|---|
| 143 |
|
|---|
| 144 | .navbar-nav > .open > a,
|
|---|
| 145 | .navbar-nav > .active > a {
|
|---|
| 146 | #gradient > .vertical(@start-color: darken(@navbar-default-link-active-bg, 5%); @end-color: darken(@navbar-default-link-active-bg, 2%));
|
|---|
| 147 | .box-shadow(inset 0 3px 9px rgba(0, 0, 0, .075));
|
|---|
| 148 | }
|
|---|
| 149 | }
|
|---|
| 150 | .navbar-brand,
|
|---|
| 151 | .navbar-nav > li > a {
|
|---|
| 152 | text-shadow: 0 1px 0 rgba(255, 255, 255, .25);
|
|---|
| 153 | }
|
|---|
| 154 |
|
|---|
| 155 | // Inverted navbar
|
|---|
| 156 | .navbar-inverse {
|
|---|
| 157 | #gradient > .vertical(@start-color: lighten(@navbar-inverse-bg, 10%); @end-color: @navbar-inverse-bg);
|
|---|
| 158 | .reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered; see https://github.com/twbs/bootstrap/issues/10257
|
|---|
| 159 | border-radius: @navbar-border-radius;
|
|---|
| 160 | .navbar-nav > .open > a,
|
|---|
| 161 | .navbar-nav > .active > a {
|
|---|
| 162 | #gradient > .vertical(@start-color: @navbar-inverse-link-active-bg; @end-color: lighten(@navbar-inverse-link-active-bg, 2.5%));
|
|---|
| 163 | .box-shadow(inset 0 3px 9px rgba(0, 0, 0, .25));
|
|---|
| 164 | }
|
|---|
| 165 |
|
|---|
| 166 | .navbar-brand,
|
|---|
| 167 | .navbar-nav > li > a {
|
|---|
| 168 | text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
|
|---|
| 169 | }
|
|---|
| 170 | }
|
|---|
| 171 |
|
|---|
| 172 | // Undo rounded corners in static and fixed navbars
|
|---|
| 173 | .navbar-static-top,
|
|---|
| 174 | .navbar-fixed-top,
|
|---|
| 175 | .navbar-fixed-bottom {
|
|---|
| 176 | border-radius: 0;
|
|---|
| 177 | }
|
|---|
| 178 |
|
|---|
| 179 | // Fix active state of dropdown items in collapsed mode
|
|---|
| 180 | @media (max-width: @grid-float-breakpoint-max) {
|
|---|
| 181 | .navbar .navbar-nav .open .dropdown-menu > .active > a {
|
|---|
| 182 | &,
|
|---|
| 183 | &:hover,
|
|---|
| 184 | &:focus {
|
|---|
| 185 | color: #fff;
|
|---|
| 186 | #gradient > .vertical(@start-color: @dropdown-link-active-bg; @end-color: darken(@dropdown-link-active-bg, 5%));
|
|---|
| 187 | }
|
|---|
| 188 | }
|
|---|
| 189 | }
|
|---|
| 190 |
|
|---|
| 191 |
|
|---|
| 192 | //
|
|---|
| 193 | // Alerts
|
|---|
| 194 | // --------------------------------------------------
|
|---|
| 195 |
|
|---|
| 196 | // Common styles
|
|---|
| 197 | .alert {
|
|---|
| 198 | text-shadow: 0 1px 0 rgba(255, 255, 255, .2);
|
|---|
| 199 | @shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05);
|
|---|
| 200 | .box-shadow(@shadow);
|
|---|
| 201 | }
|
|---|
| 202 |
|
|---|
| 203 | // Mixin for generating new styles
|
|---|
| 204 | .alert-styles(@color) {
|
|---|
| 205 | #gradient > .vertical(@start-color: @color; @end-color: darken(@color, 7.5%));
|
|---|
| 206 | border-color: darken(@color, 15%);
|
|---|
| 207 | }
|
|---|
| 208 |
|
|---|
| 209 | // Apply the mixin to the alerts
|
|---|
| 210 | .alert-success { .alert-styles(@alert-success-bg); }
|
|---|
| 211 | .alert-info { .alert-styles(@alert-info-bg); }
|
|---|
| 212 | .alert-warning { .alert-styles(@alert-warning-bg); }
|
|---|
| 213 | .alert-danger { .alert-styles(@alert-danger-bg); }
|
|---|
| 214 |
|
|---|
| 215 |
|
|---|
| 216 | //
|
|---|
| 217 | // Progress bars
|
|---|
| 218 | // --------------------------------------------------
|
|---|
| 219 |
|
|---|
| 220 | // Give the progress background some depth
|
|---|
| 221 | .progress {
|
|---|
| 222 | #gradient > .vertical(@start-color: darken(@progress-bg, 4%); @end-color: @progress-bg)
|
|---|
| 223 | }
|
|---|
| 224 |
|
|---|
| 225 | // Mixin for generating new styles
|
|---|
| 226 | .progress-bar-styles(@color) {
|
|---|
| 227 | #gradient > .vertical(@start-color: @color; @end-color: darken(@color, 10%));
|
|---|
| 228 | }
|
|---|
| 229 |
|
|---|
| 230 | // Apply the mixin to the progress bars
|
|---|
| 231 | .progress-bar { .progress-bar-styles(@progress-bar-bg); }
|
|---|
| 232 | .progress-bar-success { .progress-bar-styles(@progress-bar-success-bg); }
|
|---|
| 233 | .progress-bar-info { .progress-bar-styles(@progress-bar-info-bg); }
|
|---|
| 234 | .progress-bar-warning { .progress-bar-styles(@progress-bar-warning-bg); }
|
|---|
| 235 | .progress-bar-danger { .progress-bar-styles(@progress-bar-danger-bg); }
|
|---|
| 236 |
|
|---|
| 237 | // Reset the striped class because our mixins don't do multiple gradients and
|
|---|
| 238 | // the above custom styles override the new `.progress-bar-striped` in v3.2.0.
|
|---|
| 239 | .progress-bar-striped {
|
|---|
| 240 | #gradient > .striped();
|
|---|
| 241 | }
|
|---|
| 242 |
|
|---|
| 243 |
|
|---|
| 244 | //
|
|---|
| 245 | // List groups
|
|---|
| 246 | // --------------------------------------------------
|
|---|
| 247 |
|
|---|
| 248 | .list-group {
|
|---|
| 249 | border-radius: @border-radius-base;
|
|---|
| 250 | .box-shadow(0 1px 2px rgba(0, 0, 0, .075));
|
|---|
| 251 | }
|
|---|
| 252 | .list-group-item.active,
|
|---|
| 253 | .list-group-item.active:hover,
|
|---|
| 254 | .list-group-item.active:focus {
|
|---|
| 255 | text-shadow: 0 -1px 0 darken(@list-group-active-bg, 10%);
|
|---|
| 256 | #gradient > .vertical(@start-color: @list-group-active-bg; @end-color: darken(@list-group-active-bg, 7.5%));
|
|---|
| 257 | border-color: darken(@list-group-active-border, 7.5%);
|
|---|
| 258 |
|
|---|
| 259 | .badge {
|
|---|
| 260 | text-shadow: none;
|
|---|
| 261 | }
|
|---|
| 262 | }
|
|---|
| 263 |
|
|---|
| 264 |
|
|---|
| 265 | //
|
|---|
| 266 | // Panels
|
|---|
| 267 | // --------------------------------------------------
|
|---|
| 268 |
|
|---|
| 269 | // Common styles
|
|---|
| 270 | .panel {
|
|---|
| 271 | .box-shadow(0 1px 2px rgba(0, 0, 0, .05));
|
|---|
| 272 | }
|
|---|
| 273 |
|
|---|
| 274 | // Mixin for generating new styles
|
|---|
| 275 | .panel-heading-styles(@color) {
|
|---|
| 276 | #gradient > .vertical(@start-color: @color; @end-color: darken(@color, 5%));
|
|---|
| 277 | }
|
|---|
| 278 |
|
|---|
| 279 | // Apply the mixin to the panel headings only
|
|---|
| 280 | .panel-default > .panel-heading { .panel-heading-styles(@panel-default-heading-bg); }
|
|---|
| 281 | .panel-primary > .panel-heading { .panel-heading-styles(@panel-primary-heading-bg); }
|
|---|
| 282 | .panel-success > .panel-heading { .panel-heading-styles(@panel-success-heading-bg); }
|
|---|
| 283 | .panel-info > .panel-heading { .panel-heading-styles(@panel-info-heading-bg); }
|
|---|
| 284 | .panel-warning > .panel-heading { .panel-heading-styles(@panel-warning-heading-bg); }
|
|---|
| 285 | .panel-danger > .panel-heading { .panel-heading-styles(@panel-danger-heading-bg); }
|
|---|
| 286 |
|
|---|
| 287 |
|
|---|
| 288 | //
|
|---|
| 289 | // Wells
|
|---|
| 290 | // --------------------------------------------------
|
|---|
| 291 |
|
|---|
| 292 | .well {
|
|---|
| 293 | #gradient > .vertical(@start-color: darken(@well-bg, 5%); @end-color: @well-bg);
|
|---|
| 294 | border-color: darken(@well-bg, 10%);
|
|---|
| 295 | @shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1);
|
|---|
| 296 | .box-shadow(@shadow);
|
|---|
| 297 | }
|
|---|
