_variables.scss 26.9 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
$btn-padding-x:                  1rem !default;
255
256
$btn-padding-y:                  .5rem !default;
$btn-line-height:                1.25 !default;
257
$btn-font-weight:                normal !default;
258
$btn-box-shadow:                 inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075) !default;
259
$btn-active-box-shadow:          inset 0 3px 5px rgba(0,0,0,.125) !default;
Mark Otto's avatar
Mark Otto committed
260

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

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

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

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

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

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

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

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

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

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

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

Mark Otto's avatar
Mark Otto committed
299
// Allows for customizing button radius independently from global border radius
300
301
302
$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
303

Mark Otto's avatar
Mark Otto committed
304

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

307
$input-padding-x:                .75rem !default;
308
309
$input-padding-y:                .5rem !default;
$input-line-height:              1.25 !default;
310

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

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

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

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

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

328
329
$input-padding-x-sm:             .5rem !default;
$input-padding-y-sm:             .25rem !default;
330

331
$input-padding-x-lg:             1.5rem !default;
332
333
$input-padding-y-lg:             .75rem !default;

Mark Otto's avatar
Mark Otto committed
334
$input-height:                   (($font-size-base * $line-height-base) + ($input-padding-y * 2)) !default;
335
336
$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
337

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

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

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

345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
$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;
369
$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;
370
$custom-checkbox-indeterminate-bg: #0074d9 !default;
371
$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;
372
373
374
$custom-checkbox-indeterminate-box-shadow: none !default;

$custom-radio-radius: 50% !default;
375
$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;
376
377
378
379
380
381
382

$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
383
$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;
384
385
386
387
388
$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
389
$custom-select-focus-box-shadow:   inset 0 1px 2px rgba(0, 0, 0, .075), 0 0 5px rgba(81, 167, 232, .5) !default;
390
391
392

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

394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
$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;
411
412


413
// Form validation icons
414
415
416
$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;
417

Mark Otto's avatar
Mark Otto committed
418

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

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

429
430
431
$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
432

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

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

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


441
// Z-index master list
Mark Otto's avatar
Mark Otto committed
442
443
444
445
//
// 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.

446
$zindex-dropdown-backdrop:  990 !default;
447
448
449
450
451
$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
452
$zindex-navbar-sticky:     1030 !default;
Mark Otto's avatar
Mark Otto committed
453
454
$zindex-modal-bg:          1040 !default;
$zindex-modal:             1050 !default;
Mark Otto's avatar
Mark Otto committed
455
456


457
// Navbar
Mark Otto's avatar
Mark Otto committed
458

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

463
464
465
466
$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;
467

468
469
470
471
$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
472
473


474
// Navs
Mark Otto's avatar
Mark Otto committed
475

Mark Otto's avatar
Mark Otto committed
476
477
478
479
480
481
482
483
484
485
486
487
$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;
488
$nav-tabs-active-link-hover-bg:               $body-bg !default;
Mark Otto's avatar
Mark Otto committed
489
490
491
492
$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;

493
494
495
$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
496
497


498
// Pagination
Mark Otto's avatar
Mark Otto committed
499

500
501
502
503
504
505
506
507
$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;


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

513
514
515
$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
516

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

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


526
// Jumbotron
Mark Otto's avatar
Mark Otto committed
527

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


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

536
537
538
$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
539

540
541
542
$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
543

544
545
546
$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
547

548
549
550
$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
551
552


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

563
564
$card-link-hover-color:    #fff !default;

565
566
$card-deck-margin:         .625rem !default;

567

568
// Tooltips
Mark Otto's avatar
Mark Otto committed
569

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

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


582
// Popovers
Mark Otto's avatar
Mark Otto committed
583

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

590
$popover-title-bg:                    darken($popover-bg, 3%) !default;
591
592
593
594
595
$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
596

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

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


604
// Labels
Mark Otto's avatar
Mark Otto committed
605

606
607
608
609
610
611
$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
612

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


618
// Modals
Mark Otto's avatar
Mark Otto committed
619

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

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

626
627
628
629
$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
630

631
632
633
634
$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
635

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


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

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

650
651
652
$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
653

654
655
656
$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
657

658
659
660
$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
661

662
663
664
$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
665
666


667
// Progress bars
Mark Otto's avatar
Mark Otto committed
668

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

674
675
676
677
678
$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
679
680


681
// List group
Mark Otto's avatar
Mark Otto committed
682

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

688
689
690
691
692
$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
693

694
695
696
$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
697

698
699
700
$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
701
702


Mark Otto's avatar
Mark Otto committed
703
// Image thumbnails
Mark Otto's avatar
Mark Otto committed
704

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


713
// Breadcrumbs
Mark Otto's avatar
Mark Otto committed
714

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

719
720
721
722
$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
723
724


725
726
727
728
729
730
731
// Media objects

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


732
// Carousel
Mark Otto's avatar
Mark Otto committed
733

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

736
737
738
739
$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
740

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

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


747
// Close
Mark Otto's avatar
Mark Otto committed
748

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


754
// Code
Mark Otto's avatar
Mark Otto committed
755

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

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

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