Skip to content
GitLab
Switch branch/tag
Find file Normal viewHistoryPermalink
_variables.scss 29.7 KB
Newer Older
Mark Otto's avatar
convert to scss  
Mark Otto committed
1 
// Variables
Mark Otto's avatar
remove all customizer comments from variables file    
Mark Otto committed
2 
//
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
3
4 
// Copy settings from this file into the provided `_custom.scss` to override
// the Bootstrap defaults without modifying key, versioned files.
Mark Otto's avatar
Mention variable naming scheme to help with #22414    
Mark Otto committed
5 
//
Mark Otto's avatar
Update _variables.scss    
Mark Otto committed
6 
// Variables should follow the `$component-state-property-size` formula for
Mark Otto's avatar
Mention variable naming scheme to help with #22414    
Mark Otto committed
7 
// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
8
Chris Bell's avatar
Update _variables.scss    
Chris Bell committed
9 
// Table of Contents
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
10 
//
Mark Otto's avatar
update comment    
Mark Otto committed
11 
// Color system
Mark Otto's avatar
rip numbers    
Mark Otto committed
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26 
// Options
// Spacing
// Body
// Links
// Grid breakpoints
// Grid containers
// Grid columns
// Fonts
// Components
// Tables
// Buttons
// Forms
// Dropdowns
// Z-index master list
// Navs
Pierre-Denis Vanduynslager's avatar
Harmonize navbar-brand, navbar-text and nav-link height    
Pierre-Denis Vanduynslager committed
27 
// Navbar
Mark Otto's avatar
rip numbers    
Mark Otto committed
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44 
// Pagination
// Jumbotron
// Form states and alerts
// Cards
// Tooltips
// Popovers
// Badges
// Modals
// Alerts
// Progress bars
// List group
// Image thumbnails
// Figures
// Breadcrumbs
// Carousel
// Close
// Code
Mark Otto's avatar
convert to scss  
Mark Otto committed
45
Mark Otto's avatar
update comment    
Mark Otto committed
46
47
48
49 

//
// Color system
//
Mark Otto's avatar
add new color vars and maps    
Mark Otto committed
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75 

$white:  #fff !default;
$gray-100: #f8f9fa !default;
$gray-200: #e9ecef !default;
$gray-300: #dee2e6 !default;
$gray-400: #ced4da !default;
$gray-500: #adb5bd !default;
$gray-600: #868e96 !default;
$gray-700: #495057 !default;
$gray-800: #343a40 !default;
$gray-900: #212529 !default;
$black:  #000 !default;

$grays: (
  100: $gray-100,
  200: $gray-200,
  300: $gray-300,
  400: $gray-400,
  500: $gray-500,
  600: $gray-600,
  700: $gray-700,
  800: $gray-800,
  900: $gray-900
) !default;

$blue:    #007bff !default;
Mark Otto's avatar
update theme colors    
Mark Otto committed
76
77
78
79
80
81
82
83
84 
$indigo:  #6610f2 !default;
$purple:  #6f42c1 !default;
$pink:    #e83e8c !default;
$red:     #dc3545 !default;
$orange:  #fd7e14 !default;
$yellow:  #ffc107 !default;
$green:   #28a745 !default;
$teal:    #20c997 !default;
$cyan:    #17a2b8 !default;
Mark Otto's avatar
add new color vars and maps    
Mark Otto committed
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103 

$colors: (
  blue: $blue,
  indigo: $indigo,
  purple: $purple,
  pink: $pink,
  red: $red,
  orange: $orange,
  yellow: $yellow,
  green: $green,
  teal: $teal,
  cyan: $cyan,
  white: $white,
  gray: $gray-600,
  gray-dark: $gray-800
) !default;

$theme-colors: (
  primary: $blue,
Mark Otto's avatar
update theme colors    
Mark Otto committed
104 
  secondary: $gray-600,
Mark Otto's avatar
add new color vars and maps    
Mark Otto committed
105
106 
  success: $green,
  info: $cyan,
Mark Otto's avatar
update theme colors    
Mark Otto committed
107 
  warning: $yellow,
Mark Otto's avatar
add new color vars and maps    
Mark Otto committed
108 
  danger: $red,
Mark Otto's avatar
update theme colors    
Mark Otto committed
109
110 
  light: $gray-100,
  dark: $gray-800
Mark Otto's avatar
add new color vars and maps    
Mark Otto committed
111
112 
) !default;
Mark Otto's avatar
add theme-color-level function and interval so we can generate shades of colors    
Mark Otto committed
113
114 
// Set a specific jump point for requesting color jumps
$theme-color-interval: 8% !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
115
116
Mark Otto's avatar
rip numbers    
Mark Otto committed
117 
// Options
Mark Otto's avatar
convert to scss  
Mark Otto committed
118 
//
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
119
120
121
122
123 
// Quickly modify global styling by enabling or disabling optional features.

$enable-rounded:            true !default;
$enable-shadows:            false !default;
$enable-gradients:          false !default;
Mark Otto's avatar
re-enable transitions (which according to the options.md doc is the default)    
Mark Otto committed
124 
$enable-transitions:        true !default;
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
125 
$enable-hover-media-query:  false !default;
Mark Otto's avatar
Make predefined grid classes conditional    
Mark Otto committed
126 
$enable-grid-classes:       true !default;
Chris Rebert's avatar
Add $enable-print-styles variable for _print.scss; fixes #19101    
Chris Rebert committed
127 
$enable-print-styles:       true !default;
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
128
129
Mark Otto's avatar
rip numbers    
Mark Otto committed
130 
// Spacing
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
131
132
133 
//
// Control the default styling of most Bootstrap elements by modifying these
// variables. Mostly focused on spacing.
Tobias's avatar
Document the possibility of extending the $spacers map    
Tobias committed
134 
// You can add more entries to the $spacers map, should you need more variation.
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
135
Mark Otto's avatar
Update spacer utilities (#22123)    
Mark Otto committed
136 
$spacer: 1rem !default;
Chris Rebert's avatar
Refactor _utilities-spacing.scss; fixes #18129    
Chris Rebert committed
137 
$spacers: (
Starsam80's avatar
Clean up spacers a bit more    
Starsam80 committed
138
139
140
141
142
143 
  0: 0,
  1: ($spacer * .25),
  2: ($spacer * .5),
  3: $spacer,
  4: ($spacer * 1.5),
  5: ($spacer * 3)
Chris Rebert's avatar
Refactor _utilities-spacing.scss; fixes #18129    
Chris Rebert committed
144 
) !default;
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
145
Mark Otto's avatar
Revert "Drop width from sizing utils given .col- classes can do the same thing...    
Mark Otto committed
146 
// This variable affects the `.h-*` and `.w-*` classes.
Starsam80's avatar
Use variables for the width/height classes    
Starsam80 committed
147
148
149
150
151
152 
$sizes: (
  25: 25%,
  50: 50%,
  75: 75%,
  100: 100%
) !default;
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
153
Mark Otto's avatar
rip numbers    
Mark Otto committed
154 
// Body
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
155
156 
//
// Settings for the `<body>` element.
Mark Otto's avatar
convert to scss  
Mark Otto committed
157
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
158 
$body-bg:       $white !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
159 
$body-color:    $gray-900 !default;
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
160
Mark Otto's avatar
rip numbers    
Mark Otto committed
161 
// Links
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
162
163 
//
// Style anchor elements.
Mark Otto's avatar
convert to scss  
Mark Otto committed
164
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
165 
$link-color:            theme-color("primary") !default;
Mark Otto's avatar
more variables spacing    
Mark Otto committed
166
167
168 
$link-decoration:       none !default;
$link-hover-color:      darken($link-color, 15%) !default;
$link-hover-decoration: underline !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
169
170
Mark Otto's avatar
rip numbers    
Mark Otto committed
171 
// Grid breakpoints
Mark Otto's avatar
convert to scss  
Mark Otto committed
172 
//
Chris Rebert's avatar
Change comment to clarify that $grid-breakpoints are minimum widths for each breakpoint    
Chris Rebert committed
173 
// Define the minimum dimensions at which your layout will change,
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
174 
// adapting to different screen sizes, for use in media queries.
Mark Otto's avatar
convert to scss  
Mark Otto committed
175
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
176
177 
$grid-breakpoints: (
  xs: 0,
Mark Otto's avatar
Change sm grid breakpoint and container max-width    
Mark Otto committed
178 
  sm: 576px,
Gleb Mazovetskiy's avatar
Change grid and container sizes to px    
Gleb Mazovetskiy committed
179
180
181 
  md: 768px,
  lg: 992px,
  xl: 1200px
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
182 
) !default;
Chris Rebert's avatar
Assert that $grid-breakpoints and $container-max-widths are in ascending order; fixes #18549    
Chris Rebert committed
183 
@include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
alberto's avatar
@warn if minimum width of smallest breakpoint != 0    
alberto committed
184 
@include _assert-starts-at-zero($grid-breakpoints);
Mark Otto's avatar
convert to scss  
Mark Otto committed
185
Mark Otto's avatar
clean up vars file a smidge    
Mark Otto committed
186
Mark Otto's avatar
rip numbers    
Mark Otto committed
187 
// Grid containers
Mark Otto's avatar
clean up vars file a smidge    
Mark Otto committed
188 
//
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
189 
// Define the maximum width of `.container` for different screen sizes.
Mark Otto's avatar
clean up vars file a smidge    
Mark Otto committed
190
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
191 
$container-max-widths: (
Mark Otto's avatar
Change sm grid breakpoint and container max-width    
Mark Otto committed
192 
  sm: 540px,
Gleb Mazovetskiy's avatar
Change grid and container sizes to px    
Gleb Mazovetskiy committed
193 
  md: 720px,
Mark Otto's avatar
Change 940px breakpoint to 960px so that all widths are divisible by 12    
Mark Otto committed
194 
  lg: 960px,
Gleb Mazovetskiy's avatar
Change grid and container sizes to px    
Gleb Mazovetskiy committed
195 
  xl: 1140px
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
196 
) !default;
Chris Rebert's avatar
Assert that $grid-breakpoints and $container-max-widths are in ascending order; fixes #18549    
Chris Rebert committed
197 
@include _assert-ascending($container-max-widths, "$container-max-widths");
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
198
199
Mark Otto's avatar
rip numbers    
Mark Otto committed
200 
// Grid columns
Mark Otto's avatar
reorder variables, rename -color to -color    
Mark Otto committed
201
202
203 
//
// Set the number of columns and specify the width of the gutters.
Mark Otto's avatar
remove grid gutter sass map as it's output css was all jacked up    
Mark Otto committed
204
205 
$grid-columns: 12 !default;
$grid-gutter-width: 30px !default;
Mark Otto's avatar
Update spacer utilities (#22123)    
Mark Otto committed
206
207
208
209
210 

// Components
//
// Define common padding and border radius sizes and more.
Mark Otto's avatar
Revamp button and input vars while fixing #21587 (#22287)    
Mark Otto committed
211 
$line-height-lg:         1.5 !default;
Mark Otto's avatar
Update spacer utilities (#22123)    
Mark Otto committed
212
213
214 
$line-height-sm:         1.5 !default;

$border-width: 1px !default;
envolute's avatar
Add "$border-color" variable    
envolute committed
215 
$border-color: $gray-200 !default;
Mark Otto's avatar
Update spacer utilities (#22123)    
Mark Otto committed
216
217
218
219
220
221 

$border-radius:          .25rem !default;
$border-radius-lg:       .3rem !default;
$border-radius-sm:       .2rem !default;

$component-active-color: $white !default;
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
222 
$component-active-bg:    theme-color("primary") !default;
Mark Otto's avatar
Update spacer utilities (#22123)    
Mark Otto committed
223
224
225
226
227
228
229
230 

$caret-width:            .3em !default;

$transition-base:        all .2s ease-in-out !default;
$transition-fade:        opacity .15s linear !default;
$transition-collapse:    height .35s ease !default;
Mark Otto's avatar
rip numbers    
Mark Otto committed
231 
// Fonts
Mark Otto's avatar
convert to scss  
Mark Otto committed
232 
//
Mark Otto's avatar
remove all customizer comments from variables file    
Mark Otto committed
233 
// Font, line-height, and color for body text, headings, and more.
Mark Otto's avatar
convert to scss  
Mark Otto committed
234
Pascal Pixel's avatar
Emoji Defaults (#22565)    
Pascal Pixel committed
235 
$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;
Mark Otto's avatar
Add SF Mono to the monospace font stack    
Mark Otto committed
236 
$font-family-monospace:  "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
Mark Otto's avatar
more variables spacing    
Mark Otto committed
237 
$font-family-base:       $font-family-sans-serif !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
238
Mark Otto's avatar
Remove -size-root so we can respect user prefs on browser default font-size    
Mark Otto committed
239 
$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
Mark Otto's avatar
more variables spacing    
Mark Otto committed
240
241 
$font-size-lg:   1.25rem !default;
$font-size-sm:   .875rem !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
242
Mark Otto's avatar
300, not light    
Mark Otto committed
243 
$font-weight-light: 300 !default;
Simon Bächler's avatar
Use a variable for the default font weights. Fixes #20741    
Simon Bächler committed
244
245
246 
$font-weight-normal: normal !default;
$font-weight-bold: bold !default;
Mark Otto's avatar
Merge branch 'patch-1' of https://github.com/tomhorvat/bootstrap into tomhorvat-patch-1    
Mark Otto committed
247 
$font-weight-base: $font-weight-normal !default;
Mark Otto's avatar
Redo line-height globally    
Mark Otto committed
248
249 
$line-height-base: 1.5 !default;
Patrick Yeo's avatar
Rename `$font-size-h*` to `$h*-font-size` for consistency (#22414)    
Patrick Yeo committed
250
251
252
253
254
255 
$h1-font-size: 2.5rem !default;
$h2-font-size: 2rem !default;
$h3-font-size: 1.75rem !default;
$h4-font-size: 1.5rem !default;
$h5-font-size: 1.25rem !default;
$h6-font-size: 1rem !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
256
Mark Otto's avatar
more variables spacing    
Mark Otto committed
257
258
259
260
261 
$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
convert to scss  
Mark Otto committed
262
Mark Otto's avatar
fixes #21511: set line-height to 1.1 for display headings    
Mark Otto committed
263
264
265
266
267
268
269
270
271
272
273 
$display1-size: 6rem !default;
$display2-size: 5.5rem !default;
$display3-size: 4.5rem !default;
$display4-size: 3.5rem !default;

$display1-weight:     300 !default;
$display2-weight:     300 !default;
$display3-weight:     300 !default;
$display4-weight:     300 !default;
$display-line-height: $headings-line-height !default;
Mark Otto's avatar
more variables spacing    
Mark Otto committed
274
275 
$lead-font-size:   1.25rem !default;
$lead-font-weight: 300 !default;
Mark Otto's avatar
variables cleanup    
Mark Otto committed
276
Mark Otto's avatar
Revert "Drop the $small-font-size variable for the newer $font-size-sm one"    
Mark Otto committed
277
278 
$small-font-size: 80% !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
279 
$text-muted: $gray-600 !default;
Mark Otto's avatar
variables cleanup    
Mark Otto committed
280
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
281 
$blockquote-small-color:  $gray-600 !default;
Mark Otto's avatar
more variables spacing    
Mark Otto committed
282 
$blockquote-font-size:    ($font-size-base * 1.25) !default;
Mark Otto's avatar
variables cleanup    
Mark Otto committed
283
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
284 
$hr-border-color: rgba($black,.1) !default;
Mark Otto's avatar
more variables spacing    
Mark Otto committed
285 
$hr-border-width: $border-width !default;
Mark Otto's avatar
unaffix sidebar and simplify styles of docs side nav to be more like v3    
Mark Otto committed
286
Chris Rebert's avatar
Add $mark-padding variable    
Chris Rebert committed
287
288 
$mark-padding: .2em !default;
Simon Bächler's avatar
Use a variable for the default font weights. Fixes #20741    
Simon Bächler committed
289 
$dt-font-weight: $font-weight-bold !default;
Chris Rebert's avatar
Add 3 more font-weight variables    
Chris Rebert committed
290
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
291 
$kbd-box-shadow:         inset 0 -.1rem 0 rgba($black,.25) !default;
Simon Bächler's avatar
Use a variable for the default font weights. Fixes #20741    
Simon Bächler committed
292 
$nested-kbd-font-weight: $font-weight-bold !default;
Chris Rebert's avatar
Add 3 more font-weight variables    
Chris Rebert committed
293
Mark Otto's avatar
more variables spacing    
Mark Otto committed
294 
$list-inline-padding: 5px !default;
Chris Rebert's avatar
Add $list-inline-padding variable    
Chris Rebert committed
295
Mark Otto's avatar
remove $state-vars now    
Mark Otto committed
296
297 
$mark-bg: #fcf8e3 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
298
Mark Otto's avatar
rip numbers    
Mark Otto committed
299 
// Tables
Mark Otto's avatar
convert to scss  
Mark Otto committed
300 
//
Mark Otto's avatar
remove all customizer comments from variables file    
Mark Otto committed
301 
// Customizes the `.table` component with basic values, each used across all table variations.
Mark Otto's avatar
convert to scss  
Mark Otto committed
302
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
303 
$table-cell-padding:            .75rem !default;
Patrick Yeo's avatar
Rename for consistency `$table-sm-cell-padding`, `$table-bg-accent`,...    
Patrick Yeo committed
304 
$table-cell-padding-sm:         .3rem !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
305
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
306 
$table-bg:                      transparent !default;
Patrick Yeo's avatar
Rename for consistency `$table-sm-cell-padding`, `$table-bg-accent`,...    
Patrick Yeo committed
307
308
309 
$table-accent-bg:               rgba($black,.05) !default;
$table-hover-bg:                rgba($black,.075) !default;
$table-active-bg:               $table-hover-bg !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
310
Mark Otto's avatar
reorder    
Mark Otto committed
311 
$table-border-width:            $border-width !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
312 
$table-border-color:            $gray-200 !default;
Mark Otto's avatar
reorder    
Mark Otto committed
313
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
314
315 
$table-head-bg:                 $gray-200 !default;
$table-head-color:              $gray-700 !default;
Christopher Baker's avatar
remove references to -* outside _variables.scss    
Christopher Baker committed
316
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
317 
$table-inverse-bg:              $gray-900 !default;
Patrick Yeo's avatar
Rename for consistency `$table-sm-cell-padding`, `$table-bg-accent`,...    
Patrick Yeo committed
318
319 
$table-inverse-accent-bg:       rgba($white, .05) !default;
$table-inverse-hover-bg:        rgba($white, .075) !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
320 
$table-inverse-border-color:    lighten($gray-900, 7.5%) !default;
Mark Otto's avatar
reorder    
Mark Otto committed
321 
$table-inverse-color:           $body-bg !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
322
323
Mark Otto's avatar
rip numbers    
Mark Otto committed
324 
// Buttons
Mark Otto's avatar
convert to scss  
Mark Otto committed
325 
//
Mark Otto's avatar
remove all customizer comments from variables file    
Mark Otto committed
326 
// For each of Bootstrap's buttons, define text, background and border color.
Mark Otto's avatar
convert to scss  
Mark Otto committed
327
Mark Otto's avatar
Revamp button and input vars while fixing #21587 (#22287)    
Mark Otto committed
328 
$input-btn-padding-y:       .5rem !default;
Mark Otto's avatar
tighten up horizontal input and button padding    
Mark Otto committed
329 
$input-btn-padding-x:       .75rem !default;
Mark Otto's avatar
Revamp button and input vars while fixing #21587 (#22287)    
Mark Otto committed
330
331
332 
$input-btn-line-height:     1.25 !default;

$input-btn-padding-y-sm:    .25rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
333 
$input-btn-padding-x-sm:    .5rem !default;
Mark Otto's avatar
Revamp button and input vars while fixing #21587 (#22287)    
Mark Otto committed
334
335
336 
$input-btn-line-height-sm:  1.5 !default;

$input-btn-padding-y-lg:    .5rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
337 
$input-btn-padding-x-lg:    1rem !default;
Mark Otto's avatar
Revamp button and input vars while fixing #21587 (#22287)    
Mark Otto committed
338
339 
$input-btn-line-height-lg:  1.5 !default;
Simon Bächler's avatar
Use a variable for the default font weights. Fixes #20741    
Simon Bächler committed
340 
$btn-font-weight:                $font-weight-normal !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
341 
$btn-box-shadow:                 inset 0 1px 0 rgba($white,.15), 0 1px 1px rgba($black,.075) !default;
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
342 
$btn-focus-box-shadow:           0 0 0 3px rgba(theme-color("primary"), .25) !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
343 
$btn-active-box-shadow:          inset 0 3px 5px rgba($black,.125) !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
344
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
345 
$btn-link-disabled-color:        $gray-600 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
346
Mark Otto's avatar
Switch up some split button stuff    
Mark Otto committed
347
348 
$btn-block-spacing-y:            .5rem !default;
Mark Otto's avatar
Merge branch 'master' into v4    
Mark Otto committed
349 
// Allows for customizing button radius independently from global border radius
Catalin Zalog's avatar
Apply !default to SCSS variables    
Catalin Zalog committed
350
351
352 
$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
Merge branch 'master' into v4    
Mark Otto committed
353
Patrick Yeo's avatar
Only add CSS transitions on Buttons for background-color, border-color, and box-shadow    
Patrick Yeo committed
354 
$btn-transition:                 background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
Tom Lutzenberger's avatar
Add variables for transitions (#21345)    
Tom Lutzenberger committed
355
Mark Otto's avatar
convert to scss  
Mark Otto committed
356
Mark Otto's avatar
rip numbers    
Mark Otto committed
357 
// Forms
Mark Otto's avatar
convert to scss  
Mark Otto committed
358
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
359 
$input-bg:                       $white !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
360 
$input-disabled-bg:              $gray-200 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
361
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
362 
$input-color:                    $gray-700 !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
363 
$input-border-color:             rgba($black,.15) !default;
Chris Rebert's avatar
Use $input-btn-border-width for both .form-control and .btn borders; fixes #18424    
Chris Rebert committed
364 
$input-btn-border-width:         $border-width !default; // For form controls and buttons
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
365 
$input-box-shadow:               inset 0 1px 1px rgba($black,.075) !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
366
Mark Otto's avatar
drop the base (hahaha), no but seriously drop the -base from our vars since it's cleaner    
Mark Otto committed
367 
$input-border-radius:            $border-radius !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
368
369 
$input-border-radius-lg:         $border-radius-lg !default;
$input-border-radius-sm:         $border-radius-sm !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
370
Patrick Yeo's avatar
(#22414) Rename for consistency `$input-bg-disabled`, `$input-bg-focus`,...    
Patrick Yeo committed
371 
$input-focus-bg:                 $input-bg !default;
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
372 
$input-focus-border-color:       lighten(theme-color("primary"), 25%) !default;
Mark Otto's avatar
Merge branch 'v4-dev' into form-tweaks    
Mark Otto committed
373 
$input-focus-box-shadow:         $input-box-shadow, $btn-focus-box-shadow !default;
Patrick Yeo's avatar
(#22414) Rename for consistency `$input-bg-disabled`, `$input-bg-focus`,...    
Patrick Yeo committed
374 
$input-focus-color:              $input-color !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
375
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
376 
$input-placeholder-color:        $gray-600 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
377
Mark Otto's avatar
Change how input and select height is computed    
Mark Otto committed
378
379
380
381
382
383
384
385 
$input-height-border:           $input-btn-border-width * 2 !default;

$input-height-inner:            ($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2) !default;
$input-height:                  calc(#{$input-height-inner} + #{$input-height-border}) !default;

$input-height-inner-sm:         ($font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2) !default;
$input-height-sm:               calc(#{$input-height-inner-sm} + #{$input-height-border}) !default;
Patrick Yeo's avatar
`$input-height-inner-lg` should use `$font-size-lg` instead of `$font-size-sm` (#23150)    
Patrick Yeo committed
386 
$input-height-inner-lg:         ($font-size-lg * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2) !default;
Mark Otto's avatar
Change how input and select height is computed    
Mark Otto committed
387 
$input-height-lg:               calc(#{$input-height-inner-lg} + #{$input-height-border}) !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
388
Tom Lutzenberger's avatar
Add variables for transitions (#21345)    
Tom Lutzenberger committed
389
390 
$input-transition:               border-color ease-in-out .15s, box-shadow ease-in-out .15s !default;
Mark Otto's avatar
add some vars    
Mark Otto committed
391
392
393
394
395
396
397
398
399 
$form-text-margin-top:     .25rem !default;

$form-check-margin-bottom:  .5rem !default;
$form-check-input-gutter:   1.25rem !default;
$form-check-input-margin-y: .25rem !default;
$form-check-input-margin-x: .25rem !default;

$form-check-inline-margin-x: .75rem !default;
Mark Otto's avatar
Update spacer utilities (#22123)    
Mark Otto committed
400 
$form-group-margin-bottom:       1rem !default;
Mark Otto's avatar
fix validation, run grunt dist    
Mark Otto committed
401
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
402 
$input-group-addon-bg:           $gray-200 !default;
Chris Rebert's avatar
$input-border => $input-border-color    
Chris Rebert committed
403 
$input-group-addon-border-color: $input-border-color !default;
Nathan Woltman's avatar
Fix border on input group elements and custom form inputs    
Nathan Woltman committed
404 
$input-group-btn-border-color:   $input-border-color !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
405
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
406
407 
$custom-control-gutter:   1.5rem !default;
$custom-control-spacer-y: .25rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
408 
$custom-control-spacer-x: 1rem !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
409
410
411
412 

$custom-control-indicator-size:       1rem !default;
$custom-control-indicator-bg:         #ddd !default;
$custom-control-indicator-bg-size:    50% 50% !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
413 
$custom-control-indicator-box-shadow: inset 0 .25rem .25rem rgba($black,.1) !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
414
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
415
416 
$custom-control-indicator-disabled-bg:       $gray-200 !default;
$custom-control-description-disabled-color:  $gray-600 !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
417
Patrick Yeo's avatar
(#22414) Rename for consistency `$custom-control-disabled-indicator-bg`,...    
Patrick Yeo committed
418 
$custom-control-indicator-checked-color:      $white !default;
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
419 
$custom-control-indicator-checked-bg:         theme-color("primary") !default;
Patrick Yeo's avatar
(#22414) Rename for consistency `$custom-control-disabled-indicator-bg`,...    
Patrick Yeo committed
420 
$custom-control-indicator-checked-box-shadow: none !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
421
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
422 
$custom-control-indicator-focus-box-shadow: 0 0 0 1px $body-bg, 0 0 0 3px theme-color("primary") !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
423
Patrick Yeo's avatar
(#22414) Rename for consistency `$custom-control-disabled-indicator-bg`,...    
Patrick Yeo committed
424 
$custom-control-indicator-active-color:      $white !default;
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
425 
$custom-control-indicator-active-bg:         lighten(theme-color("primary"), 35%) !default;
Patrick Yeo's avatar
(#22414) Rename for consistency `$custom-control-disabled-indicator-bg`,...    
Patrick Yeo committed
426 
$custom-control-indicator-active-box-shadow: none !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
427
Patrick Yeo's avatar
(#22414) Rename for consistency `$custom-checkbox-border-radius`,...    
Patrick Yeo committed
428
429 
$custom-checkbox-indicator-border-radius: $border-radius !default;
$custom-checkbox-indicator-icon-checked: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='#{$custom-control-indicator-checked-color}' 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"), "#", "%23") !default;
Mark Otto's avatar
Fixes #20118: Add and use Sass variables to control the color of our embedded...    
Mark Otto committed
430
Patrick Yeo's avatar
(#22414) Rename for consistency `$custom-checkbox-border-radius`,...    
Patrick Yeo committed
431 
$custom-checkbox-indicator-indeterminate-bg: theme-color("primary") !default;
Patrick Yeo's avatar
(Fixes #22414) Rename for consistency `$custom-checkbox-radius`,...    
Patrick Yeo committed
432 
$custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default;
Patrick Yeo's avatar
(#22414) Rename for consistency `$custom-checkbox-border-radius`,...    
Patrick Yeo committed
433
434 
$custom-checkbox-indicator-icon-indeterminate: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/%3E%3C/svg%3E"), "#", "%23") !default;
$custom-checkbox-indicator-indeterminate-box-shadow: none !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
435
Patrick Yeo's avatar
(#22414) Rename for consistency `$custom-checkbox-border-radius`,...    
Patrick Yeo committed
436
437 
$custom-radio-indicator-border-radius: 50% !default;
$custom-radio-indicator-icon-checked: str-replace(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='#{$custom-control-indicator-checked-color}'/%3E%3C/svg%3E"), "#", "%23") !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
438
439 

$custom-select-padding-y:          .375rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
440 
$custom-select-padding-x:          .75rem  !default;
Mark Otto's avatar
Change how input and select height is computed    
Mark Otto committed
441 
$custom-select-height:              $input-height  !default;
Kovah's avatar
#14840 - Use color variables consistently    
Kovah committed
442 
$custom-select-indicator-padding:   1rem !default; // Extra padding to account for the presence of the background-image based indicator
Mark Otto's avatar
Revamp button and input vars while fixing #21587 (#22287)    
Mark Otto committed
443 
$custom-select-line-height:         $input-btn-line-height !default;
Kovah's avatar
#14840 - Use color variables consistently    
Kovah committed
444 
$custom-select-color:               $input-color !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
445 
$custom-select-disabled-color:      $gray-600 !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
446 
$custom-select-bg:            $white !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
447 
$custom-select-disabled-bg:   $gray-200 !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
448 
$custom-select-bg-size:       8px 10px !default; // In pixels because image dimensions
Mark Otto's avatar
Fixes #20118: Add and use Sass variables to control the color of our embedded...    
Mark Otto committed
449 
$custom-select-indicator-color: #333 !default;
Patrick H. Lauke's avatar
replace `#` with `%23` in SVG data urls with str-replace    
Patrick H. Lauke committed
450 
$custom-select-indicator:     str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E"), "#", "%23") !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
451
452
453
454 
$custom-select-border-width:  $input-btn-border-width !default;
$custom-select-border-color:  $input-border-color !default;
$custom-select-border-radius: $border-radius !default;
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
455 
$custom-select-focus-border-color: lighten(theme-color("primary"), 25%) !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
456 
$custom-select-focus-box-shadow:   inset 0 1px 2px rgba($black, .075), 0 0 5px rgba($custom-select-focus-border-color, .5) !default;
Mark Otto's avatar
Hella vars for custom checkboxes and radios and selects    
Mark Otto committed
457
Mark Otto's avatar
Redo the small custom select vars    
Mark Otto committed
458
459 
$custom-select-font-size-sm:  75% !default;
$custom-select-height-sm: $input-height-sm !default;
markau's avatar
Fixes #17918: Add styles for disabled custom checkboxes and radios    
markau committed
460
Mark Otto's avatar
add custom file vars, fix up custom select var    
Mark Otto committed
461
462 
$custom-file-height:           2.5rem !default;
$custom-file-width:            14rem !default;
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
463 
$custom-file-focus-box-shadow: 0 0 0 .075rem $white, 0 0 0 .2rem theme-color("primary") !default;
Mark Otto's avatar
add custom file vars, fix up custom select var    
Mark Otto committed
464
465 

$custom-file-padding-y:     1rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
466 
$custom-file-padding-x:     .5rem !default;
Mark Otto's avatar
add custom file vars, fix up custom select var    
Mark Otto committed
467 
$custom-file-line-height:   1.5 !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
468 
$custom-file-color:         $gray-700 !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
469 
$custom-file-bg:            $white !default;
Mark Otto's avatar
add custom file vars, fix up custom select var    
Mark Otto committed
470 
$custom-file-border-width:  $border-width !default;
Kovah's avatar
#14840 - Use color variables consistently    
Kovah committed
471 
$custom-file-border-color:  $input-border-color !default;
Mark Otto's avatar
add custom file vars, fix up custom select var    
Mark Otto committed
472 
$custom-file-border-radius: $border-radius !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
473 
$custom-file-box-shadow:    inset 0 .2rem .4rem rgba($black,.05) !default;
Mark Otto's avatar
add custom file vars, fix up custom select var    
Mark Otto committed
474 
$custom-file-button-color:  $custom-file-color !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
475 
$custom-file-button-bg:     $gray-200 !default;
Chris Rebert's avatar
Make translation of custom file input text easier; fixes #18922    
Chris Rebert committed
476
477
478
479
480
481
482
483 
$custom-file-text: (
  placeholder: (
    en: "Choose file..."
  ),
  button-label: (
    en: "Browse"
  )
) !default;
markau's avatar
Fixes #17918: Add styles for disabled custom checkboxes and radios    
markau committed
484
485
Mark Otto's avatar
remove icons for now    
Mark Otto committed
486 
// Form validation
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
487
488 
$form-feedback-valid-color:   theme-color("success") !default;
$form-feedback-invalid-color: theme-color("danger") !default;
Mark Otto's avatar
move form validation icon vars to variables file    
Mark Otto committed
489
Mark Otto's avatar
convert to scss  
Mark Otto committed
490
Mark Otto's avatar
rip numbers    
Mark Otto committed
491 
// Dropdowns
Mark Otto's avatar
convert to scss  
Mark Otto committed
492 
//
Mark Otto's avatar
remove all customizer comments from variables file    
Mark Otto committed
493 
// Dropdown menu container and contents.
Mark Otto's avatar
convert to scss  
Mark Otto committed
494
Mark Otto's avatar
v4: Dropdown units (#20701)    
Mark Otto committed
495
496 
$dropdown-min-width:             10rem !default;
$dropdown-padding-y:             .5rem !default;
Patrick Yeo's avatar
(#22414) Rename for consistency `$dropdown-margin-top` to `$dropdown-spacer`    
Patrick Yeo committed
497 
$dropdown-spacer:                .125rem !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
498
499 
$dropdown-bg:                    $white !default;
$dropdown-border-color:          rgba($black,.15) !default;
Chris Rebert's avatar
Add $dropdown-border-width; refs #18150    
Chris Rebert committed
500 
$dropdown-border-width:          $border-width !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
501 
$dropdown-divider-bg:            $gray-200 !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
502 
$dropdown-box-shadow:            0 .5rem 1rem rgba($black,.175) !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
503
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
504
505
506 
$dropdown-link-color:            $gray-900 !default;
$dropdown-link-hover-color:      darken($gray-900, 5%) !default;
$dropdown-link-hover-bg:         $gray-100 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
507
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
508
509 
$dropdown-link-active-color:     $component-active-color !default;
$dropdown-link-active-bg:        $component-active-bg !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
510
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
511 
$dropdown-link-disabled-color:   $gray-600 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
512
Mark Otto's avatar
Add dropdown-item-padding-y var    
Mark Otto committed
513 
$dropdown-item-padding-y:        .25rem !default;
Mark Otto's avatar
v4: Dropdown units (#20701)    
Mark Otto committed
514 
$dropdown-item-padding-x:        1.5rem !default;
Chris Rebert's avatar
Extract $dropdown-item-padding-x variable    
Chris Rebert committed
515
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
516 
$dropdown-header-color:          $gray-600 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
517
518
Mark Otto's avatar
rip numbers    
Mark Otto committed
519 
// Z-index master list
Mark Otto's avatar
convert to scss  
Mark Otto committed
520
521
522
523 
//
// 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.
Mark Otto's avatar
update rest of docs, remove navbar specific modifiers, fix docs example css    
Mark Otto committed
524 
$zindex-dropdown:           1000 !default;
Catalin Zalog's avatar
Change sticky order (#22027)    
Catalin Zalog committed
525 
$zindex-sticky:             1020 !default;
Mark Otto's avatar
update rest of docs, remove navbar specific modifiers, fix docs example css    
Mark Otto committed
526
527
528
529
530 
$zindex-fixed:              1030 !default;
$zindex-modal-backdrop:     1040 !default;
$zindex-modal:              1050 !default;
$zindex-popover:            1060 !default;
$zindex-tooltip:            1070 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
531
Pierre-Denis Vanduynslager's avatar
Harmonize navbar-brand, navbar-text and nav-link height    
Pierre-Denis Vanduynslager committed
532
533
534 
// Navs

$nav-link-padding-y:            .5rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
535 
$nav-link-padding-x:            1rem !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
536 
$nav-link-disabled-color:       $gray-600 !default;
Pierre-Denis Vanduynslager's avatar
Harmonize navbar-brand, navbar-text and nav-link height    
Pierre-Denis Vanduynslager committed
537
538
539
540 

$nav-tabs-border-color:                       #ddd !default;
$nav-tabs-border-width:                       $border-width !default;
$nav-tabs-border-radius:                      $border-radius !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
541
542 
$nav-tabs-link-hover-border-color:            $gray-200 !default;
$nav-tabs-link-active-color:                  $gray-700 !default;
Patrick Yeo's avatar
(#22414) Renamed for consistency `$nav-disabled-link-color`,...    
Patrick Yeo committed
543
544 
$nav-tabs-link-active-bg:                     $body-bg !default;
$nav-tabs-link-active-border-color:           #ddd !default;
Pierre-Denis Vanduynslager's avatar
Harmonize navbar-brand, navbar-text and nav-link height    
Pierre-Denis Vanduynslager committed
545
546 

$nav-pills-border-radius:     $border-radius !default;
Patrick Yeo's avatar
(#22414) Renamed for consistency `$nav-disabled-link-color`,...    
Patrick Yeo committed
547
548 
$nav-pills-link-active-color: $component-active-color !default;
$nav-pills-link-active-bg:    $component-active-bg !default;
Pierre-Denis Vanduynslager's avatar
Harmonize navbar-brand, navbar-text and nav-link height    
Pierre-Denis Vanduynslager committed
549
Mark Otto's avatar
rip numbers    
Mark Otto committed
550 
// Navbar
Mark Otto's avatar
convert to scss  
Mark Otto committed
551
Chris Rebert's avatar
Rename 2 navbar variables to comply with updated naming convention    
Chris Rebert committed
552 
$navbar-padding-y:                  ($spacer / 2) !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
553 
$navbar-padding-x:                  $spacer !default;
Mark Otto's avatar
more navbar variables    
Mark Otto committed
554
Pierre-Denis Vanduynslager's avatar
Allow to customize navbar-brand font-size    
Pierre-Denis Vanduynslager committed
555 
$navbar-brand-font-size:            $font-size-lg !default;
Pierre-Denis Vanduynslager's avatar
Harmonize navbar-brand, navbar-text and nav-link height    
Pierre-Denis Vanduynslager committed
556 
// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
Pierre-Denis Vanduynslager's avatar
Allow to customize navbar-brand font-size    
Pierre-Denis Vanduynslager committed
557 
$nav-link-height:                   $navbar-brand-font-size * $line-height-base !default;
Pierre-Denis Vanduynslager's avatar
Harmonize navbar-brand, navbar-text and nav-link height    
Pierre-Denis Vanduynslager committed
558
559
560 
$navbar-brand-height:               ($font-size-base * $line-height-base + $nav-link-padding-y * 2) !default;
$navbar-brand-padding-y:            ($navbar-brand-height - $nav-link-height) / 2 !default;
Mark Otto's avatar
Redo navbar-toggler    
Mark Otto committed
561 
$navbar-toggler-padding-y:           .25rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
562 
$navbar-toggler-padding-x:           .75rem !default;
Mark Otto's avatar
correction, -toggler-*    
Mark Otto committed
563
564 
$navbar-toggler-font-size:           $font-size-lg !default;
$navbar-toggler-border-radius:       $btn-border-radius !default;
Mark Otto's avatar
add new variable for -toggle-font-size    
Mark Otto committed
565
Mark Otto's avatar
update navbars to rename .navbar-inverse to .navbar-dark, update all navbar examples and variables    
Mark Otto committed
566
567
568
569
570
571 
$navbar-dark-color:                 rgba($white,.5) !default;
$navbar-dark-hover-color:           rgba($white,.75) !default;
$navbar-dark-active-color:          rgba($white,1) !default;
$navbar-dark-disabled-color:        rgba($white,.25) !default;
$navbar-dark-toggler-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default;
$navbar-dark-toggler-border-color:  rgba($white,.1) !default;
Mark Otto's avatar
rewrite navbar once more for lower key styles and a new take on modifiers for...    
Mark Otto committed
572
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
573
574
575
576 
$navbar-light-color:                rgba($black,.5) !default;
$navbar-light-hover-color:          rgba($black,.7) !default;
$navbar-light-active-color:         rgba($black,.9) !default;
$navbar-light-disabled-color:       rgba($black,.3) !default;
Patrick Yeo's avatar
Rename `$navbar-*-toggler-bg` to `$navbar-*-toggler-icon-bg` since it's placed...    
Patrick Yeo committed
577 
$navbar-light-toggler-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-light-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default;
Patrick Yeo's avatar
Rename variable $input-border-focus to $input-border-color-focus (#22413)    
Patrick Yeo committed
578 
$navbar-light-toggler-border-color: rgba($black,.1) !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
579
Mark Otto's avatar
rip numbers    
Mark Otto committed
580 
// Pagination
Mark Otto's avatar
convert to scss  
Mark Otto committed
581
Mark Otto's avatar
nuke the shared padding vars and assign to individual components    
Mark Otto committed
582 
$pagination-padding-y:                .5rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
583 
$pagination-padding-x:                .75rem !default;
Mark Otto's avatar
Follow up to #21052 to match small pagination links with small buttons    
Mark Otto committed
584 
$pagination-padding-y-sm:             .25rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
585 
$pagination-padding-x-sm:             .5rem !default;
Mark Otto's avatar
nuke the shared padding vars and assign to individual components    
Mark Otto committed
586 
$pagination-padding-y-lg:             .75rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
587 
$pagination-padding-x-lg:             1.5rem !default;
Stefan Staynov's avatar
Set line-height for page-links (#21052)    
Stefan Staynov committed
588 
$pagination-line-height:              1.25 !default;
Mark Otto's avatar
nuke the shared padding vars and assign to individual components    
Mark Otto committed
589
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
590 
$pagination-color:                     $link-color !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
591 
$pagination-bg:                        $white !default;
Chris Rebert's avatar
Add $pagination-border-width; refs #18150    
Chris Rebert committed
592 
$pagination-border-width:              $border-width !default;
Chris Rebert's avatar
Rename $pagination-border => $pagination-border-color for clarity    
Chris Rebert committed
593 
$pagination-border-color:              #ddd !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
594
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
595 
$pagination-hover-color:               $link-hover-color !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
596 
$pagination-hover-bg:                  $gray-200 !default;
Patrick Yeo's avatar
Rename variable $input-border-focus to $input-border-color-focus (#22413)    
Patrick Yeo committed
597 
$pagination-hover-border-color:        #ddd !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
598
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
599 
$pagination-active-color:              $white !default;
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
600
601 
$pagination-active-bg:                 theme-color("primary") !default;
$pagination-active-border-color:       theme-color("primary") !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
602
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
603 
$pagination-disabled-color:            $gray-600 !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
604 
$pagination-disabled-bg:               $white !default;
Patrick Yeo's avatar
Rename variable $input-border-focus to $input-border-color-focus (#22413)    
Patrick Yeo committed
605 
$pagination-disabled-border-color:     #ddd !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
606
607
Mark Otto's avatar
rip numbers    
Mark Otto committed
608 
// Jumbotron
Mark Otto's avatar
convert to scss  
Mark Otto committed
609
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
610 
$jumbotron-padding:              2rem !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
611 
$jumbotron-bg:                   $gray-200 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
612
613
Mark Otto's avatar
rip numbers    
Mark Otto committed
614 
// Cards
Quy's avatar
Rename Tags to Badges in comments    
Quy committed
615
Catalin Zalog's avatar
Apply !default to SCSS variables    
Catalin Zalog committed
616 
$card-spacer-y:            .75rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
617 
$card-spacer-x:            1.25rem !default;
Mark Otto's avatar
unfuck that border from rem to px    
Mark Otto committed
618 
$card-border-width:        1px !default;
Chris Rebert's avatar
Make $card-border-radius default to $border-radius    
Chris Rebert committed
619 
$card-border-radius:       $border-radius !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
620 
$card-border-color:        rgba($black,.125) !default;
Patrick Yeo's avatar
Rename `$card-border-radius-inner` to `$card-inner-border-radius`    
Patrick Yeo committed
621 
$card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}) !default;
Mark Otto's avatar
make card headers and footers translucent    
Mark Otto committed
622 
$card-cap-bg:              rgba($black, .03) !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
623 
$card-bg:                  $white !default;
Kevin Kirsche's avatar
Card variables should be in _variables.scss    
Kevin Kirsche committed
624
Chris Rebert's avatar
Add $card-img-overlay-padding variable    
Chris Rebert committed
625
626 
$card-img-overlay-padding: 1.25rem !default;
Mark Otto's avatar
remove grid gutter sass map as it's output css was all jacked up    
Mark Otto committed
627 
$card-deck-margin:          ($grid-gutter-width / 2) !default;
Chris Rebert's avatar
Introduce $card-deck-margin variable    
Chris Rebert committed
628
Mark Otto's avatar
add card column count variable    
Mark Otto committed
629 
$card-columns-count:        3 !default;
Mark Otto's avatar
Rename card column gap variable    
Mark Otto committed
630 
$card-columns-gap:          1.25rem !default;
Mark Otto's avatar
add card column margin variable instead of relying on a default card margin    
Mark Otto committed
631 
$card-columns-margin:       $card-spacer-y !default;
Chris Rebert's avatar
Add $card-columns-sm-up-column-gap variable    
Chris Rebert committed
632
Andrey's avatar
Add variable for card-link hover state    
Andrey committed
633
Mark Otto's avatar
rip numbers    
Mark Otto committed
634 
// Tooltips
Mark Otto's avatar
convert to scss  
Mark Otto committed
635
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
636 
$tooltip-max-width:           200px !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
637
638 
$tooltip-color:               $white !default;
$tooltip-bg:                  $black !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
639 
$tooltip-opacity:             .9 !default;
Chris Rebert's avatar
Introduce $tooltip-padding-{x,y} & $tooltip-margin vars    
Chris Rebert committed
640
641 
$tooltip-padding-y:           3px !default;
$tooltip-padding-x:           8px !default;
Johann-S's avatar
Fix tooltip margin to be stick at their caller    
Johann-S committed
642 
$tooltip-margin:              0 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
643
644
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
645 
$tooltip-arrow-width:         5px !default;
Johann-S's avatar
Use Popper.js to manage arrow position    
Johann-S committed
646 
$tooltip-arrow-height:        5px !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
647 
$tooltip-arrow-color:         $tooltip-bg !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
648
649
Mark Otto's avatar
rip numbers    
Mark Otto committed
650 
// Popovers
Mark Otto's avatar
convert to scss  
Mark Otto committed
651
Mark Otto's avatar
Alternate fix to #19006: Add a single variable for controlling that inner 1px padding on .popover    
Mark Otto committed
652 
$popover-inner-padding:               1px !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
653 
$popover-bg:                          $white !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
654 
$popover-max-width:                   276px !default;
Chris Rebert's avatar
Add $popover-border-width; refs #18150    
Chris Rebert committed
655 
$popover-border-width:                $border-width !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
656
657 
$popover-border-color:                rgba($black,.2) !default;
$popover-box-shadow:                  0 5px 10px rgba($black,.2) !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
658
Mark Otto's avatar
Rename popover classes    
Mark Otto committed
659
660
661
662
663
664
665
666 
$popover-header-bg:                    darken($popover-bg, 3%) !default;
$popover-header-color:                 $headings-color !default;
$popover-header-padding-y:             8px !default;
$popover-header-padding-x:             14px !default;

$popover-body-color:               $body-color !default;
$popover-body-padding-y:           9px !default;
$popover-body-padding-x:           14px !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
667
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
668 
$popover-arrow-width:                 10px !default;
Johann-S's avatar
Use Popper.js to manage arrow position    
Johann-S committed
669 
$popover-arrow-height:                5px !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
670 
$popover-arrow-color:                 $popover-bg !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
671
Chris Rebert's avatar
Use proper units when adding/subtracting lengths    
Chris Rebert committed
672 
$popover-arrow-outer-width:           ($popover-arrow-width + 1px) !default;
Mark Otto's avatar
linter    
Mark Otto committed
673 
$popover-arrow-outer-color:           fade-in($popover-border-color, .05) !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
674
675
Mark Otto's avatar
rip numbers    
Mark Otto committed
676 
// Badges
Mark Otto's avatar
convert to scss  
Mark Otto committed
677
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
678 
$badge-color:                 $white !default;
Mark Otto's avatar
Rename .tag to .badge to avoid conflicting with WordPress    
Mark Otto committed
679
680
681 
$badge-font-size:             75% !default;
$badge-font-weight:           $font-weight-bold !default;
$badge-padding-y:             .25em !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
682 
$badge-padding-x:             .4em !default;
Mark Otto's avatar
Rename .tag to .badge to avoid conflicting with WordPress    
Mark Otto committed
683
684 

$badge-pill-padding-x:        .6em !default;
Chris Rebert's avatar
Add $label-pill-border-radius variable    
Chris Rebert committed
685
686 
// Use a higher than normal value to ensure completely rounded edges when
// customizing padding or font-size on labels.
Mark Otto's avatar
Rename .tag to .badge to avoid conflicting with WordPress    
Mark Otto committed
687 
$badge-pill-border-radius:    10rem !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
688
JPeer264's avatar
updated sass variables table of contents    
JPeer264 committed
689
Mark Otto's avatar
rip numbers    
Mark Otto committed
690 
// Modals
Mark Otto's avatar
convert to scss  
Mark Otto committed
691
Mark Otto's avatar
remove all customizer comments from variables file    
Mark Otto committed
692 
// Padding applied to the modal body
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
693 
$modal-inner-padding:         15px !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
694
Chris Rebert's avatar
Extract new $modal-dialog-margin variable    
Chris Rebert committed
695 
$modal-dialog-margin:         10px !default;
Patrick Yeo's avatar
(#22414) Renamed for consistency `$modal-dialog-sm-up-margin-y`,...    
Patrick Yeo committed
696 
$modal-dialog-margin-y-sm-up: 30px !default;
Chris Rebert's avatar
Extract new $modal-dialog-margin variable    
Chris Rebert committed
697
Mark Otto's avatar
Redo line-height globally    
Mark Otto committed
698 
$modal-title-line-height:     $line-height-base !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
699
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
700
701 
$modal-content-bg:               $white !default;
$modal-content-border-color:     rgba($black,.2) !default;
Chris Rebert's avatar
Extract $modal-content-border-width variable    
Chris Rebert committed
702 
$modal-content-border-width:     $border-width !default;
Patrick Yeo's avatar
(#22414) Renamed for consistency `$modal-dialog-sm-up-margin-y`,...    
Patrick Yeo committed
703
704 
$modal-content-box-shadow-xs:    0 3px 9px rgba($black,.5) !default;
$modal-content-box-shadow-sm-up: 0 5px 15px rgba($black,.5) !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
705
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
706 
$modal-backdrop-bg:           $black !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
707 
$modal-backdrop-opacity:      .5 !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
708 
$modal-header-border-color:   $gray-200 !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
709 
$modal-footer-border-color:   $modal-header-border-color !default;
Chris Rebert's avatar
Extract $modal-content-border-width variable    
Chris Rebert committed
710 
$modal-header-border-width:   $modal-content-border-width !default;
Chris Rebert's avatar
Extract $modal-{header,footer}-border-width variables    
Chris Rebert committed
711 
$modal-footer-border-width:   $modal-header-border-width !default;
Elliot Evans's avatar
renamed modal-title-padding to modal-header-padding    
Elliot Evans committed
712 
$modal-header-padding:        15px !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
713
Mark Otto's avatar
decrease size of modal-md and modal-lg to ensure fitting in responsive layouts    
Mark Otto committed
714
715 
$modal-lg:                    800px !default;
$modal-md:                    500px !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
716 
$modal-sm:                    300px !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
717
Tom Lutzenberger's avatar
Add variables for transitions (#21345)    
Tom Lutzenberger committed
718
719 
$modal-transition:            transform .3s ease-out !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
720
Mark Otto's avatar
rip numbers    
Mark Otto committed
721 
// Alerts
Mark Otto's avatar
convert to scss  
Mark Otto committed
722 
//
Mark Otto's avatar
remove all customizer comments from variables file    
Mark Otto committed
723 
// Define alert colors, border radius, and padding.
Mark Otto's avatar
convert to scss  
Mark Otto committed
724
Mark Otto's avatar
Switch to separate vars for alert vertical/horizontal padding    
Mark Otto committed
725 
$alert-padding-y:             .75rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
726 
$alert-padding-x:             1.25rem !default;
Mark Otto's avatar
Update spacer utilities (#22123)    
Mark Otto committed
727 
$alert-margin-bottom:         1rem !default;
Mark Otto's avatar
drop the base (hahaha), no but seriously drop the -base from our vars since it's cleaner    
Mark Otto committed
728 
$alert-border-radius:         $border-radius !default;
Simon Bächler's avatar
Use a variable for the default font weights. Fixes #20741    
Simon Bächler committed
729 
$alert-link-font-weight:      $font-weight-bold !default;
Chris Bell's avatar
#17895 Added $alert-border-width that defaults to $border-width    
Chris Bell committed
730 
$alert-border-width:          $border-width !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
731
732
Mark Otto's avatar
rip numbers    
Mark Otto committed
733 
// Progress bars
Mark Otto's avatar
convert to scss  
Mark Otto committed
734
Mark Otto's avatar
Rewrite progress component without <progress> element    
Mark Otto committed
735
736 
$progress-height:               1rem !default;
$progress-font-size:            .75rem !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
737 
$progress-bg:                   $gray-200 !default;
Mark Otto's avatar
Rewrite progress component without <progress> element    
Mark Otto committed
738
739
740 
$progress-border-radius:        $border-radius !default;
$progress-box-shadow:           inset 0 .1rem .1rem rgba($black,.1) !default;
$progress-bar-color:            $white !default;
Mark Otto's avatar
remove - vars, update docs to generate from data yml files, update mixins, and...    
Mark Otto committed
741 
$progress-bar-bg:               theme-color("primary") !default;
Mark Otto's avatar
Rewrite progress component without <progress> element    
Mark Otto committed
742 
$progress-bar-animation-timing: 1s linear infinite !default;
Mark Otto's avatar
Add transition to .progress-bar    
Mark Otto committed
743 
$progress-bar-transition:       width .6s ease !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
744
Mark Otto's avatar
rip numbers    
Mark Otto committed
745 
// List group
Mark Otto's avatar
convert to scss  
Mark Otto committed
746
Mark Otto's avatar
Revamp list group states and docs to match    
Mark Otto committed
747
748
749
750 
$list-group-bg:                  $white !default;
$list-group-border-color:        rgba($black,.125) !default;
$list-group-border-width:        $border-width !default;
$list-group-border-radius:       $border-radius !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
751
Mark Otto's avatar
Revamp list group states and docs to match    
Mark Otto committed
752 
$list-group-item-padding-y:      .75rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
753 
$list-group-item-padding-x:      1.25rem !default;
Mark Otto's avatar
Revamp list group states and docs to match    
Mark Otto committed
754
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
755 
$list-group-hover-bg:                 $gray-100 !default;
Patrick Yeo's avatar
Rename variable $input-border-focus to $input-border-color-focus (#22413)    
Patrick Yeo committed
756
757
758 
$list-group-active-color:             $component-active-color !default;
$list-group-active-bg:                $component-active-bg !default;
$list-group-active-border-color:      $list-group-active-bg !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
759
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
760 
$list-group-disabled-color:      $gray-600 !default;
Mark Otto's avatar
Revamp list group states and docs to match    
Mark Otto committed
761 
$list-group-disabled-bg:         $list-group-bg !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
762
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
763 
$list-group-action-color:             $gray-700 !default;
Patrick Yeo's avatar
(#22414) Rename for consistency `$list-group-link-*-*` to `$list-group-action-*-*`    
Patrick Yeo committed
764 
$list-group-action-hover-color:       $list-group-action-color !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
765
Mark Otto's avatar
follow up to 4e067f722    
Mark Otto committed
766 
$list-group-action-active-color:      $body-color !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
767 
$list-group-action-active-bg:         $gray-200 !default;
Chris Rebert's avatar
Add $list-group-item-padding-{x,y} variables    
Chris Rebert committed
768
Mark Otto's avatar
convert to scss  
Mark Otto committed
769
Mark Otto's avatar
rip numbers    
Mark Otto committed
770 
// Image thumbnails
Mark Otto's avatar
convert to scss  
Mark Otto committed
771
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
772
773 
$thumbnail-padding:           .25rem !default;
$thumbnail-bg:                $body-bg !default;
Chris Rebert's avatar
Add $thumbnail-border-width; refs #18150    
Chris Rebert committed
774 
$thumbnail-border-width:      $border-width !default;
Chris Rebert's avatar
$thumbnail-border => $thumbnail-border-color    
Chris Rebert committed
775 
$thumbnail-border-color:      #ddd !default;
Mark Otto's avatar
drop the base (hahaha), no but seriously drop the -base from our vars since it's cleaner    
Mark Otto committed
776 
$thumbnail-border-radius:     $border-radius !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
777 
$thumbnail-box-shadow:        0 1px 2px rgba($black,.075) !default;
Tom Lutzenberger's avatar
Add variables for transitions (#21345)    
Tom Lutzenberger committed
778 
$thumbnail-transition:        all .2s ease-in-out !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
779
780
Mark Otto's avatar
rip numbers    
Mark Otto committed
781 
// Figures
Chris Rebert's avatar
Add $figure-caption-font-size variable    
Chris Rebert committed
782
783 

$figure-caption-font-size: 90% !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
784 
$figure-caption-color:     $gray-600 !default;
Chris Rebert's avatar
Add $figure-caption-font-size variable    
Chris Rebert committed
785
786
Mark Otto's avatar
rip numbers    
Mark Otto committed
787 
// Breadcrumbs
Mark Otto's avatar
convert to scss  
Mark Otto committed
788
Chris Rebert's avatar
Refactor Breadcrumbs component    
Chris Rebert committed
789
790
791 
$breadcrumb-padding-y:          .75rem !default;
$breadcrumb-padding-x:          1rem !default;
$breadcrumb-item-padding:       .5rem !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
792
Prateek Goel's avatar
Add margin variable for breadcrumb (#23138)    
Prateek Goel committed
793
794 
$breadcrumb-margin-bottom:      1rem !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
795
796
797 
$breadcrumb-bg:                 $gray-200 !default;
$breadcrumb-divider-color:      $gray-600 !default;
$breadcrumb-active-color:       $gray-600 !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
798 
$breadcrumb-divider:            "/" !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
799
800
Mark Otto's avatar
rip numbers    
Mark Otto committed
801 
// Carousel
Mark Otto's avatar
convert to scss  
Mark Otto committed
802
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
803 
$carousel-control-color:                      $white !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
804
805 
$carousel-control-width:                      15% !default;
$carousel-control-opacity:                    .5 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
806
Mark Otto's avatar
redesign indicators    
Mark Otto committed
807
808 
$carousel-indicator-width:                    30px !default;
$carousel-indicator-height:                   3px !default;
Mark Otto's avatar
flexbox powered indicators    
Mark Otto committed
809 
$carousel-indicator-spacer:                   3px !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
810 
$carousel-indicator-active-bg:                $white !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
811
Chris Rebert's avatar
Extract $carousel-caption{-sm-up}-width variables    
Chris Rebert committed
812 
$carousel-caption-width:                      70% !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
813 
$carousel-caption-color:                      $white !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
814
Mark Otto's avatar
rename var    
Mark Otto committed
815 
$carousel-control-icon-width:                 20px !default;
Chris Rebert's avatar
Extract $carousel-icon-width variable    
Chris Rebert committed
816
Mark Otto's avatar
simplify svg by only using viewbox    
Mark Otto committed
817
818 
$carousel-control-prev-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M4 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E"), "#", "%23") !default;
$carousel-control-next-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' viewBox='0 0 8 8'%3E%3Cpath d='M1.5 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E"), "#", "%23") !default;
Mark Otto's avatar
redo control icons to use open iconic svgs inlined    
Mark Otto committed
819
Mark Otto's avatar
Switch to ease function to remove trailing animation movement    
Mark Otto committed
820 
$carousel-transition:           transform .6s ease !default;
Tom Lutzenberger's avatar
Add variables for transitions (#21345)    
Tom Lutzenberger committed
821
Mark Otto's avatar
convert to scss  
Mark Otto committed
822
Mark Otto's avatar
rip numbers    
Mark Otto committed
823 
// Close
Mark Otto's avatar
convert to scss  
Mark Otto committed
824
Mark Otto's avatar
clarify usage of base font-size so we know what's up    
Mark Otto committed
825 
$close-font-size:             $font-size-base * 1.5 !default;
Simon Bächler's avatar
Use a variable for the default font weights. Fixes #20741    
Simon Bächler committed
826 
$close-font-weight:           $font-weight-bold !default;
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
827
828 
$close-color:                 $black !default;
$close-text-shadow:           0 1px 0 $white !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
829
Mark Otto's avatar
rip numbers    
Mark Otto committed
830 
// Code
Mark Otto's avatar
convert to scss  
Mark Otto committed
831
Chris Rebert's avatar
Extract $code-font-size variable    
Chris Rebert committed
832 
$code-font-size:              90% !default;
Chris Rebert's avatar
Extract $code-padding-{x,y} variables    
Chris Rebert committed
833 
$code-padding-y:              .2rem !default;
Catalin Zalog's avatar
css: just some ordering    
Catalin Zalog committed
834 
$code-padding-x:              .4rem !default;
Mark Otto's avatar
tweak code styles    
Mark Otto committed
835 
$code-color:                  #bd4147 !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
836 
$code-bg:                     $gray-100 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
837
Jacob Müller's avatar
Add color variables for white and black (#21397)    
Jacob Müller committed
838 
$kbd-color:                   $white !default;
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
839 
$kbd-bg:                      $gray-900 !default;
Mark Otto's avatar
convert to scss  
Mark Otto committed
840
Mark Otto's avatar
Drop the old $gray- variables for the new color range    
Mark Otto committed
841 
$pre-color:                   $gray-900 !default;
Chris Rebert's avatar
Apply !default to SCSS variables    
Chris Rebert committed
842 
$pre-scrollable-max-height:   340px !default;