resources/scss/bootstrap/_variables.scss

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