_variables.scss 26.8 KB
Newer Older
Mark Otto's avatar
Mark Otto committed
1
// Variables
2
//
3
4
5
6
// Copy settings from this file into the provided `_custom.scss` to override
// the Bootstrap defaults without modifying key, versioned files.


Chris Bell's avatar
Chris Bell committed
7
// Table of Contents
8
9
10
11
12
13
14
15
16
//
// Colors
// Options
// Spacing
// Body
// Links
// Grid breakpoints
// Grid containers
// Grid columns
Mark Otto's avatar
Mark Otto committed
17
18
// Fonts
// Components
Mark Otto's avatar
Mark Otto committed
19

20
21
22
23
24
25
26
27
28
29
30
31
@mixin _assert-ascending($map, $map-name) {
  $prev-key: null;
  $prev-num: null;
  @each $key, $num in $map {
    @if $prev-num != null and $prev-num >= $num {
      @warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !";
    }
    $prev-key: $key;
    $prev-num: $num;
  }
}

32
33
34
35
// General variable structure
//
// Variable format should follow the `$component-modifier-state-property` order.

Mark Otto's avatar
Mark Otto committed
36

37
// Colors
Mark Otto's avatar
Mark Otto committed
38
//
39
// Grayscale and brand colors for use across Bootstrap.
Mark Otto's avatar
Mark Otto committed
40

41
42
43
44
45
$gray-dark:                 #373a3c !default;
$gray:                      #55595c !default;
$gray-light:                #818a91 !default;
$gray-lighter:              #eceeef !default;
$gray-lightest:             #f7f7f9 !default;
Mark Otto's avatar
Mark Otto committed
46

47
48
49
50
51
$brand-primary:             #0275d8 !default;
$brand-success:             #5cb85c !default;
$brand-info:                #5bc0de !default;
$brand-warning:             #f0ad4e !default;
$brand-danger:              #d9534f !default;
Mark Otto's avatar
Mark Otto committed
52
53


54
// Options
Mark Otto's avatar
Mark Otto committed
55
//
56
57
58
59
60
61
62
63
// Quickly modify global styling by enabling or disabling optional features.

$enable-flex:               false !default;
$enable-rounded:            true !default;
$enable-shadows:            false !default;
$enable-gradients:          false !default;
$enable-transitions:        false !default;
$enable-hover-media-query:  false !default;
64
$enable-grid-classes:       true !default;
65
$enable-print-styles:       true !default;
66
67
68
69
70
71
72


// Spacing
//
// Control the default styling of most Bootstrap elements by modifying these
// variables. Mostly focused on spacing.

Mark Otto's avatar
spacing    
Mark Otto committed
73
74
75
$spacer:   1rem !default;
$spacer-x: $spacer !default;
$spacer-y: $spacer !default;
76
77
$spacers: (
  0: (
Mark Otto's avatar
spacing    
Mark Otto committed
78
79
    x: 0,
    y: 0
80
81
  ),
  1: (
Mark Otto's avatar
spacing    
Mark Otto committed
82
83
    x: $spacer-x,
    y: $spacer-y
84
85
  ),
  2: (
Mark Otto's avatar
spacing    
Mark Otto committed
86
87
    x: ($spacer-x * 1.5),
    y: ($spacer-y * 1.5)
88
89
  ),
  3: (
Mark Otto's avatar
spacing    
Mark Otto committed
90
91
    x: ($spacer-x * 3),
    y: ($spacer-y * 3)
92
93
  )
) !default;
Mark Otto's avatar
spacing    
Mark Otto committed
94
$border-width: 1px !default;
95
96
97
98
99


// Body
//
// Settings for the `<body>` element.
Mark Otto's avatar
Mark Otto committed
100

Mark Otto's avatar
Mark Otto committed
101
102
$body-bg:    #fff !default;
$body-color: $gray-dark !default;
103
104
105
106
107


// Links
//
// Style anchor elements.
Mark Otto's avatar
Mark Otto committed
108

Mark Otto's avatar
Mark Otto committed
109
110
111
112
$link-color:            $brand-primary !default;
$link-decoration:       none !default;
$link-hover-color:      darken($link-color, 15%) !default;
$link-hover-decoration: underline !default;
Mark Otto's avatar
Mark Otto committed
113
114


115
// Grid breakpoints
Mark Otto's avatar
Mark Otto committed
116
//
117
118
// Define the minimum and maximum dimensions at which your layout will change,
// adapting to different screen sizes, for use in media queries.
Mark Otto's avatar
Mark Otto committed
119

120
121
$grid-breakpoints: (
  xs: 0,
122
123
124
125
  sm: 544px,
  md: 768px,
  lg: 992px,
  xl: 1200px
126
) !default;
127
@include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
Mark Otto's avatar
Mark Otto committed
128

Mark Otto's avatar
Mark Otto committed
129

130
// Grid containers
Mark Otto's avatar
Mark Otto committed
131
//
132
// Define the maximum width of `.container` for different screen sizes.
Mark Otto's avatar
Mark Otto committed
133

134
$container-max-widths: (
135
136
137
138
  sm: 576px,
  md: 720px,
  lg: 940px,
  xl: 1140px
139
) !default;
140
@include _assert-ascending($container-max-widths, "$container-max-widths");
141
142
143
144
145
146


// Grid columns
//
// Set the number of columns and specify the width of the gutters.

Mark Otto's avatar
Mark Otto committed
147
$grid-columns:      12 !default;
148
$grid-gutter-width: 30px !default;
Mark Otto's avatar
Mark Otto committed
149

150

151
// Typography
Mark Otto's avatar
Mark Otto committed
152
//
153
// Font, line-height, and color for body text, headings, and more.
Mark Otto's avatar
Mark Otto committed
154

155
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif !default;
Mark Otto's avatar
Mark Otto committed
156
$font-family-serif:      Georgia, "Times New Roman", Times, serif !default;
157
$font-family-monospace:  Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
Mark Otto's avatar
Mark Otto committed
158
$font-family-base:       $font-family-sans-serif !default;
Mark Otto's avatar
Mark Otto committed
159

160
// Pixel value used to responsively scale all typography. Applied to the `<html>` element.
Mark Otto's avatar
Mark Otto committed
161
$font-size-root: 16px !default;
162

Mark Otto's avatar
Mark Otto committed
163
164
165
166
$font-size-base: 1rem !default;
$font-size-lg:   1.25rem !default;
$font-size-sm:   .875rem !default;
$font-size-xs:   .75rem !default;
167

Mark Otto's avatar
Mark Otto committed
168
169
$line-height-base: 1.5 !default;

Mark Otto's avatar
Mark Otto committed
170
171
172
173
174
175
$font-size-h1: 2.5rem !default;
$font-size-h2: 2rem !default;
$font-size-h3: 1.75rem !default;
$font-size-h4: 1.5rem !default;
$font-size-h5: 1.25rem !default;
$font-size-h6: 1rem !default;
Mark Otto's avatar
Mark Otto committed
176

Mark Otto's avatar
Mark Otto committed
177
178
179
180
$display1-size: 6rem !default;
$display2-size: 5.5rem !default;
$display3-size: 4.5rem !default;
$display4-size: 3.5rem !default;
181

Mark Otto's avatar
Mark Otto committed
182
183
184
185
$display1-weight: 300 !default;
$display2-weight: 300 !default;
$display3-weight: 300 !default;
$display4-weight: 300 !default;
186

Mark Otto's avatar
Mark Otto committed
187
188
189
190
191
$headings-margin-bottom: ($spacer / 2) !default;
$headings-font-family:   inherit !default;
$headings-font-weight:   500 !default;
$headings-line-height:   1.1 !default;
$headings-color:         inherit !default;
Mark Otto's avatar
Mark Otto committed
192

Mark Otto's avatar
Mark Otto committed
193
194
$lead-font-size:   1.25rem !default;
$lead-font-weight: 300 !default;
Mark Otto's avatar
Mark Otto committed
195

Mark Otto's avatar
Mark Otto committed
196
$text-muted: $gray-light !default;
Mark Otto's avatar
Mark Otto committed
197

Mark Otto's avatar
Mark Otto committed
198
$abbr-border-color: $gray-light !default;
Mark Otto's avatar
Mark Otto committed
199

Mark Otto's avatar
Mark Otto committed
200
201
202
$blockquote-small-color:  $gray-light !default;
$blockquote-font-size:    ($font-size-base * 1.25) !default;
$blockquote-border-color: $gray-lighter !default;
203
$blockquote-border-width: .25rem !default;
Mark Otto's avatar
Mark Otto committed
204

Mark Otto's avatar
Mark Otto committed
205
206
$hr-border-color: rgba(0,0,0,.1) !default;
$hr-border-width: $border-width !default;
207

Mark Otto's avatar
Mark Otto committed
208
$dt-font-weight: bold !default;
209

210
$kbd-box-shadow:         inset 0 -.1rem 0 rgba(0,0,0,.25) !default;
Mark Otto's avatar
Mark Otto committed
211
$nested-kbd-font-weight: bold !default;
212

Mark Otto's avatar
Mark Otto committed
213
$list-inline-padding: 5px !default;
214

Mark Otto's avatar
Mark Otto committed
215

216
// Components
Mark Otto's avatar
Mark Otto committed
217
//
Mark Otto's avatar
Mark Otto committed
218
// Define common padding and border radius sizes and more.
Mark Otto's avatar
Mark Otto committed
219

XhmikosR's avatar
XhmikosR committed
220
$line-height-lg:         (4 / 3) !default;
221
$line-height-sm:         1.5 !default;
Mark Otto's avatar
Mark Otto committed
222

223
$border-radius:          .25rem !default;
224
225
$border-radius-lg:       .3rem !default;
$border-radius-sm:       .2rem !default;
Mark Otto's avatar
Mark Otto committed
226

227
228
$component-active-color: #fff !default;
$component-active-bg:    $brand-primary !default;
Mark Otto's avatar
Mark Otto committed
229

230
$caret-width:            .3em !default;
231
$caret-width-lg:         $caret-width !default;
Mark Otto's avatar
Mark Otto committed
232
233


234
// Tables
Mark Otto's avatar
Mark Otto committed
235
//
236
// Customizes the `.table` component with basic values, each used across all table variations.
Mark Otto's avatar
Mark Otto committed
237

238
239
$table-cell-padding:            .75rem !default;
$table-sm-cell-padding:         .3rem !default;
Mark Otto's avatar
Mark Otto committed
240

241
242
243
244
$table-bg:                      transparent !default;
$table-bg-accent:               #f9f9f9 !default;
$table-bg-hover:                #f5f5f5 !default;
$table-bg-active:               $table-bg-hover !default;
Mark Otto's avatar
Mark Otto committed
245

246
$table-border-width:            $border-width !default;
247
$table-border-color:            $gray-lighter !default;
Mark Otto's avatar
Mark Otto committed
248
249


250
// Buttons
Mark Otto's avatar
Mark Otto committed
251
//
252
// For each of Bootstrap's buttons, define text, background and border color.
Mark Otto's avatar
Mark Otto committed
253

254
255
$btn-padding-x:                  1rem !default;
$btn-padding-y:                  .375rem !default;
256
$btn-font-weight:                normal !default;
257
$btn-box-shadow:                 inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075) !default;
258
$btn-active-box-shadow:          inset 0 3px 5px rgba(0,0,0,.125) !default;
Mark Otto's avatar
Mark Otto committed
259

260
261
$btn-primary-color:              #fff !default;
$btn-primary-bg:                 $brand-primary !default;
262
$btn-primary-border:             $btn-primary-bg !default;
Mark Otto's avatar
Mark Otto committed
263

264
265
$btn-secondary-color:            $gray-dark !default;
$btn-secondary-bg:               #fff !default;
266
$btn-secondary-border:           #ccc !default;
Mark Otto's avatar
Mark Otto committed
267

268
269
$btn-info-color:                 #fff !default;
$btn-info-bg:                    $brand-info !default;
270
$btn-info-border:                $btn-info-bg !default;
Mark Otto's avatar
Mark Otto committed
271

272
273
$btn-success-color:              #fff !default;
$btn-success-bg:                 $brand-success !default;
274
$btn-success-border:             $btn-success-bg !default;
Mark Otto's avatar
Mark Otto committed
275

276
277
$btn-warning-color:              #fff !default;
$btn-warning-bg:                 $brand-warning !default;
278
$btn-warning-border:             $btn-warning-bg !default;
Mark Otto's avatar
Mark Otto committed
279

280
281
$btn-danger-color:               #fff !default;
$btn-danger-bg:                  $brand-danger !default;
282
$btn-danger-border:              $btn-danger-bg !default;
Mark Otto's avatar
Mark Otto committed
283

284
$btn-link-disabled-color:        $gray-light !default;
Mark Otto's avatar
Mark Otto committed
285

286
$btn-padding-x-sm:               .75rem !default;
287
$btn-padding-y-sm:               .25rem !default;
288

289
$btn-padding-x-lg:               1.25rem !default;
290
291
$btn-padding-y-lg:               .75rem !default;

292
$btn-block-spacing-y:            5px !default;
293
294
295
296
$btn-toolbar-margin:             5px !default;

$split-btn-dropdown-toggle-padding-x:     8px !default;
$split-btn-lg-dropdown-toggle-padding-x: 12px !default;
297

Mark Otto's avatar
Mark Otto committed
298
// Allows for customizing button radius independently from global border radius
299
300
301
$btn-border-radius:              $border-radius !default;
$btn-border-radius-lg:           $border-radius-lg !default;
$btn-border-radius-sm:           $border-radius-sm !default;
Mark Otto's avatar
Mark Otto committed
302

Mark Otto's avatar
Mark Otto committed
303

304
// Forms
Mark Otto's avatar
Mark Otto committed
305

306
$input-padding-x:                .75rem !default;
307
$input-padding-y:                .375rem !default;
308

309
310
$input-bg:                       #fff !default;
$input-bg-disabled:              $gray-lighter !default;
Mark Otto's avatar
Mark Otto committed
311

312
$input-color:                    $gray !default;
313
$input-border-color:             #ccc !default;
314
$input-btn-border-width:         $border-width !default; // For form controls and buttons
Mark Otto's avatar
Mark Otto committed
315
$input-box-shadow:               inset 0 1px 1px rgba(0,0,0,.075) !default;
Mark Otto's avatar
Mark Otto committed
316

317
$input-border-radius:            $border-radius !default;
318
319
$input-border-radius-lg:         $border-radius-lg !default;
$input-border-radius-sm:         $border-radius-sm !default;
Mark Otto's avatar
Mark Otto committed
320

321
322
$input-border-focus:             #66afe9 !default;
$input-box-shadow-focus:         rgba(102,175,233,.6) !default;
Mark Otto's avatar
Mark Otto committed
323

324
$input-color-placeholder:        #999 !default;
Mark Otto's avatar
Mark Otto committed
325

326
327
328
$input-padding-x-sm:             .75rem !default;
$input-padding-y-sm:             .275rem !default;

329
$input-padding-x-lg:             1.25rem !default;
330
331
$input-padding-y-lg:             .75rem !default;

Mark Otto's avatar
Mark Otto committed
332
$input-height:                   (($font-size-base * $line-height-base) + ($input-padding-y * 2)) !default;
333
334
$input-height-lg:                (($font-size-lg * $line-height-lg) + ($input-padding-y-lg * 2)) !default;
$input-height-sm:                (($font-size-sm * $line-height-sm) + ($input-padding-y-sm * 2)) !default;
Mark Otto's avatar
Mark Otto committed
335

Mark Otto's avatar
Mark Otto committed
336
$form-group-margin-bottom:       $spacer-y !default;
Mark Otto's avatar
Mark Otto committed
337

338
$input-group-addon-bg:           $gray-lighter !default;
339
$input-group-addon-border-color: $input-border-color !default;
Mark Otto's avatar
Mark Otto committed
340

341
$cursor-disabled:                not-allowed !default;
Mark Otto's avatar
Mark Otto committed
342

343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
$custom-control-gutter:   1.5rem !default;
$custom-control-spacer-x: 1rem !default;
$custom-control-spacer-y: .25rem !default;

$custom-control-indicator-size:       1rem !default;
$custom-control-indicator-bg:         #ddd !default;
$custom-control-indicator-bg-size:    50% 50% !default;
$custom-control-indicator-box-shadow: inset 0 .25rem .25rem rgba(0,0,0,.1) !default;

$custom-control-disabled-cursor:             $cursor-disabled !default;
$custom-control-disabled-indicator-bg:       #eee !default;
$custom-control-disabled-description-color:  #767676 !default;

$custom-control-checked-indicator-color:      #fff !default;
$custom-control-checked-indicator-bg:         #0074d9 !default;
$custom-control-checked-indicator-box-shadow: none !default;

$custom-control-focus-indicator-box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9 !default;

$custom-control-active-indicator-color:      #fff !default;
$custom-control-active-indicator-bg:         #84c6ff !default;
$custom-control-active-indicator-box-shadow: none !default;

$custom-checkbox-radius: $border-radius !default;
367
$custom-checkbox-checked-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !default;
368
$custom-checkbox-indeterminate-bg: #0074d9 !default;
369
$custom-checkbox-indeterminate-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='%23fff' d='M0 2h4'/%3E%3C/svg%3E") !default;
370
371
372
$custom-checkbox-indeterminate-box-shadow: none !default;

$custom-radio-radius: 50% !default;
373
$custom-radio-checked-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fff'/%3E%3C/svg%3E") !default;
374
375
376
377
378
379
380

$custom-select-padding-x:          .75rem  !default;
$custom-select-padding-y:          .375rem !default;
$custom-select-indicator-padding:  1rem !default; // Extra padding to account for the presence of the background-image based indicator
$custom-select-color:         $input-color !default;
$custom-select-bg:            #fff !default;
$custom-select-bg-size:       8px 10px !default; // In pixels because image dimensions
381
$custom-select-indicator:     url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") !default;
382
383
384
385
386
$custom-select-border-width:  $input-btn-border-width !default;
$custom-select-border-color:  $input-border-color !default;
$custom-select-border-radius: $border-radius !default;

$custom-select-focus-border-color: #51a7e8 !default;
Mark Otto's avatar
linter    
Mark Otto committed
387
$custom-select-focus-box-shadow:   inset 0 1px 2px rgba(0, 0, 0, .075), 0 0 5px rgba(81, 167, 232, .5) !default;
388
389
390

$custom-select-sm-padding-y: .2rem !default;
$custom-select-sm-font-size: 75% !default;
391

392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
$custom-file-height:           2.5rem !default;
$custom-file-width:            14rem !default;
$custom-file-focus-box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9 !default;

$custom-file-padding-x:     .5rem !default;
$custom-file-padding-y:     1rem !default;
$custom-file-line-height:   1.5 !default;
$custom-file-color:         #555 !default;
$custom-file-bg:            #fff !default;
$custom-file-border-width:  $border-width !default;
$custom-file-border-color:  #ddd !default;
$custom-file-border-radius: $border-radius !default;
$custom-file-box-shadow:    inset 0 .2rem .4rem rgba(0,0,0,.05) !default;
$custom-file-placeholder:   "Choose file..." !default;
$custom-file-button-label:  "Browse" !default;
$custom-file-button-color:  $custom-file-color !default;
$custom-file-button-bg:     #eee !default;
409
410


411
// Form validation icons
412
413
414
$form-icon-success: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E") !default;
$form-icon-warning: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f0ad4e' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E") !default;
$form-icon-danger: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E") !default;
415

Mark Otto's avatar
Mark Otto committed
416

417
// Dropdowns
Mark Otto's avatar
Mark Otto committed
418
//
419
// Dropdown menu container and contents.
Mark Otto's avatar
Mark Otto committed
420

421
$dropdown-bg:                    #fff !default;
422
$dropdown-border-color:          rgba(0,0,0,.15) !default;
423
$dropdown-border-width:          $border-width !default;
424
$dropdown-divider-bg:            #e5e5e5 !default;
425
$dropdown-box-shadow:            0 6px 12px rgba(0,0,0,.175) !default;
Mark Otto's avatar
Mark Otto committed
426

427
428
429
$dropdown-link-color:            $gray-dark !default;
$dropdown-link-hover-color:      darken($gray-dark, 5%) !default;
$dropdown-link-hover-bg:         #f5f5f5 !default;
Mark Otto's avatar
Mark Otto committed
430

431
432
$dropdown-link-active-color:     $component-active-color !default;
$dropdown-link-active-bg:        $component-active-bg !default;
Mark Otto's avatar
Mark Otto committed
433

434
$dropdown-link-disabled-color:   $gray-light !default;
Mark Otto's avatar
Mark Otto committed
435

436
$dropdown-header-color:          $gray-light !default;
Mark Otto's avatar
Mark Otto committed
437
438


439
// Z-index master list
Mark Otto's avatar
Mark Otto committed
440
441
442
443
//
// Warning: Avoid customizing these values. They're used for a bird's eye view
// of components dependent on the z-axis and are designed to all work together.

444
$zindex-dropdown-backdrop:  990 !default;
445
446
447
448
449
$zindex-navbar:            1000 !default;
$zindex-dropdown:          1000 !default;
$zindex-popover:           1060 !default;
$zindex-tooltip:           1070 !default;
$zindex-navbar-fixed:      1030 !default;
Mark Otto's avatar
Mark Otto committed
450
$zindex-navbar-sticky:     1030 !default;
Mark Otto's avatar
Mark Otto committed
451
452
$zindex-modal-bg:          1040 !default;
$zindex-modal:             1050 !default;
Mark Otto's avatar
Mark Otto committed
453
454


455
// Navbar
Mark Otto's avatar
Mark Otto committed
456

457
$navbar-border-radius:              $border-radius !default;
458
459
$navbar-padding-x:                  $spacer !default;
$navbar-padding-y:                  ($spacer / 2) !default;
460

461
462
463
464
$navbar-dark-color:                 rgba(255,255,255,.5) !default;
$navbar-dark-hover-color:           rgba(255,255,255,.75) !default;
$navbar-dark-active-color:          rgba(255,255,255,1) !default;
$navbar-dark-disabled-color:        rgba(255,255,255,.25) !default;
465

466
467
468
469
$navbar-light-color:                rgba(0,0,0,.3) !default;
$navbar-light-hover-color:          rgba(0,0,0,.6) !default;
$navbar-light-active-color:         rgba(0,0,0,.8) !default;
$navbar-light-disabled-color:       rgba(0,0,0,.15) !default;
Mark Otto's avatar
Mark Otto committed
470
471


472
// Navs
Mark Otto's avatar
Mark Otto committed
473

Mark Otto's avatar
Mark Otto committed
474
475
476
477
478
479
480
481
482
483
484
485
$nav-item-margin:               .2rem !default;
$nav-item-inline-spacer:        1rem !default;
$nav-link-padding:              .5em 1em !default;
$nav-link-hover-bg:             $gray-lighter !default;
$nav-disabled-link-color:       $gray-light !default;
$nav-disabled-link-hover-color: $gray-light !default;
$nav-disabled-link-hover-bg:    transparent !default;

$nav-tabs-border-color:                       #ddd !default;
$nav-tabs-border-width:                       $border-width !default;
$nav-tabs-link-hover-border-color:            $gray-lighter !default;
$nav-tabs-active-link-hover-color:            $gray !default;
486
$nav-tabs-active-link-hover-bg:               $body-bg !default;
Mark Otto's avatar
Mark Otto committed
487
488
489
490
$nav-tabs-active-link-hover-border-color:     #ddd !default;
$nav-tabs-justified-link-border-color:        #ddd !default;
$nav-tabs-justified-active-link-border-color: $body-bg !default;

491
492
493
$nav-pills-border-radius:     $border-radius !default;
$nav-pills-active-link-color: $component-active-color !default;
$nav-pills-active-link-bg:    $component-active-bg !default;
Mark Otto's avatar
Mark Otto committed
494
495


496
// Pagination
Mark Otto's avatar
Mark Otto committed
497

498
499
500
501
502
503
504
505
$pagination-padding-x:                .75rem !default;
$pagination-padding-y:                .5rem !default;
$pagination-padding-x-sm:             .75rem !default;
$pagination-padding-y-sm:             .275rem !default;
$pagination-padding-x-lg:             1.5rem !default;
$pagination-padding-y-lg:             .75rem !default;


506
507
$pagination-color:                     $link-color !default;
$pagination-bg:                        #fff !default;
508
$pagination-border-width:              $border-width !default;
509
$pagination-border-color:              #ddd !default;
Mark Otto's avatar
Mark Otto committed
510

511
512
513
$pagination-hover-color:               $link-hover-color !default;
$pagination-hover-bg:                  $gray-lighter !default;
$pagination-hover-border:              #ddd !default;
Mark Otto's avatar
Mark Otto committed
514

515
516
517
$pagination-active-color:              #fff !default;
$pagination-active-bg:                 $brand-primary !default;
$pagination-active-border:             $brand-primary !default;
Mark Otto's avatar
Mark Otto committed
518

519
520
521
$pagination-disabled-color:            $gray-light !default;
$pagination-disabled-bg:               #fff !default;
$pagination-disabled-border:           #ddd !default;
Mark Otto's avatar
Mark Otto committed
522
523


524
// Jumbotron
Mark Otto's avatar
Mark Otto committed
525

526
527
$jumbotron-padding:              2rem !default;
$jumbotron-bg:                   $gray-lighter !default;
Mark Otto's avatar
Mark Otto committed
528
529


530
// Form states and alerts
Mark Otto's avatar
Mark Otto committed
531
//
532
// Define colors for form feedback states and, by default, alerts.
Mark Otto's avatar
Mark Otto committed
533

534
535
536
$state-success-text:             #3c763d !default;
$state-success-bg:               #dff0d8 !default;
$state-success-border:           darken($state-success-bg, 5%) !default;
Mark Otto's avatar
Mark Otto committed
537

538
539
540
$state-info-text:                #31708f !default;
$state-info-bg:                  #d9edf7 !default;
$state-info-border:              darken($state-info-bg, 7%) !default;
Mark Otto's avatar
Mark Otto committed
541

542
543
544
$state-warning-text:             #8a6d3b !default;
$state-warning-bg:               #fcf8e3 !default;
$state-warning-border:           darken($state-warning-bg, 5%) !default;
Mark Otto's avatar
Mark Otto committed
545

546
547
548
$state-danger-text:              #a94442 !default;
$state-danger-bg:                #f2dede !default;
$state-danger-border:            darken($state-danger-bg, 5%) !default;
Mark Otto's avatar
Mark Otto committed
549
550


551
// Cards
552
553
$card-spacer-x:            1.25rem !default;
$card-spacer-y:            .75rem !default;
554
$card-border-width:        1px !default;
555
$card-border-radius:       $border-radius !default;
556
$card-border-color:        rgba(0,0,0,.125) !default;
557
$card-border-radius-inner: $card-border-radius !default;
558
$card-cap-bg:              #f5f5f5 !default;
559
$card-bg:                  #fff !default;
560

561
562
$card-link-hover-color:    #fff !default;

563
564
$card-deck-margin:         .625rem !default;

565

566
// Tooltips
Mark Otto's avatar
Mark Otto committed
567

568
569
570
571
$tooltip-max-width:           200px !default;
$tooltip-color:               #fff !default;
$tooltip-bg:                  #000 !default;
$tooltip-opacity:             .9 !default;
572
573
574
$tooltip-padding-y:           3px !default;
$tooltip-padding-x:           8px !default;
$tooltip-margin:              3px !default;
Mark Otto's avatar
Mark Otto committed
575

576
577
$tooltip-arrow-width:         5px !default;
$tooltip-arrow-color:         $tooltip-bg !default;
Mark Otto's avatar
Mark Otto committed
578
579


580
// Popovers
Mark Otto's avatar
Mark Otto committed
581

582
583
$popover-bg:                          #fff !default;
$popover-max-width:                   276px !default;
584
$popover-border-width:                $border-width !default;
585
$popover-border-color:                rgba(0,0,0,.2) !default;
586
$popover-box-shadow:                  0 5px 10px rgba(0,0,0,.2) !default;
Mark Otto's avatar
Mark Otto committed
587

588
$popover-title-bg:                    darken($popover-bg, 3%) !default;
589
590
591
592
593
$popover-title-padding-x:             14px !default;
$popover-title-padding-y:             8px !default;

$popover-content-padding-x:           14px !default;
$popover-content-padding-y:           9px !default;
Mark Otto's avatar
Mark Otto committed
594

595
596
$popover-arrow-width:                 10px !default;
$popover-arrow-color:                 $popover-bg !default;
Mark Otto's avatar
Mark Otto committed
597

598
$popover-arrow-outer-width:           ($popover-arrow-width + 1px) !default;
Mark Otto's avatar
linter    
Mark Otto committed
599
$popover-arrow-outer-color:           fade-in($popover-border-color, .05) !default;
Mark Otto's avatar
Mark Otto committed
600
601


602
// Labels
Mark Otto's avatar
Mark Otto committed
603

604
605
606
607
608
609
$label-default-bg:            $gray-light !default;
$label-primary-bg:            $brand-primary !default;
$label-success-bg:            $brand-success !default;
$label-info-bg:               $brand-info !default;
$label-warning-bg:            $brand-warning !default;
$label-danger-bg:             $brand-danger !default;
Mark Otto's avatar
Mark Otto committed
610

611
612
$label-color:                 #fff !default;
$label-link-hover-color:      #fff !default;
613
$label-font-weight:           bold !default;
Mark Otto's avatar
Mark Otto committed
614
615


616
// Modals
Mark Otto's avatar
Mark Otto committed
617

618
// Padding applied to the modal body
619
$modal-inner-padding:         15px !default;
Mark Otto's avatar
Mark Otto committed
620

621
$modal-title-padding:         15px !default;
Mark Otto's avatar
Mark Otto committed
622
$modal-title-line-height:     $line-height-base !default;
Mark Otto's avatar
Mark Otto committed
623

624
625
626
627
$modal-content-bg:               #fff !default;
$modal-content-border-color:     rgba(0,0,0,.2) !default;
$modal-content-xs-box-shadow:    0 3px 9px rgba(0,0,0,.5) !default;
$modal-content-sm-up-box-shadow: 0 5px 15px rgba(0,0,0,.5) !default;
Mark Otto's avatar
Mark Otto committed
628

629
630
631
632
$modal-backdrop-bg:           #000 !default;
$modal-backdrop-opacity:      .5 !default;
$modal-header-border-color:   #e5e5e5 !default;
$modal-footer-border-color:   $modal-header-border-color !default;
Mark Otto's avatar
Mark Otto committed
633

634
635
636
$modal-lg:                    900px !default;
$modal-md:                    600px !default;
$modal-sm:                    300px !default;
Mark Otto's avatar
Mark Otto committed
637
638


639
// Alerts
Mark Otto's avatar
Mark Otto committed
640
//
641
// Define alert colors, border radius, and padding.
Mark Otto's avatar
Mark Otto committed
642

643
$alert-padding:               15px !default;
644
$alert-border-radius:         $border-radius !default;
645
$alert-link-font-weight:      bold !default;
646
$alert-border-width:          $border-width !default;
Mark Otto's avatar
Mark Otto committed
647

648
649
650
$alert-success-bg:            $state-success-bg !default;
$alert-success-text:          $state-success-text !default;
$alert-success-border:        $state-success-border !default;
Mark Otto's avatar
Mark Otto committed
651

652
653
654
$alert-info-bg:               $state-info-bg !default;
$alert-info-text:             $state-info-text !default;
$alert-info-border:           $state-info-border !default;
Mark Otto's avatar
Mark Otto committed
655

656
657
658
$alert-warning-bg:            $state-warning-bg !default;
$alert-warning-text:          $state-warning-text !default;
$alert-warning-border:        $state-warning-border !default;
Mark Otto's avatar
Mark Otto committed
659

660
661
662
$alert-danger-bg:             $state-danger-bg !default;
$alert-danger-text:           $state-danger-text !default;
$alert-danger-border:         $state-danger-border !default;
Mark Otto's avatar
Mark Otto committed
663
664


665
// Progress bars
Mark Otto's avatar
Mark Otto committed
666

667
$progress-bg:                 #eee !default;
668
$progress-bar-color:          #0074d9 !default;
669
$progress-border-radius:      $border-radius !default;
670
$progress-box-shadow:         inset 0 .1rem .1rem rgba(0,0,0,.1) !default;
Mark Otto's avatar
Mark Otto committed
671

672
673
674
675
676
$progress-bar-bg:             $brand-primary !default;
$progress-bar-success-bg:     $brand-success !default;
$progress-bar-warning-bg:     $brand-warning !default;
$progress-bar-danger-bg:      $brand-danger !default;
$progress-bar-info-bg:        $brand-info !default;
Mark Otto's avatar
Mark Otto committed
677
678


679
// List group
Mark Otto's avatar
Mark Otto committed
680

681
$list-group-bg:                 #fff !default;
682
$list-group-border-color:       #ddd !default;
683
$list-group-border-width:       $border-width !default;
684
$list-group-border-radius:      $border-radius !default;
Mark Otto's avatar
Mark Otto committed
685

686
687
688
689
690
$list-group-hover-bg:           #f5f5f5 !default;
$list-group-active-color:       $component-active-color !default;
$list-group-active-bg:          $component-active-bg !default;
$list-group-active-border:      $list-group-active-bg !default;
$list-group-active-text-color:  lighten($list-group-active-bg, 40%) !default;
Mark Otto's avatar
Mark Otto committed
691

692
693
694
$list-group-disabled-color:      $gray-light !default;
$list-group-disabled-bg:         $gray-lighter !default;
$list-group-disabled-text-color: $list-group-disabled-color !default;
Mark Otto's avatar
Mark Otto committed
695

696
697
698
$list-group-link-color:         #555 !default;
$list-group-link-hover-color:   $list-group-link-color !default;
$list-group-link-heading-color: #333 !default;
Mark Otto's avatar
Mark Otto committed
699
700


Mark Otto's avatar
Mark Otto committed
701
// Image thumbnails
Mark Otto's avatar
Mark Otto committed
702

703
704
$thumbnail-padding:           .25rem !default;
$thumbnail-bg:                $body-bg !default;
705
$thumbnail-border-width:      $border-width !default;
706
$thumbnail-border-color:      #ddd !default;
707
$thumbnail-border-radius:     $border-radius !default;
708
$thumbnail-box-shadow:        0 1px 2px rgba(0,0,0,.075) !default;
Mark Otto's avatar
Mark Otto committed
709
710


711
// Breadcrumbs
Mark Otto's avatar
Mark Otto committed
712

713
714
715
$breadcrumb-padding-y:          .75rem !default;
$breadcrumb-padding-x:          1rem !default;
$breadcrumb-item-padding:       .5rem !default;
Mark Otto's avatar
Mark Otto committed
716

717
718
719
720
$breadcrumb-bg:                 $gray-lighter !default;
$breadcrumb-divider-color:      $gray-light !default;
$breadcrumb-active-color:       $gray-light !default;
$breadcrumb-divider:            "/" !default;
Mark Otto's avatar
Mark Otto committed
721
722


723
724
725
726
727
728
729
// Media objects

$media-margin-top:            15px !default;
$media-heading-margin-bottom:  5px !default;
$media-alignment-padding-x:   10px !default;


730
// Carousel
Mark Otto's avatar
Mark Otto committed
731

732
$carousel-text-shadow:                        0 1px 2px rgba(0,0,0,.6) !default;
Mark Otto's avatar
Mark Otto committed
733

734
735
736
737
$carousel-control-color:                      #fff !default;
$carousel-control-width:                      15% !default;
$carousel-control-opacity:                    .5 !default;
$carousel-control-font-size:                  20px !default;
Mark Otto's avatar
Mark Otto committed
738

739
740
$carousel-indicator-active-bg:                #fff !default;
$carousel-indicator-border-color:             #fff !default;
Mark Otto's avatar
Mark Otto committed
741

742
$carousel-caption-color:                      #fff !default;
Mark Otto's avatar
Mark Otto committed
743
744


745
// Close
Mark Otto's avatar
Mark Otto committed
746

747
748
749
$close-font-weight:           bold !default;
$close-color:                 #000 !default;
$close-text-shadow:           0 1px 0 #fff !default;
Mark Otto's avatar
Mark Otto committed
750
751


752
// Code
Mark Otto's avatar
Mark Otto committed
753

Mark Otto's avatar
Mark Otto committed
754
$code-color:                  #bd4147 !default;
755
$code-bg:                     #f7f7f9 !default;
Mark Otto's avatar
Mark Otto committed
756

757
758
$kbd-color:                   #fff !default;
$kbd-bg:                      #333 !default;
Mark Otto's avatar
Mark Otto committed
759

760
761
762
763
$pre-bg:                      #f7f7f9 !default;
$pre-color:                   $gray-dark !default;
$pre-border-color:            #ccc !default;
$pre-scrollable-max-height:   340px !default;