_variables.scss (32829B)
1 $bootstrap-sass-asset-helper: false !default; 2 // 3 // Variables 4 // -------------------------------------------------- 5 6 7 //== Colors 8 // 9 //## Gray and brand colors for use across Bootstrap. 10 11 $gray-base: #000 !default; 12 $gray-darker: lighten($gray-base, 13.5%) !default; // #222 13 $gray-dark: lighten($gray-base, 20%) !default; // #333 14 $gray: lighten($gray-base, 33.5%) !default; // #555 15 $gray-light: lighten($gray-base, 46.7%) !default; // #777 16 $gray-lighter: lighten($gray-base, 93.5%) !default; // #eee 17 18 $brand-primary: #1e91cf !default; // #337ab7 19 $brand-success: #4cb64c !default; 20 $brand-info: #54b7d3 !default; 21 $brand-warning: #f3a638 !default; 22 $brand-danger: #e3503e !default; 23 24 25 //== Scaffolding 26 // 27 //## Settings for some of the most global styles. 28 29 //** Background color for `<body>`. 30 $body-bg: #fff !default; 31 //** Global text color on `<body>`. 32 $text-color: $gray-dark !default; 33 34 //** Global textual link color. 35 $link-color: $brand-primary !default; 36 //** Link hover color set via `darken()` function. 37 $link-hover-color: darken($link-color, 15%) !default; 38 //** Link hover decoration. 39 $link-hover-decoration: underline !default; 40 41 42 //== Typography 43 // 44 //## Font, line-height, and color for body text, headings, and more. 45 46 $font-family-sans-serif: "Helvetica Neue", Helvetica, Arial, sans-serif !default; 47 $font-family-serif: Georgia, "Times New Roman", Times, serif !default; 48 //** Default monospace fonts for `<code>`, `<kbd>`, and `<pre>`. 49 $font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace !default; 50 $font-family-base: $font-family-sans-serif !default; 51 52 $font-size-base: 13px !default; 53 $font-size-large: ceil(($font-size-base * 1.25)) !default; // ~18px 54 $font-size-small: ceil(($font-size-base * 0.85)) !default; // ~12px 55 56 $font-size-h1: floor(($font-size-base * 2.6)) !default; // ~36px 57 $font-size-h2: floor(($font-size-base * 2.15)) !default; // ~30px 58 $font-size-h3: ceil(($font-size-base * 1.7)) !default; // ~24px 59 $font-size-h4: ceil(($font-size-base * 1.25)) !default; // ~18px 60 $font-size-h5: $font-size-base !default; 61 $font-size-h6: ceil(($font-size-base * 0.85)) !default; // ~12px 62 63 //** Unit-less `line-height` for use in components like buttons. 64 $line-height-base: 1.428571429 !default; // 20/14 65 //** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc. 66 $line-height-computed: floor(($font-size-base * $line-height-base)) !default; // ~20px 67 68 //** By default, this inherits from the `<body>`. 69 $headings-font-family: inherit !default; 70 $headings-font-weight: 500 !default; 71 $headings-line-height: 1.1 !default; 72 $headings-color: inherit !default; 73 74 75 //== Iconography 76 // 77 //## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower. 78 79 //** Load fonts from this directory. 80 81 // [converter] If $bootstrap-sass-asset-helper if used, provide path relative to the assets load path. 82 // [converter] This is because some asset helpers, such as Sprockets, do not work with file-relative paths. 83 $icon-font-path: if($bootstrap-sass-asset-helper, "bootstrap/", "../fonts/bootstrap/") !default; 84 85 //** File name for all font files. 86 $icon-font-name: "glyphicons-halflings-regular" !default; 87 //** Element ID within SVG icon file. 88 $icon-font-svg-id: "glyphicons_halflingsregular" !default; 89 90 91 //== Components 92 // 93 //## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start). 94 95 $padding-base-vertical: 8px !default; 96 $padding-base-horizontal: 13px !default; 97 98 $padding-large-vertical: 9px !default; 99 $padding-large-horizontal: 18px !default; 100 101 $padding-small-vertical: 4px !default; 102 $padding-small-horizontal: 9px !default; 103 104 $padding-xs-vertical: 1px !default; 105 $padding-xs-horizontal: 5px !default; 106 107 $line-height-large: 1.3333333 !default; // extra decimals for Win 8.1 Chrome 108 $line-height-small: 1.5 !default; 109 110 $border-radius-base: 3px !default; 111 $border-radius-large: 5px !default; 112 $border-radius-small: 2px !default; 113 114 //** Global color for active items (e.g., navs or dropdowns). 115 $component-active-color: #fff !default; 116 //** Global background color for active items (e.g., navs or dropdowns). 117 $component-active-bg: $brand-primary !default; 118 119 //** Width of the `border` for generating carets that indicator dropdowns. 120 $caret-width-base: 4px !default; 121 //** Carets increase slightly in size for larger components. 122 $caret-width-large: 5px !default; 123 124 125 //== Tables 126 // 127 //## Customizes the `.table` component with basic values, each used across all table variations. 128 129 //** Padding for `<th>`s and `<td>`s. 130 $table-cell-padding: 8px !default; 131 //** Padding for cells in `.table-condensed`. 132 $table-condensed-cell-padding: 5px !default; 133 134 //** Default background color used for all tables. 135 $table-bg: transparent !default; 136 //** Background color used for `.table-striped`. 137 $table-bg-accent: #f9f9f9 !default; 138 //** Background color used for `.table-hover`. 139 $table-bg-hover: #f5f5f5 !default; 140 $table-bg-active: $table-bg-hover !default; 141 142 //** Border color for table and cell borders. 143 $table-border-color: #ddd !default; 144 145 146 //== Buttons 147 // 148 //## For each of Bootstrap's buttons, define text, background and border color. 149 150 $btn-font-weight: normal !default; 151 152 $btn-default-color: #666 !default; 153 $btn-default-bg: #fff !default; 154 $btn-default-border: #ddd !default; 155 156 $btn-primary-color: #fff !default; 157 $btn-primary-bg: $brand-primary !default; 158 $btn-primary-border: darken($btn-primary-bg, 7%) !default; 159 160 $btn-success-color: #fff !default; 161 $btn-success-bg: $brand-success !default; 162 $btn-success-border: darken($btn-success-bg, 7%) !default; 163 164 $btn-info-color: #fff !default; 165 $btn-info-bg: $brand-info !default; 166 $btn-info-border: darken($btn-info-bg, 7%) !default; 167 //$btn-info-border: $btn-info-bg !default; 168 169 $btn-warning-color: #fff !default; 170 $btn-warning-bg: $brand-warning !default; 171 $btn-warning-border: darken($brand-warning, 7%) !default; 172 173 $btn-danger-color: #fff !default; 174 $btn-danger-bg: $brand-danger !default; 175 $btn-danger-border: darken($btn-danger-bg, 7%) !default; 176 177 178 $btn-link-disabled-color: $gray-light !default; 179 180 // Allows for customizing button radius independently from global border radius 181 $btn-border-radius-base: $border-radius-base !default; 182 $btn-border-radius-large: $border-radius-large !default; 183 $btn-border-radius-small: $border-radius-small !default; 184 185 186 //== Forms 187 // 188 //## 189 190 //** `<input>` background color 191 $input-bg: #fff !default; 192 //** `<input disabled>` background color 193 $input-bg-disabled: $gray-lighter !default; 194 195 //** Text color for `<input>`s 196 $input-color: $gray !default; 197 //** `<input>` border color 198 $input-border: #ccc !default; 199 200 // TODO: Rename `$input-border-radius` to `$input-border-radius-base` in v4 201 //** Default `.form-control` border radius 202 // This has no effect on `<select>`s in some browsers, due to the limited stylability of `<select>`s in CSS. 203 $input-border-radius: $border-radius-base !default; 204 //** Large `.form-control` border radius 205 $input-border-radius-large: $border-radius-large !default; 206 //** Small `.form-control` border radius 207 $input-border-radius-small: $border-radius-small !default; 208 209 //** Border color for inputs on focus 210 $input-border-focus: #66afe9 !default; 211 212 //** Placeholder text color 213 $input-color-placeholder: #999 !default; 214 215 //** Default `.form-control` height 216 $input-height-base: ($line-height-computed + ($padding-base-vertical * 2) + 2) !default; 217 //** Large `.form-control` height 218 $input-height-large: (ceil($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default; 219 //** Small `.form-control` height 220 $input-height-small: (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default; 221 222 //** `.form-group` margin 223 $form-group-margin-bottom: 15px !default; 224 225 $legend-color: $gray-dark !default; 226 $legend-border-color: #e5e5e5 !default; 227 228 //** Background color for textual input addons 229 $input-group-addon-bg: $gray-lighter !default; 230 //** Border color for textual input addons 231 $input-group-addon-border-color: $input-border !default; 232 233 //** Disabled cursor for form controls and buttons. 234 $cursor-disabled: not-allowed !default; 235 236 237 //== Dropdowns 238 // 239 //## Dropdown menu container and contents. 240 241 //** Background for the dropdown menu. 242 $dropdown-bg: #fff !default; 243 //** Dropdown menu `border-color`. 244 $dropdown-border: rgba(0,0,0,.15) !default; 245 //** Dropdown menu `border-color` **for IE8**. 246 $dropdown-fallback-border: #ccc !default; 247 //** Divider color for between dropdown items. 248 $dropdown-divider-bg: #e5e5e5 !default; 249 250 //** Dropdown link text color. 251 $dropdown-link-color: $gray-dark !default; 252 //** Hover color for dropdown links. 253 $dropdown-link-hover-color: darken($gray-dark, 5%) !default; 254 //** Hover background for dropdown links. 255 $dropdown-link-hover-bg: #f5f5f5 !default; 256 257 //** Active dropdown menu item text color. 258 $dropdown-link-active-color: $component-active-color !default; 259 //** Active dropdown menu item background color. 260 $dropdown-link-active-bg: $component-active-bg !default; 261 262 //** Disabled dropdown menu item background color. 263 $dropdown-link-disabled-color: $gray-light !default; 264 265 //** Text color for headers within dropdown menus. 266 $dropdown-header-color: $gray-light !default; 267 268 //** Deprecated `$dropdown-caret-color` as of v3.1.0 269 $dropdown-caret-color: #000 !default; 270 271 272 //-- Z-index master list 273 // 274 // Warning: Avoid customizing these values. They're used for a bird's eye view 275 // of components dependent on the z-axis and are designed to all work together. 276 // 277 // Note: These variables are not generated into the Customizer. 278 279 $zindex-navbar: 1000 !default; 280 $zindex-dropdown: 1000 !default; 281 $zindex-popover: 1060 !default; 282 $zindex-tooltip: 1070 !default; 283 $zindex-navbar-fixed: 1030 !default; 284 $zindex-modal-background: 1040 !default; 285 $zindex-modal: 1050 !default; 286 287 288 //== Media queries breakpoints 289 // 290 //## Define the breakpoints at which your layout will change, adapting to different screen sizes. 291 292 // Extra small screen / phone 293 //** Deprecated `$screen-xs` as of v3.0.1 294 $screen-xs: 480px !default; 295 //** Deprecated `$screen-xs-min` as of v3.2.0 296 $screen-xs-min: $screen-xs !default; 297 //** Deprecated `$screen-phone` as of v3.0.1 298 $screen-phone: $screen-xs-min !default; 299 300 // Small screen / tablet 301 //** Deprecated `$screen-sm` as of v3.0.1 302 $screen-sm: 768px !default; 303 $screen-sm-min: $screen-sm !default; 304 //** Deprecated `$screen-tablet` as of v3.0.1 305 $screen-tablet: $screen-sm-min !default; 306 307 // Medium screen / desktop 308 //** Deprecated `$screen-md` as of v3.0.1 309 $screen-md: 992px !default; 310 $screen-md-min: $screen-md !default; 311 //** Deprecated `$screen-desktop` as of v3.0.1 312 $screen-desktop: $screen-md-min !default; 313 314 // Large screen / wide desktop 315 //** Deprecated `$screen-lg` as of v3.0.1 316 $screen-lg: 1200px !default; 317 $screen-lg-min: $screen-lg !default; 318 //** Deprecated `$screen-lg-desktop` as of v3.0.1 319 $screen-lg-desktop: $screen-lg-min !default; 320 321 // So media queries don't overlap when required, provide a maximum 322 $screen-xs-max: ($screen-sm-min - 1) !default; 323 $screen-sm-max: ($screen-md-min - 1) !default; 324 $screen-md-max: ($screen-lg-min - 1) !default; 325 326 327 //== Grid system 328 // 329 //## Define your custom responsive grid. 330 331 //** Number of columns in the grid. 332 $grid-columns: 12 !default; 333 //** Padding between columns. Gets divided in half for the left and right. 334 $grid-gutter-width: 30px !default; 335 // Navbar collapse 336 //** Point at which the navbar becomes uncollapsed. 337 $grid-float-breakpoint: $screen-sm-min !default; 338 //** Point at which the navbar begins collapsing. 339 $grid-float-breakpoint-max: ($grid-float-breakpoint - 1) !default; 340 341 342 //== Container sizes 343 // 344 //## Define the maximum width of `.container` for different screen sizes. 345 346 // Small screen / tablet 347 $container-tablet: (720px + $grid-gutter-width) !default; 348 //** For `$screen-sm-min` and up. 349 $container-sm: $container-tablet !default; 350 351 // Medium screen / desktop 352 $container-desktop: (940px + $grid-gutter-width) !default; 353 //** For `$screen-md-min` and up. 354 $container-md: $container-desktop !default; 355 356 // Large screen / wide desktop 357 $container-large-desktop: (1140px + $grid-gutter-width) !default; 358 //** For `$screen-lg-min` and up. 359 $container-lg: $container-large-desktop !default; 360 361 362 //== Navbar 363 // 364 //## 365 366 // Basics of a navbar 367 $navbar-height: 60px !default; 368 $navbar-margin-bottom: $line-height-computed !default; 369 $navbar-border-radius: $border-radius-base !default; 370 $navbar-padding-horizontal: floor(($grid-gutter-width / 2)) !default; 371 //$navbar-padding-vertical: (($navbar-height - $line-height-computed) / 2) !default; 372 $navbar-padding-vertical: 14px !default; 373 $navbar-collapse-max-height: 340px !default; 374 375 $navbar-default-color: #777 !default; 376 $navbar-default-bg: #f8f8f8 !default; 377 $navbar-default-border: darken($navbar-default-bg, 6.5%) !default; 378 379 // Navbar links 380 $navbar-default-link-color: #777 !default; 381 $navbar-default-link-hover-color: #333 !default; 382 $navbar-default-link-hover-bg: transparent !default; 383 $navbar-default-link-active-color: #555 !default; 384 $navbar-default-link-active-bg: darken($navbar-default-bg, 6.5%) !default; 385 $navbar-default-link-disabled-color: #ccc !default; 386 $navbar-default-link-disabled-bg: transparent !default; 387 388 // Navbar brand label 389 $navbar-default-brand-color: $navbar-default-link-color !default; 390 $navbar-default-brand-hover-color: darken($navbar-default-brand-color, 10%) !default; 391 $navbar-default-brand-hover-bg: transparent !default; 392 393 // Navbar toggle 394 $navbar-default-toggle-hover-bg: #ddd !default; 395 $navbar-default-toggle-icon-bar-bg: #888 !default; 396 $navbar-default-toggle-border-color: #ddd !default; 397 398 399 //=== Inverted navbar 400 // Reset inverted navbar basics 401 $navbar-inverse-color: lighten($gray-light, 15%) !default; 402 $navbar-inverse-bg: #222 !default; 403 $navbar-inverse-border: darken($navbar-inverse-bg, 10%) !default; 404 405 // Inverted navbar links 406 $navbar-inverse-link-color: lighten($gray-light, 15%) !default; 407 $navbar-inverse-link-hover-color: #fff !default; 408 $navbar-inverse-link-hover-bg: transparent !default; 409 $navbar-inverse-link-active-color: $navbar-inverse-link-hover-color !default; 410 $navbar-inverse-link-active-bg: darken($navbar-inverse-bg, 10%) !default; 411 $navbar-inverse-link-disabled-color: #444 !default; 412 $navbar-inverse-link-disabled-bg: transparent !default; 413 414 // Inverted navbar brand label 415 $navbar-inverse-brand-color: $navbar-inverse-link-color !default; 416 $navbar-inverse-brand-hover-color: #fff !default; 417 $navbar-inverse-brand-hover-bg: transparent !default; 418 419 // Inverted navbar toggle 420 $navbar-inverse-toggle-hover-bg: #333 !default; 421 $navbar-inverse-toggle-icon-bar-bg: #fff !default; 422 $navbar-inverse-toggle-border-color: #333 !default; 423 424 425 //== Navs 426 // 427 //## 428 429 //=== Shared nav styles 430 $nav-link-padding: 10px 15px !default; 431 $nav-link-hover-bg: $gray-lighter !default; 432 433 $nav-disabled-link-color: $gray-light !default; 434 $nav-disabled-link-hover-color: $gray-light !default; 435 436 //== Tabs 437 $nav-tabs-border-color: #ddd !default; 438 439 $nav-tabs-link-hover-border-color: $gray-lighter !default; 440 441 $nav-tabs-active-link-hover-bg: $body-bg !default; 442 $nav-tabs-active-link-hover-color: $gray !default; 443 $nav-tabs-active-link-hover-border-color: #ddd !default; 444 445 $nav-tabs-justified-link-border-color: #ddd !default; 446 $nav-tabs-justified-active-link-border-color: $body-bg !default; 447 448 //== Pills 449 $nav-pills-border-radius: $border-radius-base !default; 450 $nav-pills-active-link-hover-bg: $component-active-bg !default; 451 $nav-pills-active-link-hover-color: $component-active-color !default; 452 453 454 //== Pagination 455 // 456 //## 457 458 $pagination-color: $link-color !default; 459 $pagination-bg: #fff !default; 460 $pagination-border: #ddd !default; 461 462 $pagination-hover-color: $link-hover-color !default; 463 $pagination-hover-bg: $gray-lighter !default; 464 $pagination-hover-border: #ddd !default; 465 466 $pagination-active-color: #fff !default; 467 $pagination-active-bg: $brand-primary !default; 468 $pagination-active-border: $brand-primary !default; 469 470 $pagination-disabled-color: $gray-light !default; 471 $pagination-disabled-bg: #fff !default; 472 $pagination-disabled-border: #ddd !default; 473 474 475 //== Pager 476 // 477 //## 478 479 $pager-bg: $pagination-bg !default; 480 $pager-border: $pagination-border !default; 481 $pager-border-radius: 15px !default; 482 483 $pager-hover-bg: $pagination-hover-bg !default; 484 485 $pager-active-bg: $pagination-active-bg !default; 486 $pager-active-color: $pagination-active-color !default; 487 488 $pager-disabled-color: $pagination-disabled-color !default; 489 490 491 //== Jumbotron 492 // 493 //## 494 495 $jumbotron-padding: 30px !default; 496 $jumbotron-color: inherit !default; 497 $jumbotron-bg: $gray-lighter !default; 498 $jumbotron-heading-color: inherit !default; 499 $jumbotron-font-size: ceil(($font-size-base * 1.5)) !default; 500 $jumbotron-heading-font-size: ceil(($font-size-base * 4.5)) !default; 501 502 503 //== Form states and alerts 504 // 505 //## Define colors for form feedback states and, by default, alerts. 506 507 $state-success-text: $brand-success !default; 508 $state-success-bg: lighten($brand-success, 35%) !default; 509 $state-success-border: lighten($brand-success, 30%) !default; 510 // $state-success-text: #3c763d !default; 511 // $state-success-bg: #dff0d8 !default; 512 // $state-success-border: #d6e9c6 !default; 513 514 $state-info-text: #31708f !default; 515 $state-info-bg: #d9edf7 !default; 516 $state-info-border: darken(adjust-hue($state-info-bg, -10), 7%) !default; 517 518 $state-warning-text: $brand-warning !default; 519 $state-warning-bg: lighten($brand-warning, 30%) !default; 520 $state-warning-border: lighten($brand-warning, 22%) !default; 521 // $state-warning-text: #8a6d3b !default; 522 // $state-warning-bg: #fcf8e3 !default; 523 // $state-warning-border: #faebcc !default; 524 525 $state-danger-text: $brand-danger !default; 526 $state-danger-bg: lighten($brand-danger, 28%) !default; 527 $state-danger-border: lighten($brand-danger, 25%) !default; 528 // $state-danger-text: #a94442 !default; 529 // $state-danger-bg: #f2dede !default; 530 // $state-danger-border: #ebccd1 !default; 531 532 //== Tooltips 533 // 534 //## 535 536 //** Tooltip max width 537 $tooltip-max-width: 200px !default; 538 //** Tooltip text color 539 $tooltip-color: #fff !default; 540 //** Tooltip background color 541 $tooltip-bg: #000 !default; 542 $tooltip-opacity: .9 !default; 543 544 //** Tooltip arrow width 545 $tooltip-arrow-width: 5px !default; 546 //** Tooltip arrow color 547 $tooltip-arrow-color: $tooltip-bg !default; 548 549 550 //== Popovers 551 // 552 //## 553 554 //** Popover body background color 555 $popover-bg: #fff !default; 556 //** Popover maximum width 557 $popover-max-width: 276px !default; 558 //** Popover border color 559 $popover-border-color: rgba(0,0,0,.2) !default; 560 //** Popover fallback border color 561 $popover-fallback-border-color: #ccc !default; 562 563 //** Popover title background color 564 $popover-title-bg: darken($popover-bg, 3%) !default; 565 566 //** Popover arrow width 567 $popover-arrow-width: 10px !default; 568 //** Popover arrow color 569 $popover-arrow-color: $popover-bg !default; 570 571 //** Popover outer arrow width 572 $popover-arrow-outer-width: ($popover-arrow-width + 1) !default; 573 //** Popover outer arrow color 574 $popover-arrow-outer-color: fade_in($popover-border-color, 0.05) !default; 575 //** Popover outer arrow fallback color 576 $popover-arrow-outer-fallback-color: darken($popover-fallback-border-color, 20%) !default; 577 578 579 //== Labels 580 // 581 //## 582 583 //** Default label background color 584 $label-default-bg: $gray-light !default; 585 //** Primary label background color 586 $label-primary-bg: $brand-primary !default; 587 //** Success label background color 588 $label-success-bg: $brand-success !default; 589 //** Info label background color 590 $label-info-bg: $brand-info !default; 591 //** Warning label background color 592 $label-warning-bg: $brand-warning !default; 593 //** Danger label background color 594 $label-danger-bg: $brand-danger !default; 595 596 //** Default label text color 597 $label-color: #fff !default; 598 //** Default text color of a linked label 599 $label-link-hover-color: #fff !default; 600 601 602 //== Modals 603 // 604 //## 605 606 //** Padding applied to the modal body 607 $modal-inner-padding: 15px !default; 608 609 //** Padding applied to the modal title 610 $modal-title-padding: 15px !default; 611 //** Modal title line-height 612 $modal-title-line-height: $line-height-base !default; 613 614 //** Background color of modal content area 615 $modal-content-bg: #fff !default; 616 //** Modal content border color 617 $modal-content-border-color: rgba(0,0,0,.2) !default; 618 //** Modal content border color **for IE8** 619 $modal-content-fallback-border-color: #999 !default; 620 621 //** Modal backdrop background color 622 $modal-backdrop-bg: #000 !default; 623 //** Modal backdrop opacity 624 $modal-backdrop-opacity: .5 !default; 625 //** Modal header border color 626 $modal-header-border-color: #e5e5e5 !default; 627 //** Modal footer border color 628 $modal-footer-border-color: $modal-header-border-color !default; 629 630 $modal-lg: 900px !default; 631 $modal-md: 600px !default; 632 $modal-sm: 300px !default; 633 634 635 //== Alerts 636 // 637 //## Define alert colors, border radius, and padding. 638 639 $alert-padding: 10px !default; 640 $alert-border-radius: $border-radius-base !default; 641 $alert-link-font-weight: bold !default; 642 643 $alert-success-bg: $state-success-bg !default; 644 $alert-success-text: darken($state-success-text, 12%) !default; 645 $alert-success-border: $state-success-border !default; 646 647 $alert-info-bg: $state-info-bg !default; 648 $alert-info-text: darken($state-info-text, 12%) !default; 649 $alert-info-border: $state-info-border !default; 650 651 $alert-warning-bg: $state-warning-bg !default; 652 $alert-warning-text: darken($state-warning-text, 12%) !default; 653 $alert-warning-border: $state-warning-border !default; 654 655 $alert-danger-bg: $state-danger-bg !default; 656 $alert-danger-text: darken($state-danger-text, 12%) !default; 657 $alert-danger-border: $state-danger-border !default; 658 659 660 //== Progress bars 661 // 662 //## 663 664 //** Background color of the whole progress component 665 $progress-bg: #f5f5f5 !default; 666 //** Progress bar text color 667 $progress-bar-color: #fff !default; 668 //** Variable for setting rounded corners on progress bar. 669 $progress-border-radius: $border-radius-base !default; 670 671 //** Default progress bar color 672 $progress-bar-bg: $brand-primary !default; 673 //** Success progress bar color 674 $progress-bar-success-bg: $brand-success !default; 675 //** Warning progress bar color 676 $progress-bar-warning-bg: $brand-warning !default; 677 //** Danger progress bar color 678 $progress-bar-danger-bg: $brand-danger !default; 679 //** Info progress bar color 680 $progress-bar-info-bg: $brand-info !default; 681 682 683 //== List group 684 // 685 //## 686 687 //** Background color on `.list-group-item` 688 $list-group-bg: #fff !default; 689 //** `.list-group-item` border color 690 $list-group-border: #ddd !default; 691 //** List group border radius 692 $list-group-border-radius: $border-radius-base !default; 693 694 //** Background color of single list items on hover 695 $list-group-hover-bg: #f5f5f5 !default; 696 //** Text color of active list items 697 $list-group-active-color: $component-active-color !default; 698 //** Background color of active list items 699 $list-group-active-bg: $component-active-bg !default; 700 //** Border color of active list elements 701 $list-group-active-border: $list-group-active-bg !default; 702 //** Text color for content within active list items 703 $list-group-active-text-color: lighten($list-group-active-bg, 40%) !default; 704 705 //** Text color of disabled list items 706 $list-group-disabled-color: $gray-light !default; 707 //** Background color of disabled list items 708 $list-group-disabled-bg: $gray-lighter !default; 709 //** Text color for content within disabled list items 710 $list-group-disabled-text-color: $list-group-disabled-color !default; 711 712 $list-group-link-color: #555 !default; 713 $list-group-link-hover-color: $list-group-link-color !default; 714 $list-group-link-heading-color: #333 !default; 715 716 717 //== Panels 718 // 719 //## 720 721 $panel-bg: #fff !default; 722 $panel-body-padding: 15px !default; 723 $panel-heading-padding: 12px 15px !default; 724 $panel-footer-padding: $panel-heading-padding !default; 725 $panel-border-radius: $border-radius-base !default; 726 727 //** Border color for elements within panels 728 $panel-inner-border: #ddd !default; 729 $panel-footer-bg: #f5f5f5 !default; 730 731 $panel-default-text: $gray-dark !default; 732 $panel-default-border: #ddd !default; 733 $panel-default-heading-bg: #fafafa !default; 734 735 $panel-primary-text: #fff !default; 736 $panel-primary-border: $brand-primary !default; 737 $panel-primary-heading-bg: $brand-primary !default; 738 739 $panel-success-text: $state-success-text !default; 740 $panel-success-border: $state-success-border !default; 741 $panel-success-heading-bg: $state-success-bg !default; 742 743 $panel-info-text: $state-info-text !default; 744 $panel-info-border: $state-info-border !default; 745 $panel-info-heading-bg: $state-info-bg !default; 746 747 $panel-warning-text: $state-warning-text !default; 748 $panel-warning-border: $state-warning-border !default; 749 $panel-warning-heading-bg: $state-warning-bg !default; 750 751 $panel-danger-text: $state-danger-text !default; 752 $panel-danger-border: $state-danger-border !default; 753 $panel-danger-heading-bg: $state-danger-bg !default; 754 755 756 //== Thumbnails 757 // 758 //## 759 760 //** Padding around the thumbnail image 761 $thumbnail-padding: 4px !default; 762 //** Thumbnail background color 763 $thumbnail-bg: $body-bg !default; 764 //** Thumbnail border color 765 $thumbnail-border: #ddd !default; 766 //** Thumbnail border radius 767 $thumbnail-border-radius: $border-radius-base !default; 768 769 //** Custom text color for thumbnail captions 770 $thumbnail-caption-color: $text-color !default; 771 //** Padding around the thumbnail caption 772 $thumbnail-caption-padding: 9px !default; 773 774 775 //== Wells 776 // 777 //## 778 779 $well-bg: #f5f5f5 !default; 780 $well-border: darken($well-bg, 7%) !default; 781 782 783 //== Badges 784 // 785 //## 786 787 $badge-color: #fff !default; 788 //** Linked badge text color on hover 789 $badge-link-hover-color: #fff !default; 790 $badge-bg: $gray-light !default; 791 792 //** Badge text color in active nav link 793 $badge-active-color: $link-color !default; 794 //** Badge background color in active nav link 795 $badge-active-bg: #fff !default; 796 797 $badge-font-weight: bold !default; 798 $badge-line-height: 1 !default; 799 $badge-border-radius: 10px !default; 800 801 802 //== Breadcrumbs 803 // 804 //## 805 806 $breadcrumb-padding-vertical: 8px !default; 807 $breadcrumb-padding-horizontal: 15px !default; 808 //** Breadcrumb background color 809 $breadcrumb-bg: #f5f5f5 !default; 810 //** Breadcrumb text color 811 $breadcrumb-color: #ccc !default; 812 //** Text color of current page in the breadcrumb 813 $breadcrumb-active-color: $gray-light !default; 814 //** Textual separator for between breadcrumb elements 815 $breadcrumb-separator: "/" !default; 816 817 818 //== Carousel 819 // 820 //## 821 822 $carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6) !default; 823 824 $carousel-control-color: #fff !default; 825 $carousel-control-width: 15% !default; 826 $carousel-control-opacity: .5 !default; 827 $carousel-control-font-size: 20px !default; 828 829 $carousel-indicator-active-bg: #fff !default; 830 $carousel-indicator-border-color: #fff !default; 831 832 $carousel-caption-color: #fff !default; 833 834 835 //== Close 836 // 837 //## 838 839 $close-font-weight: bold !default; 840 $close-color: #000 !default; 841 $close-text-shadow: 0 1px 0 #fff !default; 842 843 844 //== Code 845 // 846 //## 847 848 $code-color: #c7254e !default; 849 $code-bg: #f9f2f4 !default; 850 851 $kbd-color: #fff !default; 852 $kbd-bg: #333 !default; 853 854 $pre-bg: #f5f5f5 !default; 855 $pre-color: $gray-dark !default; 856 $pre-border-color: #ccc !default; 857 $pre-scrollable-max-height: 340px !default; 858 859 860 //== Type 861 // 862 //## 863 864 //** Horizontal offset for forms and lists. 865 $component-offset-horizontal: 180px !default; 866 //** Text muted color 867 $text-muted: $gray-light !default; 868 //** Abbreviations and acronyms border color 869 $abbr-border-color: $gray-light !default; 870 //** Headings small color 871 $headings-small-color: $gray-light !default; 872 //** Blockquote small color 873 $blockquote-small-color: $gray-light !default; 874 //** Blockquote font size 875 $blockquote-font-size: ($font-size-base * 1.25) !default; 876 //** Blockquote border color 877 $blockquote-border-color: $gray-lighter !default; 878 //** Page header border color 879 $page-header-border-color: $gray-lighter !default; 880 //** Width of horizontal description list titles 881 $dl-horizontal-offset: $component-offset-horizontal !default; 882 //** Point at which .dl-horizontal becomes horizontal 883 $dl-horizontal-breakpoint: $grid-float-breakpoint !default; 884 //** Horizontal line color. 885 $hr-border: $gray-lighter !default;