vitat-css 0.1.0 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (156) hide show
  1. checksums.yaml +4 -4
  2. data/.DS_Store +0 -0
  3. data/.gitignore +146 -8
  4. data/.idea/.gitignore +5 -0
  5. data/.idea/modules.xml +8 -0
  6. data/.idea/vcs.xml +6 -0
  7. data/.idea/vitat-design-system.iml +12 -0
  8. data/.vscode/settings.json +3 -0
  9. data/HTML/.DS_Store +0 -0
  10. data/HTML/Components/Arabescos.html +87 -0
  11. data/HTML/Components/Buttons.html +105 -0
  12. data/HTML/Components/Card.html +337 -0
  13. data/HTML/Components/CardApp.html +201 -0
  14. data/HTML/Components/Inputs.html +105 -0
  15. data/HTML/Components/Lista.html +106 -0
  16. data/HTML/Components/Pagination.html +218 -0
  17. data/HTML/Components/Pills.html +94 -0
  18. data/HTML/Components/Revisado.html +163 -0
  19. data/JS/prism.js +12 -0
  20. data/bootstrap/scss/_accordion.scss +118 -0
  21. data/bootstrap/scss/_alert.scss +57 -0
  22. data/bootstrap/scss/_badge.scss +29 -0
  23. data/bootstrap/scss/_breadcrumb.scss +28 -0
  24. data/bootstrap/scss/_button-group.scss +139 -0
  25. data/bootstrap/scss/_buttons.scss +111 -0
  26. data/bootstrap/scss/_card.scss +216 -0
  27. data/bootstrap/scss/_carousel.scss +229 -0
  28. data/bootstrap/scss/_close.scss +40 -0
  29. data/bootstrap/scss/_containers.scss +41 -0
  30. data/bootstrap/scss/_dropdown.scss +240 -0
  31. data/bootstrap/scss/_forms.scss +9 -0
  32. data/bootstrap/scss/_functions.scss +302 -0
  33. data/bootstrap/scss/_grid.scss +33 -0
  34. data/bootstrap/scss/_helpers.scss +9 -0
  35. data/bootstrap/scss/_images.scss +42 -0
  36. data/bootstrap/scss/_list-group.scss +174 -0
  37. data/bootstrap/scss/_mixins.scss +43 -0
  38. data/bootstrap/scss/_modal.scss +209 -0
  39. data/bootstrap/scss/_nav.scss +139 -0
  40. data/bootstrap/scss/_navbar.scss +335 -0
  41. data/bootstrap/scss/_offcanvas.scss +83 -0
  42. data/bootstrap/scss/_pagination.scss +64 -0
  43. data/bootstrap/scss/_placeholders.scss +51 -0
  44. data/bootstrap/scss/_popover.scss +158 -0
  45. data/bootstrap/scss/_progress.scss +48 -0
  46. data/bootstrap/scss/_reboot.scss +625 -0
  47. data/bootstrap/scss/_root.scss +54 -0
  48. data/bootstrap/scss/_spinners.scss +69 -0
  49. data/bootstrap/scss/_tables.scss +155 -0
  50. data/bootstrap/scss/_toasts.scss +51 -0
  51. data/bootstrap/scss/_tooltip.scss +115 -0
  52. data/bootstrap/scss/_transitions.scss +27 -0
  53. data/bootstrap/scss/_type.scss +104 -0
  54. data/bootstrap/scss/_utilities.scss +630 -0
  55. data/bootstrap/scss/_variables.scss +1641 -0
  56. data/bootstrap/scss/bootstrap-grid.scss +67 -0
  57. data/bootstrap/scss/bootstrap-reboot.scss +13 -0
  58. data/bootstrap/scss/bootstrap-utilities.scss +18 -0
  59. data/bootstrap/scss/bootstrap.scss +53 -0
  60. data/bootstrap/scss/forms/_floating-labels.scss +63 -0
  61. data/bootstrap/scss/forms/_form-check.scss +152 -0
  62. data/bootstrap/scss/forms/_form-control.scss +219 -0
  63. data/bootstrap/scss/forms/_form-range.scss +91 -0
  64. data/bootstrap/scss/forms/_form-select.scss +72 -0
  65. data/bootstrap/scss/forms/_form-text.scss +11 -0
  66. data/bootstrap/scss/forms/_input-group.scss +121 -0
  67. data/bootstrap/scss/forms/_labels.scss +36 -0
  68. data/bootstrap/scss/forms/_validation.scss +12 -0
  69. data/bootstrap/scss/helpers/_clearfix.scss +3 -0
  70. data/bootstrap/scss/helpers/_colored-links.scss +12 -0
  71. data/bootstrap/scss/helpers/_position.scss +30 -0
  72. data/bootstrap/scss/helpers/_ratio.scss +26 -0
  73. data/bootstrap/scss/helpers/_stacks.scss +15 -0
  74. data/bootstrap/scss/helpers/_stretched-link.scss +15 -0
  75. data/bootstrap/scss/helpers/_text-truncation.scss +7 -0
  76. data/bootstrap/scss/helpers/_visually-hidden.scss +8 -0
  77. data/bootstrap/scss/helpers/_vr.scss +8 -0
  78. data/bootstrap/scss/mixins/_alert.scss +11 -0
  79. data/bootstrap/scss/mixins/_backdrop.scss +14 -0
  80. data/bootstrap/scss/mixins/_border-radius.scss +78 -0
  81. data/bootstrap/scss/mixins/_box-shadow.scss +18 -0
  82. data/bootstrap/scss/mixins/_breakpoints.scss +127 -0
  83. data/bootstrap/scss/mixins/_buttons.scss +133 -0
  84. data/bootstrap/scss/mixins/_caret.scss +64 -0
  85. data/bootstrap/scss/mixins/_clearfix.scss +9 -0
  86. data/bootstrap/scss/mixins/_color-scheme.scss +7 -0
  87. data/bootstrap/scss/mixins/_container.scss +9 -0
  88. data/bootstrap/scss/mixins/_deprecate.scss +10 -0
  89. data/bootstrap/scss/mixins/_forms.scss +144 -0
  90. data/bootstrap/scss/mixins/_gradients.scss +47 -0
  91. data/bootstrap/scss/mixins/_grid.scss +151 -0
  92. data/bootstrap/scss/mixins/_image.scss +16 -0
  93. data/bootstrap/scss/mixins/_list-group.scss +24 -0
  94. data/bootstrap/scss/mixins/_lists.scss +7 -0
  95. data/bootstrap/scss/mixins/_pagination.scss +31 -0
  96. data/bootstrap/scss/mixins/_reset-text.scss +17 -0
  97. data/bootstrap/scss/mixins/_resize.scss +6 -0
  98. data/bootstrap/scss/mixins/_table-variants.scss +21 -0
  99. data/bootstrap/scss/mixins/_text-truncate.scss +8 -0
  100. data/bootstrap/scss/mixins/_transition.scss +26 -0
  101. data/bootstrap/scss/mixins/_utilities.scss +89 -0
  102. data/bootstrap/scss/mixins/_visually-hidden.scss +29 -0
  103. data/bootstrap/scss/utilities/_api.scss +47 -0
  104. data/bootstrap/scss/vendor/_rfs.scss +354 -0
  105. data/css/prism.css +4 -0
  106. data/css/style.css +6 -0
  107. data/gulpfile.js +35 -0
  108. data/img/.DS_Store +0 -0
  109. data/img/arrow-active.png +0 -0
  110. data/img/arrow-disable.png +0 -0
  111. data/img/arrow.png +0 -0
  112. data/img/close.png +0 -0
  113. data/img/phone.png +0 -0
  114. data/img/placeholder.png +0 -0
  115. data/img/placeholder_avatar.png +0 -0
  116. data/img/qr-code-loja.png +0 -0
  117. data/img/store_icon.png +0 -0
  118. data/index.html +33 -0
  119. data/install_nvm.sh +425 -0
  120. data/package-lock.json +4233 -0
  121. data/package.json +9 -0
  122. data/scss/.DS_Store +0 -0
  123. data/scss/guide/.DS_Store +0 -0
  124. data/scss/guide/_variables.scss +171 -0
  125. data/scss/guide/components/_animations.scss +8 -0
  126. data/scss/guide/components/_typography.scss +157 -0
  127. data/scss/guide/components/arabescos/arabescos.scss +47 -0
  128. data/scss/guide/components/buttons/btn.scss +26 -0
  129. data/scss/guide/components/buttons/btn__large.scss +10 -0
  130. data/scss/guide/components/buttons/btn__primary.scss +11 -0
  131. data/scss/guide/components/buttons/btn__secondary.scss +11 -0
  132. data/scss/guide/components/buttons/btn__tertiary.scss +11 -0
  133. data/scss/guide/components/cardapp/cardapp.scss +151 -0
  134. data/scss/guide/components/cards/card.scss +58 -0
  135. data/scss/guide/components/cards/card__horizontal.scss +35 -0
  136. data/scss/guide/components/cards/card__horizontal__small.scss +9 -0
  137. data/scss/guide/components/inputs/_checkbox.scss +45 -0
  138. data/scss/guide/components/inputs/_text.scss +8 -0
  139. data/scss/guide/components/lista/lista.scss +31 -0
  140. data/scss/guide/components/pagination/pagination.scss +81 -0
  141. data/scss/guide/components/pills/pill.scss +31 -0
  142. data/scss/guide/components/pills/pill__full.scss +8 -0
  143. data/scss/guide/components/pills/pill__secundary.scss +8 -0
  144. data/scss/guide/components/pills/pill__small.scss +8 -0
  145. data/scss/guide/components/revisado/revisado.scss +52 -0
  146. data/scss/guide/style.scss +96 -0
  147. metadata +147 -12
  148. data/CODE_OF_CONDUCT.md +0 -74
  149. data/Gemfile +0 -6
  150. data/LICENSE.txt +0 -21
  151. data/Rakefile +0 -2
  152. data/bin/console +0 -14
  153. data/bin/setup +0 -8
  154. data/lib/vitat/css/version.rb +0 -5
  155. data/lib/vitat/css.rb +0 -8
  156. data/vitat-css.gemspec +0 -41
@@ -0,0 +1,1641 @@
1
+ // Variables
2
+ //
3
+ // Variables should follow the `$component-state-property-size` formula for
4
+ // consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
5
+
6
+ // Color system
7
+
8
+ // scss-docs-start gray-color-variables
9
+ $white: #fff !default;
10
+ $gray-100: #f8f9fa !default;
11
+ $gray-200: #e9ecef !default;
12
+ $gray-300: #dee2e6 !default;
13
+ $gray-400: #ced4da !default;
14
+ $gray-500: #adb5bd !default;
15
+ $gray-600: #6c757d !default;
16
+ $gray-700: #495057 !default;
17
+ $gray-800: #343a40 !default;
18
+ $gray-900: #212529 !default;
19
+ $black: #000 !default;
20
+ // scss-docs-end gray-color-variables
21
+
22
+ // fusv-disable
23
+ // scss-docs-start gray-colors-map
24
+ $grays: (
25
+ "100": $gray-100,
26
+ "200": $gray-200,
27
+ "300": $gray-300,
28
+ "400": $gray-400,
29
+ "500": $gray-500,
30
+ "600": $gray-600,
31
+ "700": $gray-700,
32
+ "800": $gray-800,
33
+ "900": $gray-900
34
+ ) !default;
35
+ // scss-docs-end gray-colors-map
36
+ // fusv-enable
37
+
38
+ // scss-docs-start color-variables
39
+ $blue: #0d6efd !default;
40
+ $indigo: #6610f2 !default;
41
+ $purple: #6f42c1 !default;
42
+ $pink: #d63384 !default;
43
+ $red: #dc3545 !default;
44
+ $orange: #fd7e14 !default;
45
+ $yellow: #ffc107 !default;
46
+ $green: #198754 !default;
47
+ $teal: #20c997 !default;
48
+ $cyan: #0dcaf0 !default;
49
+ // scss-docs-end color-variables
50
+
51
+ // scss-docs-start colors-map
52
+ $colors: (
53
+ "blue": $blue,
54
+ "indigo": $indigo,
55
+ "purple": $purple,
56
+ "pink": $pink,
57
+ "red": $red,
58
+ "orange": $orange,
59
+ "yellow": $yellow,
60
+ "green": $green,
61
+ "teal": $teal,
62
+ "cyan": $cyan,
63
+ "white": $white,
64
+ "gray": $gray-600,
65
+ "gray-dark": $gray-800
66
+ ) !default;
67
+ // scss-docs-end colors-map
68
+
69
+ // scss-docs-start theme-color-variables
70
+ $primary: $blue !default;
71
+ $secondary: $gray-600 !default;
72
+ $success: $green !default;
73
+ $info: $cyan !default;
74
+ $warning: $yellow !default;
75
+ $danger: $red !default;
76
+ $light: $gray-100 !default;
77
+ $dark: $gray-900 !default;
78
+ // scss-docs-end theme-color-variables
79
+
80
+ // scss-docs-start theme-colors-map
81
+ $theme-colors: (
82
+ "primary": $primary,
83
+ "secondary": $secondary,
84
+ "success": $success,
85
+ "info": $info,
86
+ "warning": $warning,
87
+ "danger": $danger,
88
+ "light": $light,
89
+ "dark": $dark
90
+ ) !default;
91
+ // scss-docs-end theme-colors-map
92
+
93
+ // scss-docs-start theme-colors-rgb
94
+ $theme-colors-rgb: map-loop($theme-colors, to-rgb, "$value") !default;
95
+ // scss-docs-end theme-colors-rgb
96
+
97
+ // The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.
98
+ // See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
99
+ $min-contrast-ratio: 4.5 !default;
100
+
101
+ // Customize the light and dark text colors for use in our color contrast function.
102
+ $color-contrast-dark: $black !default;
103
+ $color-contrast-light: $white !default;
104
+
105
+ // fusv-disable
106
+ $blue-100: tint-color($blue, 80%) !default;
107
+ $blue-200: tint-color($blue, 60%) !default;
108
+ $blue-300: tint-color($blue, 40%) !default;
109
+ $blue-400: tint-color($blue, 20%) !default;
110
+ $blue-500: $blue !default;
111
+ $blue-600: shade-color($blue, 20%) !default;
112
+ $blue-700: shade-color($blue, 40%) !default;
113
+ $blue-800: shade-color($blue, 60%) !default;
114
+ $blue-900: shade-color($blue, 80%) !default;
115
+
116
+ $indigo-100: tint-color($indigo, 80%) !default;
117
+ $indigo-200: tint-color($indigo, 60%) !default;
118
+ $indigo-300: tint-color($indigo, 40%) !default;
119
+ $indigo-400: tint-color($indigo, 20%) !default;
120
+ $indigo-500: $indigo !default;
121
+ $indigo-600: shade-color($indigo, 20%) !default;
122
+ $indigo-700: shade-color($indigo, 40%) !default;
123
+ $indigo-800: shade-color($indigo, 60%) !default;
124
+ $indigo-900: shade-color($indigo, 80%) !default;
125
+
126
+ $purple-100: tint-color($purple, 80%) !default;
127
+ $purple-200: tint-color($purple, 60%) !default;
128
+ $purple-300: tint-color($purple, 40%) !default;
129
+ $purple-400: tint-color($purple, 20%) !default;
130
+ $purple-500: $purple !default;
131
+ $purple-600: shade-color($purple, 20%) !default;
132
+ $purple-700: shade-color($purple, 40%) !default;
133
+ $purple-800: shade-color($purple, 60%) !default;
134
+ $purple-900: shade-color($purple, 80%) !default;
135
+
136
+ $pink-100: tint-color($pink, 80%) !default;
137
+ $pink-200: tint-color($pink, 60%) !default;
138
+ $pink-300: tint-color($pink, 40%) !default;
139
+ $pink-400: tint-color($pink, 20%) !default;
140
+ $pink-500: $pink !default;
141
+ $pink-600: shade-color($pink, 20%) !default;
142
+ $pink-700: shade-color($pink, 40%) !default;
143
+ $pink-800: shade-color($pink, 60%) !default;
144
+ $pink-900: shade-color($pink, 80%) !default;
145
+
146
+ $red-100: tint-color($red, 80%) !default;
147
+ $red-200: tint-color($red, 60%) !default;
148
+ $red-300: tint-color($red, 40%) !default;
149
+ $red-400: tint-color($red, 20%) !default;
150
+ $red-500: $red !default;
151
+ $red-600: shade-color($red, 20%) !default;
152
+ $red-700: shade-color($red, 40%) !default;
153
+ $red-800: shade-color($red, 60%) !default;
154
+ $red-900: shade-color($red, 80%) !default;
155
+
156
+ $orange-100: tint-color($orange, 80%) !default;
157
+ $orange-200: tint-color($orange, 60%) !default;
158
+ $orange-300: tint-color($orange, 40%) !default;
159
+ $orange-400: tint-color($orange, 20%) !default;
160
+ $orange-500: $orange !default;
161
+ $orange-600: shade-color($orange, 20%) !default;
162
+ $orange-700: shade-color($orange, 40%) !default;
163
+ $orange-800: shade-color($orange, 60%) !default;
164
+ $orange-900: shade-color($orange, 80%) !default;
165
+
166
+ $yellow-100: tint-color($yellow, 80%) !default;
167
+ $yellow-200: tint-color($yellow, 60%) !default;
168
+ $yellow-300: tint-color($yellow, 40%) !default;
169
+ $yellow-400: tint-color($yellow, 20%) !default;
170
+ $yellow-500: $yellow !default;
171
+ $yellow-600: shade-color($yellow, 20%) !default;
172
+ $yellow-700: shade-color($yellow, 40%) !default;
173
+ $yellow-800: shade-color($yellow, 60%) !default;
174
+ $yellow-900: shade-color($yellow, 80%) !default;
175
+
176
+ $green-100: tint-color($green, 80%) !default;
177
+ $green-200: tint-color($green, 60%) !default;
178
+ $green-300: tint-color($green, 40%) !default;
179
+ $green-400: tint-color($green, 20%) !default;
180
+ $green-500: $green !default;
181
+ $green-600: shade-color($green, 20%) !default;
182
+ $green-700: shade-color($green, 40%) !default;
183
+ $green-800: shade-color($green, 60%) !default;
184
+ $green-900: shade-color($green, 80%) !default;
185
+
186
+ $teal-100: tint-color($teal, 80%) !default;
187
+ $teal-200: tint-color($teal, 60%) !default;
188
+ $teal-300: tint-color($teal, 40%) !default;
189
+ $teal-400: tint-color($teal, 20%) !default;
190
+ $teal-500: $teal !default;
191
+ $teal-600: shade-color($teal, 20%) !default;
192
+ $teal-700: shade-color($teal, 40%) !default;
193
+ $teal-800: shade-color($teal, 60%) !default;
194
+ $teal-900: shade-color($teal, 80%) !default;
195
+
196
+ $cyan-100: tint-color($cyan, 80%) !default;
197
+ $cyan-200: tint-color($cyan, 60%) !default;
198
+ $cyan-300: tint-color($cyan, 40%) !default;
199
+ $cyan-400: tint-color($cyan, 20%) !default;
200
+ $cyan-500: $cyan !default;
201
+ $cyan-600: shade-color($cyan, 20%) !default;
202
+ $cyan-700: shade-color($cyan, 40%) !default;
203
+ $cyan-800: shade-color($cyan, 60%) !default;
204
+ $cyan-900: shade-color($cyan, 80%) !default;
205
+
206
+ $blues: (
207
+ "blue-100": $blue-100,
208
+ "blue-200": $blue-200,
209
+ "blue-300": $blue-300,
210
+ "blue-400": $blue-400,
211
+ "blue-500": $blue-500,
212
+ "blue-600": $blue-600,
213
+ "blue-700": $blue-700,
214
+ "blue-800": $blue-800,
215
+ "blue-900": $blue-900
216
+ ) !default;
217
+
218
+ $indigos: (
219
+ "indigo-100": $indigo-100,
220
+ "indigo-200": $indigo-200,
221
+ "indigo-300": $indigo-300,
222
+ "indigo-400": $indigo-400,
223
+ "indigo-500": $indigo-500,
224
+ "indigo-600": $indigo-600,
225
+ "indigo-700": $indigo-700,
226
+ "indigo-800": $indigo-800,
227
+ "indigo-900": $indigo-900
228
+ ) !default;
229
+
230
+ $purples: (
231
+ "purple-100": $purple-200,
232
+ "purple-200": $purple-100,
233
+ "purple-300": $purple-300,
234
+ "purple-400": $purple-400,
235
+ "purple-500": $purple-500,
236
+ "purple-600": $purple-600,
237
+ "purple-700": $purple-700,
238
+ "purple-800": $purple-800,
239
+ "purple-900": $purple-900
240
+ ) !default;
241
+
242
+ $pinks: (
243
+ "pink-100": $pink-100,
244
+ "pink-200": $pink-200,
245
+ "pink-300": $pink-300,
246
+ "pink-400": $pink-400,
247
+ "pink-500": $pink-500,
248
+ "pink-600": $pink-600,
249
+ "pink-700": $pink-700,
250
+ "pink-800": $pink-800,
251
+ "pink-900": $pink-900
252
+ ) !default;
253
+
254
+ $reds: (
255
+ "red-100": $red-100,
256
+ "red-200": $red-200,
257
+ "red-300": $red-300,
258
+ "red-400": $red-400,
259
+ "red-500": $red-500,
260
+ "red-600": $red-600,
261
+ "red-700": $red-700,
262
+ "red-800": $red-800,
263
+ "red-900": $red-900
264
+ ) !default;
265
+
266
+ $oranges: (
267
+ "orange-100": $orange-100,
268
+ "orange-200": $orange-200,
269
+ "orange-300": $orange-300,
270
+ "orange-400": $orange-400,
271
+ "orange-500": $orange-500,
272
+ "orange-600": $orange-600,
273
+ "orange-700": $orange-700,
274
+ "orange-800": $orange-800,
275
+ "orange-900": $orange-900
276
+ ) !default;
277
+
278
+ $yellows: (
279
+ "yellow-100": $yellow-100,
280
+ "yellow-200": $yellow-200,
281
+ "yellow-300": $yellow-300,
282
+ "yellow-400": $yellow-400,
283
+ "yellow-500": $yellow-500,
284
+ "yellow-600": $yellow-600,
285
+ "yellow-700": $yellow-700,
286
+ "yellow-800": $yellow-800,
287
+ "yellow-900": $yellow-900
288
+ ) !default;
289
+
290
+ $greens: (
291
+ "green-100": $green-100,
292
+ "green-200": $green-200,
293
+ "green-300": $green-300,
294
+ "green-400": $green-400,
295
+ "green-500": $green-500,
296
+ "green-600": $green-600,
297
+ "green-700": $green-700,
298
+ "green-800": $green-800,
299
+ "green-900": $green-900
300
+ ) !default;
301
+
302
+ $teals: (
303
+ "teal-100": $teal-100,
304
+ "teal-200": $teal-200,
305
+ "teal-300": $teal-300,
306
+ "teal-400": $teal-400,
307
+ "teal-500": $teal-500,
308
+ "teal-600": $teal-600,
309
+ "teal-700": $teal-700,
310
+ "teal-800": $teal-800,
311
+ "teal-900": $teal-900
312
+ ) !default;
313
+
314
+ $cyans: (
315
+ "cyan-100": $cyan-100,
316
+ "cyan-200": $cyan-200,
317
+ "cyan-300": $cyan-300,
318
+ "cyan-400": $cyan-400,
319
+ "cyan-500": $cyan-500,
320
+ "cyan-600": $cyan-600,
321
+ "cyan-700": $cyan-700,
322
+ "cyan-800": $cyan-800,
323
+ "cyan-900": $cyan-900
324
+ ) !default;
325
+ // fusv-enable
326
+
327
+ // Characters which are escaped by the escape-svg function
328
+ $escaped-characters: (
329
+ ("<", "%3c"),
330
+ (">", "%3e"),
331
+ ("#", "%23"),
332
+ ("(", "%28"),
333
+ (")", "%29"),
334
+ ) !default;
335
+
336
+ // Options
337
+ //
338
+ // Quickly modify global styling by enabling or disabling optional features.
339
+
340
+ $enable-caret: true !default;
341
+ $enable-rounded: true !default;
342
+ $enable-shadows: false !default;
343
+ $enable-gradients: false !default;
344
+ $enable-transitions: true !default;
345
+ $enable-reduced-motion: true !default;
346
+ $enable-smooth-scroll: true !default;
347
+ $enable-grid-classes: true !default;
348
+ $enable-cssgrid: false !default;
349
+ $enable-button-pointers: true !default;
350
+ $enable-rfs: true !default;
351
+ $enable-validation-icons: true !default;
352
+ $enable-negative-margins: false !default;
353
+ $enable-deprecation-messages: true !default;
354
+ $enable-important-utilities: true !default;
355
+
356
+ // Prefix for :root CSS variables
357
+
358
+ $variable-prefix: bs- !default;
359
+
360
+ // Gradient
361
+ //
362
+ // The gradient which is added to components if `$enable-gradients` is `true`
363
+ // This gradient is also added to elements with `.bg-gradient`
364
+ // scss-docs-start variable-gradient
365
+ $gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;
366
+ // scss-docs-end variable-gradient
367
+
368
+ // Spacing
369
+ //
370
+ // Control the default styling of most Bootstrap elements by modifying these
371
+ // variables. Mostly focused on spacing.
372
+ // You can add more entries to the $spacers map, should you need more variation.
373
+
374
+ // scss-docs-start spacer-variables-maps
375
+ $spacer: 1rem !default;
376
+ $spacers: (
377
+ 0: 0,
378
+ 1: $spacer * .25,
379
+ 2: $spacer * .5,
380
+ 3: $spacer,
381
+ 4: $spacer * 1.5,
382
+ 5: $spacer * 3,
383
+ ) !default;
384
+
385
+ $negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;
386
+ // scss-docs-end spacer-variables-maps
387
+
388
+ // Position
389
+ //
390
+ // Define the edge positioning anchors of the position utilities.
391
+
392
+ // scss-docs-start position-map
393
+ $position-values: (
394
+ 0: 0,
395
+ 50: 50%,
396
+ 100: 100%
397
+ ) !default;
398
+ // scss-docs-end position-map
399
+
400
+ // Body
401
+ //
402
+ // Settings for the `<body>` element.
403
+
404
+ $body-bg: $white !default;
405
+ $body-color: $gray-900 !default;
406
+ $body-text-align: null !default;
407
+
408
+ // Utilities maps
409
+ //
410
+ // Extends the default `$theme-colors` maps to help create our utilities.
411
+
412
+ // Come v6, we'll de-dupe these variables. Until then, for backward compatibility, we keep them to reassign.
413
+ // scss-docs-start utilities-colors
414
+ $utilities-colors: $theme-colors-rgb !default;
415
+ // scss-docs-end utilities-colors
416
+
417
+ // scss-docs-start utilities-text-colors
418
+ $utilities-text: map-merge(
419
+ $utilities-colors,
420
+ (
421
+ "black": to-rgb($black),
422
+ "white": to-rgb($white),
423
+ "body": to-rgb($body-color)
424
+ )
425
+ ) !default;
426
+ $utilities-text-colors: map-loop($utilities-text, rgba-css-var, "$key", "text") !default;
427
+ // scss-docs-end utilities-text-colors
428
+
429
+ // scss-docs-start utilities-bg-colors
430
+ $utilities-bg: map-merge(
431
+ $utilities-colors,
432
+ (
433
+ "black": to-rgb($black),
434
+ "white": to-rgb($white),
435
+ "body": to-rgb($body-bg)
436
+ )
437
+ ) !default;
438
+ $utilities-bg-colors: map-loop($utilities-bg, rgba-css-var, "$key", "bg") !default;
439
+ // scss-docs-end utilities-bg-colors
440
+
441
+ // Links
442
+ //
443
+ // Style anchor elements.
444
+
445
+ $link-color: $primary !default;
446
+ $link-decoration: underline !default;
447
+ $link-shade-percentage: 20% !default;
448
+ $link-hover-color: shift-color($link-color, $link-shade-percentage) !default;
449
+ $link-hover-decoration: null !default;
450
+
451
+ $stretched-link-pseudo-element: after !default;
452
+ $stretched-link-z-index: 1 !default;
453
+
454
+ // Paragraphs
455
+ //
456
+ // Style p element.
457
+
458
+ $paragraph-margin-bottom: 1rem !default;
459
+
460
+
461
+ // Grid breakpoints
462
+ //
463
+ // Define the minimum dimensions at which your layout will change,
464
+ // adapting to different screen sizes, for use in media queries.
465
+
466
+ // scss-docs-start grid-breakpoints
467
+ $grid-breakpoints: (
468
+ xs: 0,
469
+ sm: 576px,
470
+ md: 768px,
471
+ lg: 992px,
472
+ xl: 1200px,
473
+ xxl: 1400px
474
+ ) !default;
475
+ // scss-docs-end grid-breakpoints
476
+
477
+ @include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
478
+ @include _assert-starts-at-zero($grid-breakpoints, "$grid-breakpoints");
479
+
480
+
481
+ // Grid containers
482
+ //
483
+ // Define the maximum width of `.container` for different screen sizes.
484
+
485
+ // scss-docs-start container-max-widths
486
+ $container-max-widths: (
487
+ sm: 540px,
488
+ md: 720px,
489
+ lg: 960px,
490
+ xl: 1140px,
491
+ xxl: 1320px
492
+ ) !default;
493
+ // scss-docs-end container-max-widths
494
+
495
+ @include _assert-ascending($container-max-widths, "$container-max-widths");
496
+
497
+
498
+ // Grid columns
499
+ //
500
+ // Set the number of columns and specify the width of the gutters.
501
+
502
+ $grid-columns: 12 !default;
503
+ $grid-gutter-width: 1.5rem !default;
504
+ $grid-row-columns: 6 !default;
505
+
506
+ $gutters: $spacers !default;
507
+
508
+ // Container padding
509
+
510
+ $container-padding-x: $grid-gutter-width * .5 !default;
511
+
512
+
513
+ // Components
514
+ //
515
+ // Define common padding and border radius sizes and more.
516
+
517
+ // scss-docs-start border-variables
518
+ $border-width: 1px !default;
519
+ $border-widths: (
520
+ 1: 1px,
521
+ 2: 2px,
522
+ 3: 3px,
523
+ 4: 4px,
524
+ 5: 5px
525
+ ) !default;
526
+
527
+ $border-color: $gray-300 !default;
528
+ // scss-docs-end border-variables
529
+
530
+ // scss-docs-start border-radius-variables
531
+ $border-radius: .25rem !default;
532
+ $border-radius-sm: .2rem !default;
533
+ $border-radius-lg: .3rem !default;
534
+ $border-radius-pill: 50rem !default;
535
+ // scss-docs-end border-radius-variables
536
+
537
+ // scss-docs-start box-shadow-variables
538
+ $box-shadow: 0 .5rem 1rem rgba($black, .15) !default;
539
+ $box-shadow-sm: 0 .125rem .25rem rgba($black, .075) !default;
540
+ $box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;
541
+ $box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;
542
+ // scss-docs-end box-shadow-variables
543
+
544
+ $component-active-color: $white !default;
545
+ $component-active-bg: $primary !default;
546
+
547
+ // scss-docs-start caret-variables
548
+ $caret-width: .3em !default;
549
+ $caret-vertical-align: $caret-width * .85 !default;
550
+ $caret-spacing: $caret-width * .85 !default;
551
+ // scss-docs-end caret-variables
552
+
553
+ $transition-base: all .2s ease-in-out !default;
554
+ $transition-fade: opacity .15s linear !default;
555
+ // scss-docs-start collapse-transition
556
+ $transition-collapse: height .35s ease !default;
557
+ $transition-collapse-width: width .35s ease !default;
558
+ // scss-docs-end collapse-transition
559
+
560
+ // stylelint-disable function-disallowed-list
561
+ // scss-docs-start aspect-ratios
562
+ $aspect-ratios: (
563
+ "1x1": 100%,
564
+ "4x3": calc(3 / 4 * 100%),
565
+ "16x9": calc(9 / 16 * 100%),
566
+ "21x9": calc(9 / 21 * 100%)
567
+ ) !default;
568
+ // scss-docs-end aspect-ratios
569
+ // stylelint-enable function-disallowed-list
570
+
571
+ // Typography
572
+ //
573
+ // Font, line-height, and color for body text, headings, and more.
574
+
575
+ // scss-docs-start font-variables
576
+ // stylelint-disable value-keyword-case
577
+ $font-family-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
578
+ $font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
579
+ // stylelint-enable value-keyword-case
580
+ $font-family-base: var(--#{$variable-prefix}font-sans-serif) !default;
581
+ $font-family-code: var(--#{$variable-prefix}font-monospace) !default;
582
+
583
+ // $font-size-root affects the value of `rem`, which is used for as well font sizes, paddings, and margins
584
+ // $font-size-base affects the font size of the body text
585
+ $font-size-root: null !default;
586
+ $font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
587
+ $font-size-sm: $font-size-base * .875 !default;
588
+ $font-size-lg: $font-size-base * 1.25 !default;
589
+
590
+ $font-weight-lighter: lighter !default;
591
+ $font-weight-light: 300 !default;
592
+ $font-weight-normal: 400 !default;
593
+ $font-weight-bold: 700 !default;
594
+ $font-weight-bolder: bolder !default;
595
+
596
+ $font-weight-base: $font-weight-normal !default;
597
+
598
+ $line-height-base: 1.5 !default;
599
+ $line-height-sm: 1.25 !default;
600
+ $line-height-lg: 2 !default;
601
+
602
+ $h1-font-size: $font-size-base * 2.5 !default;
603
+ $h2-font-size: $font-size-base * 2 !default;
604
+ $h3-font-size: $font-size-base * 1.75 !default;
605
+ $h4-font-size: $font-size-base * 1.5 !default;
606
+ $h5-font-size: $font-size-base * 1.25 !default;
607
+ $h6-font-size: $font-size-base !default;
608
+ // scss-docs-end font-variables
609
+
610
+ // scss-docs-start font-sizes
611
+ $font-sizes: (
612
+ 1: $h1-font-size,
613
+ 2: $h2-font-size,
614
+ 3: $h3-font-size,
615
+ 4: $h4-font-size,
616
+ 5: $h5-font-size,
617
+ 6: $h6-font-size
618
+ ) !default;
619
+ // scss-docs-end font-sizes
620
+
621
+ // scss-docs-start headings-variables
622
+ $headings-margin-bottom: $spacer * .5 !default;
623
+ $headings-font-family: null !default;
624
+ $headings-font-style: null !default;
625
+ $headings-font-weight: 500 !default;
626
+ $headings-line-height: 1.2 !default;
627
+ $headings-color: null !default;
628
+ // scss-docs-end headings-variables
629
+
630
+ // scss-docs-start display-headings
631
+ $display-font-sizes: (
632
+ 1: 5rem,
633
+ 2: 4.5rem,
634
+ 3: 4rem,
635
+ 4: 3.5rem,
636
+ 5: 3rem,
637
+ 6: 2.5rem
638
+ ) !default;
639
+
640
+ $display-font-weight: 300 !default;
641
+ $display-line-height: $headings-line-height !default;
642
+ // scss-docs-end display-headings
643
+
644
+ // scss-docs-start type-variables
645
+ $lead-font-size: $font-size-base * 1.25 !default;
646
+ $lead-font-weight: 300 !default;
647
+
648
+ $small-font-size: .875em !default;
649
+
650
+ $sub-sup-font-size: .75em !default;
651
+
652
+ $text-muted: $gray-600 !default;
653
+
654
+ $initialism-font-size: $small-font-size !default;
655
+
656
+ $blockquote-margin-y: $spacer !default;
657
+ $blockquote-font-size: $font-size-base * 1.25 !default;
658
+ $blockquote-footer-color: $gray-600 !default;
659
+ $blockquote-footer-font-size: $small-font-size !default;
660
+
661
+ $hr-margin-y: $spacer !default;
662
+ $hr-color: inherit !default;
663
+ $hr-height: $border-width !default;
664
+ $hr-opacity: .25 !default;
665
+
666
+ $legend-margin-bottom: .5rem !default;
667
+ $legend-font-size: 1.5rem !default;
668
+ $legend-font-weight: null !default;
669
+
670
+ $mark-padding: .2em !default;
671
+
672
+ $dt-font-weight: $font-weight-bold !default;
673
+
674
+ $nested-kbd-font-weight: $font-weight-bold !default;
675
+
676
+ $list-inline-padding: .5rem !default;
677
+
678
+ $mark-bg: #fcf8e3 !default;
679
+ // scss-docs-end type-variables
680
+
681
+
682
+ // Tables
683
+ //
684
+ // Customizes the `.table` component with basic values, each used across all table variations.
685
+
686
+ // scss-docs-start table-variables
687
+ $table-cell-padding-y: .5rem !default;
688
+ $table-cell-padding-x: .5rem !default;
689
+ $table-cell-padding-y-sm: .25rem !default;
690
+ $table-cell-padding-x-sm: .25rem !default;
691
+
692
+ $table-cell-vertical-align: top !default;
693
+
694
+ $table-color: $body-color !default;
695
+ $table-bg: transparent !default;
696
+ $table-accent-bg: transparent !default;
697
+
698
+ $table-th-font-weight: null !default;
699
+
700
+ $table-striped-color: $table-color !default;
701
+ $table-striped-bg-factor: .05 !default;
702
+ $table-striped-bg: rgba($black, $table-striped-bg-factor) !default;
703
+
704
+ $table-active-color: $table-color !default;
705
+ $table-active-bg-factor: .1 !default;
706
+ $table-active-bg: rgba($black, $table-active-bg-factor) !default;
707
+
708
+ $table-hover-color: $table-color !default;
709
+ $table-hover-bg-factor: .075 !default;
710
+ $table-hover-bg: rgba($black, $table-hover-bg-factor) !default;
711
+
712
+ $table-border-factor: .1 !default;
713
+ $table-border-width: $border-width !default;
714
+ $table-border-color: $border-color !default;
715
+
716
+ $table-striped-order: odd !default;
717
+
718
+ $table-group-separator-color: currentColor !default;
719
+
720
+ $table-caption-color: $text-muted !default;
721
+
722
+ $table-bg-scale: -80% !default;
723
+ // scss-docs-end table-variables
724
+
725
+ // scss-docs-start table-loop
726
+ $table-variants: (
727
+ "primary": shift-color($primary, $table-bg-scale),
728
+ "secondary": shift-color($secondary, $table-bg-scale),
729
+ "success": shift-color($success, $table-bg-scale),
730
+ "info": shift-color($info, $table-bg-scale),
731
+ "warning": shift-color($warning, $table-bg-scale),
732
+ "danger": shift-color($danger, $table-bg-scale),
733
+ "light": $light,
734
+ "dark": $dark,
735
+ ) !default;
736
+ // scss-docs-end table-loop
737
+
738
+
739
+ // Buttons + Forms
740
+ //
741
+ // Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
742
+
743
+ // scss-docs-start input-btn-variables
744
+ $input-btn-padding-y: .375rem !default;
745
+ $input-btn-padding-x: .75rem !default;
746
+ $input-btn-font-family: null !default;
747
+ $input-btn-font-size: $font-size-base !default;
748
+ $input-btn-line-height: $line-height-base !default;
749
+
750
+ $input-btn-focus-width: .25rem !default;
751
+ $input-btn-focus-color-opacity: .25 !default;
752
+ $input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default;
753
+ $input-btn-focus-blur: 0 !default;
754
+ $input-btn-focus-box-shadow: 0 0 $input-btn-focus-blur $input-btn-focus-width $input-btn-focus-color !default;
755
+
756
+ $input-btn-padding-y-sm: .25rem !default;
757
+ $input-btn-padding-x-sm: .5rem !default;
758
+ $input-btn-font-size-sm: $font-size-sm !default;
759
+
760
+ $input-btn-padding-y-lg: .5rem !default;
761
+ $input-btn-padding-x-lg: 1rem !default;
762
+ $input-btn-font-size-lg: $font-size-lg !default;
763
+
764
+ $input-btn-border-width: $border-width !default;
765
+ // scss-docs-end input-btn-variables
766
+
767
+
768
+ // Buttons
769
+ //
770
+ // For each of Bootstrap's buttons, define text, background, and border color.
771
+
772
+ // scss-docs-start btn-variables
773
+ $btn-padding-y: $input-btn-padding-y !default;
774
+ $btn-padding-x: $input-btn-padding-x !default;
775
+ $btn-font-family: $input-btn-font-family !default;
776
+ $btn-font-size: $input-btn-font-size !default;
777
+ $btn-line-height: $input-btn-line-height !default;
778
+ $btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping
779
+
780
+ $btn-padding-y-sm: $input-btn-padding-y-sm !default;
781
+ $btn-padding-x-sm: $input-btn-padding-x-sm !default;
782
+ $btn-font-size-sm: $input-btn-font-size-sm !default;
783
+
784
+ $btn-padding-y-lg: $input-btn-padding-y-lg !default;
785
+ $btn-padding-x-lg: $input-btn-padding-x-lg !default;
786
+ $btn-font-size-lg: $input-btn-font-size-lg !default;
787
+
788
+ $btn-border-width: $input-btn-border-width !default;
789
+
790
+ $btn-font-weight: $font-weight-normal !default;
791
+ $btn-box-shadow: inset 0 1px 0 rgba($white, .15), 0 1px 1px rgba($black, .075) !default;
792
+ $btn-focus-width: $input-btn-focus-width !default;
793
+ $btn-focus-box-shadow: $input-btn-focus-box-shadow !default;
794
+ $btn-disabled-opacity: .65 !default;
795
+ $btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;
796
+
797
+ $btn-link-color: $link-color !default;
798
+ $btn-link-hover-color: $link-hover-color !default;
799
+ $btn-link-disabled-color: $gray-600 !default;
800
+
801
+ // Allows for customizing button radius independently from global border radius
802
+ $btn-border-radius: $border-radius !default;
803
+ $btn-border-radius-sm: $border-radius-sm !default;
804
+ $btn-border-radius-lg: $border-radius-lg !default;
805
+
806
+ $btn-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
807
+
808
+ $btn-hover-bg-shade-amount: 15% !default;
809
+ $btn-hover-bg-tint-amount: 15% !default;
810
+ $btn-hover-border-shade-amount: 20% !default;
811
+ $btn-hover-border-tint-amount: 10% !default;
812
+ $btn-active-bg-shade-amount: 20% !default;
813
+ $btn-active-bg-tint-amount: 20% !default;
814
+ $btn-active-border-shade-amount: 25% !default;
815
+ $btn-active-border-tint-amount: 10% !default;
816
+ // scss-docs-end btn-variables
817
+
818
+
819
+ // Forms
820
+
821
+ // scss-docs-start form-text-variables
822
+ $form-text-margin-top: .25rem !default;
823
+ $form-text-font-size: $small-font-size !default;
824
+ $form-text-font-style: null !default;
825
+ $form-text-font-weight: null !default;
826
+ $form-text-color: $text-muted !default;
827
+ // scss-docs-end form-text-variables
828
+
829
+ // scss-docs-start form-label-variables
830
+ $form-label-margin-bottom: .5rem !default;
831
+ $form-label-font-size: null !default;
832
+ $form-label-font-style: null !default;
833
+ $form-label-font-weight: null !default;
834
+ $form-label-color: null !default;
835
+ // scss-docs-end form-label-variables
836
+
837
+ // scss-docs-start form-input-variables
838
+ $input-padding-y: $input-btn-padding-y !default;
839
+ $input-padding-x: $input-btn-padding-x !default;
840
+ $input-font-family: $input-btn-font-family !default;
841
+ $input-font-size: $input-btn-font-size !default;
842
+ $input-font-weight: $font-weight-base !default;
843
+ $input-line-height: $input-btn-line-height !default;
844
+
845
+ $input-padding-y-sm: $input-btn-padding-y-sm !default;
846
+ $input-padding-x-sm: $input-btn-padding-x-sm !default;
847
+ $input-font-size-sm: $input-btn-font-size-sm !default;
848
+
849
+ $input-padding-y-lg: $input-btn-padding-y-lg !default;
850
+ $input-padding-x-lg: $input-btn-padding-x-lg !default;
851
+ $input-font-size-lg: $input-btn-font-size-lg !default;
852
+
853
+ $input-bg: $body-bg !default;
854
+ $input-disabled-bg: $gray-200 !default;
855
+ $input-disabled-border-color: null !default;
856
+
857
+ $input-color: $body-color !default;
858
+ $input-border-color: $gray-400 !default;
859
+ $input-border-width: $input-btn-border-width !default;
860
+ $input-box-shadow: $box-shadow-inset !default;
861
+
862
+ $input-border-radius: $border-radius !default;
863
+ $input-border-radius-sm: $border-radius-sm !default;
864
+ $input-border-radius-lg: $border-radius-lg !default;
865
+
866
+ $input-focus-bg: $input-bg !default;
867
+ $input-focus-border-color: tint-color($component-active-bg, 50%) !default;
868
+ $input-focus-color: $input-color !default;
869
+ $input-focus-width: $input-btn-focus-width !default;
870
+ $input-focus-box-shadow: $input-btn-focus-box-shadow !default;
871
+
872
+ $input-placeholder-color: $gray-600 !default;
873
+ $input-plaintext-color: $body-color !default;
874
+
875
+ $input-height-border: $input-border-width * 2 !default;
876
+
877
+ $input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;
878
+ $input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default;
879
+ $input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y * .5) !default;
880
+
881
+ $input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;
882
+ $input-height-sm: add($input-line-height * 1em, add($input-padding-y-sm * 2, $input-height-border, false)) !default;
883
+ $input-height-lg: add($input-line-height * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;
884
+
885
+ $input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
886
+
887
+ $form-color-width: 3rem !default;
888
+ // scss-docs-end form-input-variables
889
+
890
+ // scss-docs-start form-check-variables
891
+ $form-check-input-width: 1em !default;
892
+ $form-check-min-height: $font-size-base * $line-height-base !default;
893
+ $form-check-padding-start: $form-check-input-width + .5em !default;
894
+ $form-check-margin-bottom: .125rem !default;
895
+ $form-check-label-color: null !default;
896
+ $form-check-label-cursor: null !default;
897
+ $form-check-transition: null !default;
898
+
899
+ $form-check-input-active-filter: brightness(90%) !default;
900
+
901
+ $form-check-input-bg: $input-bg !default;
902
+ $form-check-input-border: 1px solid rgba($black, .25) !default;
903
+ $form-check-input-border-radius: .25em !default;
904
+ $form-check-radio-border-radius: 50% !default;
905
+ $form-check-input-focus-border: $input-focus-border-color !default;
906
+ $form-check-input-focus-box-shadow: $input-btn-focus-box-shadow !default;
907
+
908
+ $form-check-input-checked-color: $component-active-color !default;
909
+ $form-check-input-checked-bg-color: $component-active-bg !default;
910
+ $form-check-input-checked-border-color: $form-check-input-checked-bg-color !default;
911
+ $form-check-input-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$form-check-input-checked-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/></svg>") !default;
912
+ $form-check-radio-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='2' fill='#{$form-check-input-checked-color}'/></svg>") !default;
913
+
914
+ $form-check-input-indeterminate-color: $component-active-color !default;
915
+ $form-check-input-indeterminate-bg-color: $component-active-bg !default;
916
+ $form-check-input-indeterminate-border-color: $form-check-input-indeterminate-bg-color !default;
917
+ $form-check-input-indeterminate-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='none' stroke='#{$form-check-input-indeterminate-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/></svg>") !default;
918
+
919
+ $form-check-input-disabled-opacity: .5 !default;
920
+ $form-check-label-disabled-opacity: $form-check-input-disabled-opacity !default;
921
+ $form-check-btn-check-disabled-opacity: $btn-disabled-opacity !default;
922
+
923
+ $form-check-inline-margin-end: 1rem !default;
924
+ // scss-docs-end form-check-variables
925
+
926
+ // scss-docs-start form-switch-variables
927
+ $form-switch-color: rgba($black, .25) !default;
928
+ $form-switch-width: 2em !default;
929
+ $form-switch-padding-start: $form-switch-width + .5em !default;
930
+ $form-switch-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-color}'/></svg>") !default;
931
+ $form-switch-border-radius: $form-switch-width !default;
932
+ $form-switch-transition: background-position .15s ease-in-out !default;
933
+
934
+ $form-switch-focus-color: $input-focus-border-color !default;
935
+ $form-switch-focus-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-focus-color}'/></svg>") !default;
936
+
937
+ $form-switch-checked-color: $component-active-color !default;
938
+ $form-switch-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='#{$form-switch-checked-color}'/></svg>") !default;
939
+ $form-switch-checked-bg-position: right center !default;
940
+ // scss-docs-end form-switch-variables
941
+
942
+ // scss-docs-start input-group-variables
943
+ $input-group-addon-padding-y: $input-padding-y !default;
944
+ $input-group-addon-padding-x: $input-padding-x !default;
945
+ $input-group-addon-font-weight: $input-font-weight !default;
946
+ $input-group-addon-color: $input-color !default;
947
+ $input-group-addon-bg: $gray-200 !default;
948
+ $input-group-addon-border-color: $input-border-color !default;
949
+ // scss-docs-end input-group-variables
950
+
951
+ // scss-docs-start form-select-variables
952
+ $form-select-padding-y: $input-padding-y !default;
953
+ $form-select-padding-x: $input-padding-x !default;
954
+ $form-select-font-family: $input-font-family !default;
955
+ $form-select-font-size: $input-font-size !default;
956
+ $form-select-indicator-padding: $form-select-padding-x * 3 !default; // Extra padding for background-image
957
+ $form-select-font-weight: $input-font-weight !default;
958
+ $form-select-line-height: $input-line-height !default;
959
+ $form-select-color: $input-color !default;
960
+ $form-select-bg: $input-bg !default;
961
+ $form-select-disabled-color: null !default;
962
+ $form-select-disabled-bg: $gray-200 !default;
963
+ $form-select-disabled-border-color: $input-disabled-border-color !default;
964
+ $form-select-bg-position: right $form-select-padding-x center !default;
965
+ $form-select-bg-size: 16px 12px !default; // In pixels because image dimensions
966
+ $form-select-indicator-color: $gray-800 !default;
967
+ $form-select-indicator: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path fill='none' stroke='#{$form-select-indicator-color}' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/></svg>") !default;
968
+
969
+ $form-select-feedback-icon-padding-end: $form-select-padding-x * 2.5 + $form-select-indicator-padding !default;
970
+ $form-select-feedback-icon-position: center right $form-select-indicator-padding !default;
971
+ $form-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;
972
+
973
+ $form-select-border-width: $input-border-width !default;
974
+ $form-select-border-color: $input-border-color !default;
975
+ $form-select-border-radius: $input-border-radius !default;
976
+ $form-select-box-shadow: $box-shadow-inset !default;
977
+
978
+ $form-select-focus-border-color: $input-focus-border-color !default;
979
+ $form-select-focus-width: $input-focus-width !default;
980
+ $form-select-focus-box-shadow: 0 0 0 $form-select-focus-width $input-btn-focus-color !default;
981
+
982
+ $form-select-padding-y-sm: $input-padding-y-sm !default;
983
+ $form-select-padding-x-sm: $input-padding-x-sm !default;
984
+ $form-select-font-size-sm: $input-font-size-sm !default;
985
+ $form-select-border-radius-sm: $input-border-radius-sm !default;
986
+
987
+ $form-select-padding-y-lg: $input-padding-y-lg !default;
988
+ $form-select-padding-x-lg: $input-padding-x-lg !default;
989
+ $form-select-font-size-lg: $input-font-size-lg !default;
990
+ $form-select-border-radius-lg: $input-border-radius-lg !default;
991
+
992
+ $form-select-transition: $input-transition !default;
993
+ // scss-docs-end form-select-variables
994
+
995
+ // scss-docs-start form-range-variables
996
+ $form-range-track-width: 100% !default;
997
+ $form-range-track-height: .5rem !default;
998
+ $form-range-track-cursor: pointer !default;
999
+ $form-range-track-bg: $gray-300 !default;
1000
+ $form-range-track-border-radius: 1rem !default;
1001
+ $form-range-track-box-shadow: $box-shadow-inset !default;
1002
+
1003
+ $form-range-thumb-width: 1rem !default;
1004
+ $form-range-thumb-height: $form-range-thumb-width !default;
1005
+ $form-range-thumb-bg: $component-active-bg !default;
1006
+ $form-range-thumb-border: 0 !default;
1007
+ $form-range-thumb-border-radius: 1rem !default;
1008
+ $form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;
1009
+ $form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;
1010
+ $form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge
1011
+ $form-range-thumb-active-bg: tint-color($component-active-bg, 70%) !default;
1012
+ $form-range-thumb-disabled-bg: $gray-500 !default;
1013
+ $form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
1014
+ // scss-docs-end form-range-variables
1015
+
1016
+ // scss-docs-start form-file-variables
1017
+ $form-file-button-color: $input-color !default;
1018
+ $form-file-button-bg: $input-group-addon-bg !default;
1019
+ $form-file-button-hover-bg: shade-color($form-file-button-bg, 5%) !default;
1020
+ // scss-docs-end form-file-variables
1021
+
1022
+ // scss-docs-start form-floating-variables
1023
+ $form-floating-height: add(3.5rem, $input-height-border) !default;
1024
+ $form-floating-line-height: 1.25 !default;
1025
+ $form-floating-padding-x: $input-padding-x !default;
1026
+ $form-floating-padding-y: 1rem !default;
1027
+ $form-floating-input-padding-t: 1.625rem !default;
1028
+ $form-floating-input-padding-b: .625rem !default;
1029
+ $form-floating-label-opacity: .65 !default;
1030
+ $form-floating-label-transform: scale(.85) translateY(-.5rem) translateX(.15rem) !default;
1031
+ $form-floating-transition: opacity .1s ease-in-out, transform .1s ease-in-out !default;
1032
+ // scss-docs-end form-floating-variables
1033
+
1034
+ // Form validation
1035
+
1036
+ // scss-docs-start form-feedback-variables
1037
+ $form-feedback-margin-top: $form-text-margin-top !default;
1038
+ $form-feedback-font-size: $form-text-font-size !default;
1039
+ $form-feedback-font-style: $form-text-font-style !default;
1040
+ $form-feedback-valid-color: $success !default;
1041
+ $form-feedback-invalid-color: $danger !default;
1042
+
1043
+ $form-feedback-icon-valid-color: $form-feedback-valid-color !default;
1044
+ $form-feedback-icon-valid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><path fill='#{$form-feedback-icon-valid-color}' 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'/></svg>") !default;
1045
+ $form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;
1046
+ $form-feedback-icon-invalid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='#{$form-feedback-icon-invalid-color}'><circle cx='6' cy='6' r='4.5'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='#{$form-feedback-icon-invalid-color}' stroke='none'/></svg>") !default;
1047
+ // scss-docs-end form-feedback-variables
1048
+
1049
+ // scss-docs-start form-validation-states
1050
+ $form-validation-states: (
1051
+ "valid": (
1052
+ "color": $form-feedback-valid-color,
1053
+ "icon": $form-feedback-icon-valid
1054
+ ),
1055
+ "invalid": (
1056
+ "color": $form-feedback-invalid-color,
1057
+ "icon": $form-feedback-icon-invalid
1058
+ )
1059
+ ) !default;
1060
+ // scss-docs-end form-validation-states
1061
+
1062
+ // Z-index master list
1063
+ //
1064
+ // Warning: Avoid customizing these values. They're used for a bird's eye view
1065
+ // of components dependent on the z-axis and are designed to all work together.
1066
+
1067
+ // scss-docs-start zindex-stack
1068
+ $zindex-dropdown: 1000 !default;
1069
+ $zindex-sticky: 1020 !default;
1070
+ $zindex-fixed: 1030 !default;
1071
+ $zindex-offcanvas-backdrop: 1040 !default;
1072
+ $zindex-offcanvas: 1045 !default;
1073
+ $zindex-modal-backdrop: 1050 !default;
1074
+ $zindex-modal: 1055 !default;
1075
+ $zindex-popover: 1070 !default;
1076
+ $zindex-tooltip: 1080 !default;
1077
+ // scss-docs-end zindex-stack
1078
+
1079
+
1080
+ // Navs
1081
+
1082
+ // scss-docs-start nav-variables
1083
+ $nav-link-padding-y: .5rem !default;
1084
+ $nav-link-padding-x: 1rem !default;
1085
+ $nav-link-font-size: null !default;
1086
+ $nav-link-font-weight: null !default;
1087
+ $nav-link-color: $link-color !default;
1088
+ $nav-link-hover-color: $link-hover-color !default;
1089
+ $nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;
1090
+ $nav-link-disabled-color: $gray-600 !default;
1091
+
1092
+ $nav-tabs-border-color: $gray-300 !default;
1093
+ $nav-tabs-border-width: $border-width !default;
1094
+ $nav-tabs-border-radius: $border-radius !default;
1095
+ $nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default;
1096
+ $nav-tabs-link-active-color: $gray-700 !default;
1097
+ $nav-tabs-link-active-bg: $body-bg !default;
1098
+ $nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;
1099
+
1100
+ $nav-pills-border-radius: $border-radius !default;
1101
+ $nav-pills-link-active-color: $component-active-color !default;
1102
+ $nav-pills-link-active-bg: $component-active-bg !default;
1103
+ // scss-docs-end nav-variables
1104
+
1105
+
1106
+ // Navbar
1107
+
1108
+ // scss-docs-start navbar-variables
1109
+ $navbar-padding-y: $spacer * .5 !default;
1110
+ $navbar-padding-x: null !default;
1111
+
1112
+ $navbar-nav-link-padding-x: .5rem !default;
1113
+
1114
+ $navbar-brand-font-size: $font-size-lg !default;
1115
+ // Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
1116
+ $nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
1117
+ $navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;
1118
+ $navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * .5 !default;
1119
+ $navbar-brand-margin-end: 1rem !default;
1120
+
1121
+ $navbar-toggler-padding-y: .25rem !default;
1122
+ $navbar-toggler-padding-x: .75rem !default;
1123
+ $navbar-toggler-font-size: $font-size-lg !default;
1124
+ $navbar-toggler-border-radius: $btn-border-radius !default;
1125
+ $navbar-toggler-focus-width: $btn-focus-width !default;
1126
+ $navbar-toggler-transition: box-shadow .15s ease-in-out !default;
1127
+ // scss-docs-end navbar-variables
1128
+
1129
+ // scss-docs-start navbar-theme-variables
1130
+ $navbar-dark-color: rgba($white, .55) !default;
1131
+ $navbar-dark-hover-color: rgba($white, .75) !default;
1132
+ $navbar-dark-active-color: $white !default;
1133
+ $navbar-dark-disabled-color: rgba($white, .25) !default;
1134
+ $navbar-dark-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-dark-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
1135
+ $navbar-dark-toggler-border-color: rgba($white, .1) !default;
1136
+
1137
+ $navbar-light-color: rgba($black, .55) !default;
1138
+ $navbar-light-hover-color: rgba($black, .7) !default;
1139
+ $navbar-light-active-color: rgba($black, .9) !default;
1140
+ $navbar-light-disabled-color: rgba($black, .3) !default;
1141
+ $navbar-light-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='#{$navbar-light-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
1142
+ $navbar-light-toggler-border-color: rgba($black, .1) !default;
1143
+
1144
+ $navbar-light-brand-color: $navbar-light-active-color !default;
1145
+ $navbar-light-brand-hover-color: $navbar-light-active-color !default;
1146
+ $navbar-dark-brand-color: $navbar-dark-active-color !default;
1147
+ $navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
1148
+ // scss-docs-end navbar-theme-variables
1149
+
1150
+
1151
+ // Dropdowns
1152
+ //
1153
+ // Dropdown menu container and contents.
1154
+
1155
+ // scss-docs-start dropdown-variables
1156
+ $dropdown-min-width: 10rem !default;
1157
+ $dropdown-padding-x: 0 !default;
1158
+ $dropdown-padding-y: .5rem !default;
1159
+ $dropdown-spacer: .125rem !default;
1160
+ $dropdown-font-size: $font-size-base !default;
1161
+ $dropdown-color: $body-color !default;
1162
+ $dropdown-bg: $white !default;
1163
+ $dropdown-border-color: rgba($black, .15) !default;
1164
+ $dropdown-border-radius: $border-radius !default;
1165
+ $dropdown-border-width: $border-width !default;
1166
+ $dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;
1167
+ $dropdown-divider-bg: $dropdown-border-color !default;
1168
+ $dropdown-divider-margin-y: $spacer * .5 !default;
1169
+ $dropdown-box-shadow: $box-shadow !default;
1170
+
1171
+ $dropdown-link-color: $gray-900 !default;
1172
+ $dropdown-link-hover-color: shade-color($dropdown-link-color, 10%) !default;
1173
+ $dropdown-link-hover-bg: $gray-200 !default;
1174
+
1175
+ $dropdown-link-active-color: $component-active-color !default;
1176
+ $dropdown-link-active-bg: $component-active-bg !default;
1177
+
1178
+ $dropdown-link-disabled-color: $gray-500 !default;
1179
+
1180
+ $dropdown-item-padding-y: $spacer * .25 !default;
1181
+ $dropdown-item-padding-x: $spacer !default;
1182
+
1183
+ $dropdown-header-color: $gray-600 !default;
1184
+ $dropdown-header-padding: $dropdown-padding-y $dropdown-item-padding-x !default;
1185
+ // scss-docs-end dropdown-variables
1186
+
1187
+ // scss-docs-start dropdown-dark-variables
1188
+ $dropdown-dark-color: $gray-300 !default;
1189
+ $dropdown-dark-bg: $gray-800 !default;
1190
+ $dropdown-dark-border-color: $dropdown-border-color !default;
1191
+ $dropdown-dark-divider-bg: $dropdown-divider-bg !default;
1192
+ $dropdown-dark-box-shadow: null !default;
1193
+ $dropdown-dark-link-color: $dropdown-dark-color !default;
1194
+ $dropdown-dark-link-hover-color: $white !default;
1195
+ $dropdown-dark-link-hover-bg: rgba($white, .15) !default;
1196
+ $dropdown-dark-link-active-color: $dropdown-link-active-color !default;
1197
+ $dropdown-dark-link-active-bg: $dropdown-link-active-bg !default;
1198
+ $dropdown-dark-link-disabled-color: $gray-500 !default;
1199
+ $dropdown-dark-header-color: $gray-500 !default;
1200
+ // scss-docs-end dropdown-dark-variables
1201
+
1202
+
1203
+ // Pagination
1204
+
1205
+ // scss-docs-start pagination-variables
1206
+ $pagination-padding-y: .375rem !default;
1207
+ $pagination-padding-x: .75rem !default;
1208
+ $pagination-padding-y-sm: .25rem !default;
1209
+ $pagination-padding-x-sm: .5rem !default;
1210
+ $pagination-padding-y-lg: .75rem !default;
1211
+ $pagination-padding-x-lg: 1.5rem !default;
1212
+
1213
+ $pagination-color: $link-color !default;
1214
+ $pagination-bg: $white !default;
1215
+ $pagination-border-width: $border-width !default;
1216
+ $pagination-border-radius: $border-radius !default;
1217
+ $pagination-margin-start: -$pagination-border-width !default;
1218
+ $pagination-border-color: $gray-300 !default;
1219
+
1220
+ $pagination-focus-color: $link-hover-color !default;
1221
+ $pagination-focus-bg: $gray-200 !default;
1222
+ $pagination-focus-box-shadow: $input-btn-focus-box-shadow !default;
1223
+ $pagination-focus-outline: 0 !default;
1224
+
1225
+ $pagination-hover-color: $link-hover-color !default;
1226
+ $pagination-hover-bg: $gray-200 !default;
1227
+ $pagination-hover-border-color: $gray-300 !default;
1228
+
1229
+ $pagination-active-color: $component-active-color !default;
1230
+ $pagination-active-bg: $component-active-bg !default;
1231
+ $pagination-active-border-color: $pagination-active-bg !default;
1232
+
1233
+ $pagination-disabled-color: $gray-600 !default;
1234
+ $pagination-disabled-bg: $white !default;
1235
+ $pagination-disabled-border-color: $gray-300 !default;
1236
+
1237
+ $pagination-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
1238
+
1239
+ $pagination-border-radius-sm: $border-radius-sm !default;
1240
+ $pagination-border-radius-lg: $border-radius-lg !default;
1241
+ // scss-docs-end pagination-variables
1242
+
1243
+
1244
+ // Placeholders
1245
+
1246
+ // scss-docs-start placeholders
1247
+ $placeholder-opacity-max: .5 !default;
1248
+ $placeholder-opacity-min: .2 !default;
1249
+ // scss-docs-end placeholders
1250
+
1251
+ // Cards
1252
+
1253
+ // scss-docs-start card-variables
1254
+ $card-spacer-y: $spacer !default;
1255
+ $card-spacer-x: $spacer !default;
1256
+ $card-title-spacer-y: $spacer * .5 !default;
1257
+ $card-border-width: $border-width !default;
1258
+ $card-border-color: rgba($black, .125) !default;
1259
+ $card-border-radius: $border-radius !default;
1260
+ $card-box-shadow: null !default;
1261
+ $card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;
1262
+ $card-cap-padding-y: $card-spacer-y * .5 !default;
1263
+ $card-cap-padding-x: $card-spacer-x !default;
1264
+ $card-cap-bg: rgba($black, .03) !default;
1265
+ $card-cap-color: null !default;
1266
+ $card-height: null !default;
1267
+ $card-color: null !default;
1268
+ $card-bg: $white !default;
1269
+ $card-img-overlay-padding: $spacer !default;
1270
+ $card-group-margin: $grid-gutter-width * .5 !default;
1271
+ // scss-docs-end card-variables
1272
+
1273
+ // Accordion
1274
+
1275
+ // scss-docs-start accordion-variables
1276
+ $accordion-padding-y: 1rem !default;
1277
+ $accordion-padding-x: 1.25rem !default;
1278
+ $accordion-color: $body-color !default;
1279
+ $accordion-bg: $body-bg !default;
1280
+ $accordion-border-width: $border-width !default;
1281
+ $accordion-border-color: rgba($black, .125) !default;
1282
+ $accordion-border-radius: $border-radius !default;
1283
+ $accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width) !default;
1284
+
1285
+ $accordion-body-padding-y: $accordion-padding-y !default;
1286
+ $accordion-body-padding-x: $accordion-padding-x !default;
1287
+
1288
+ $accordion-button-padding-y: $accordion-padding-y !default;
1289
+ $accordion-button-padding-x: $accordion-padding-x !default;
1290
+ $accordion-button-color: $accordion-color !default;
1291
+ $accordion-button-bg: $accordion-bg !default;
1292
+ $accordion-transition: $btn-transition, border-radius .15s ease !default;
1293
+ $accordion-button-active-bg: tint-color($component-active-bg, 90%) !default;
1294
+ $accordion-button-active-color: shade-color($primary, 10%) !default;
1295
+
1296
+ $accordion-button-focus-border-color: $input-focus-border-color !default;
1297
+ $accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;
1298
+
1299
+ $accordion-icon-width: 1.25rem !default;
1300
+ $accordion-icon-color: $accordion-button-color !default;
1301
+ $accordion-icon-active-color: $accordion-button-active-color !default;
1302
+ $accordion-icon-transition: transform .2s ease-in-out !default;
1303
+ $accordion-icon-transform: rotate(-180deg) !default;
1304
+
1305
+ $accordion-button-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-color}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !default;
1306
+ $accordion-button-active-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-active-color}'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !default;
1307
+ // scss-docs-end accordion-variables
1308
+
1309
+ // Tooltips
1310
+
1311
+ // scss-docs-start tooltip-variables
1312
+ $tooltip-font-size: $font-size-sm !default;
1313
+ $tooltip-max-width: 200px !default;
1314
+ $tooltip-color: $white !default;
1315
+ $tooltip-bg: $black !default;
1316
+ $tooltip-border-radius: $border-radius !default;
1317
+ $tooltip-opacity: .9 !default;
1318
+ $tooltip-padding-y: $spacer * .25 !default;
1319
+ $tooltip-padding-x: $spacer * .5 !default;
1320
+ $tooltip-margin: 0 !default;
1321
+
1322
+ $tooltip-arrow-width: .8rem !default;
1323
+ $tooltip-arrow-height: .4rem !default;
1324
+ $tooltip-arrow-color: $tooltip-bg !default;
1325
+ // scss-docs-end tooltip-variables
1326
+
1327
+ // Form tooltips must come after regular tooltips
1328
+ // scss-docs-start tooltip-feedback-variables
1329
+ $form-feedback-tooltip-padding-y: $tooltip-padding-y !default;
1330
+ $form-feedback-tooltip-padding-x: $tooltip-padding-x !default;
1331
+ $form-feedback-tooltip-font-size: $tooltip-font-size !default;
1332
+ $form-feedback-tooltip-line-height: null !default;
1333
+ $form-feedback-tooltip-opacity: $tooltip-opacity !default;
1334
+ $form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
1335
+ // scss-docs-end tooltip-feedback-variables
1336
+
1337
+
1338
+ // Popovers
1339
+
1340
+ // scss-docs-start popover-variables
1341
+ $popover-font-size: $font-size-sm !default;
1342
+ $popover-bg: $white !default;
1343
+ $popover-max-width: 276px !default;
1344
+ $popover-border-width: $border-width !default;
1345
+ $popover-border-color: rgba($black, .2) !default;
1346
+ $popover-border-radius: $border-radius-lg !default;
1347
+ $popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;
1348
+ $popover-box-shadow: $box-shadow !default;
1349
+
1350
+ $popover-header-bg: shade-color($popover-bg, 6%) !default;
1351
+ $popover-header-color: $headings-color !default;
1352
+ $popover-header-padding-y: .5rem !default;
1353
+ $popover-header-padding-x: $spacer !default;
1354
+
1355
+ $popover-body-color: $body-color !default;
1356
+ $popover-body-padding-y: $spacer !default;
1357
+ $popover-body-padding-x: $spacer !default;
1358
+
1359
+ $popover-arrow-width: 1rem !default;
1360
+ $popover-arrow-height: .5rem !default;
1361
+ $popover-arrow-color: $popover-bg !default;
1362
+
1363
+ $popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;
1364
+ // scss-docs-end popover-variables
1365
+
1366
+
1367
+ // Toasts
1368
+
1369
+ // scss-docs-start toast-variables
1370
+ $toast-max-width: 350px !default;
1371
+ $toast-padding-x: .75rem !default;
1372
+ $toast-padding-y: .5rem !default;
1373
+ $toast-font-size: .875rem !default;
1374
+ $toast-color: null !default;
1375
+ $toast-background-color: rgba($white, .85) !default;
1376
+ $toast-border-width: 1px !default;
1377
+ $toast-border-color: rgba($black, .1) !default;
1378
+ $toast-border-radius: $border-radius !default;
1379
+ $toast-box-shadow: $box-shadow !default;
1380
+ $toast-spacing: $container-padding-x !default;
1381
+
1382
+ $toast-header-color: $gray-600 !default;
1383
+ $toast-header-background-color: rgba($white, .85) !default;
1384
+ $toast-header-border-color: rgba($black, .05) !default;
1385
+ // scss-docs-end toast-variables
1386
+
1387
+
1388
+ // Badges
1389
+
1390
+ // scss-docs-start badge-variables
1391
+ $badge-font-size: .75em !default;
1392
+ $badge-font-weight: $font-weight-bold !default;
1393
+ $badge-color: $white !default;
1394
+ $badge-padding-y: .35em !default;
1395
+ $badge-padding-x: .65em !default;
1396
+ $badge-border-radius: $border-radius !default;
1397
+ // scss-docs-end badge-variables
1398
+
1399
+
1400
+ // Modals
1401
+
1402
+ // scss-docs-start modal-variables
1403
+ $modal-inner-padding: $spacer !default;
1404
+
1405
+ $modal-footer-margin-between: .5rem !default;
1406
+
1407
+ $modal-dialog-margin: .5rem !default;
1408
+ $modal-dialog-margin-y-sm-up: 1.75rem !default;
1409
+
1410
+ $modal-title-line-height: $line-height-base !default;
1411
+
1412
+ $modal-content-color: null !default;
1413
+ $modal-content-bg: $white !default;
1414
+ $modal-content-border-color: rgba($black, .2) !default;
1415
+ $modal-content-border-width: $border-width !default;
1416
+ $modal-content-border-radius: $border-radius-lg !default;
1417
+ $modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;
1418
+ $modal-content-box-shadow-xs: $box-shadow-sm !default;
1419
+ $modal-content-box-shadow-sm-up: $box-shadow !default;
1420
+
1421
+ $modal-backdrop-bg: $black !default;
1422
+ $modal-backdrop-opacity: .5 !default;
1423
+ $modal-header-border-color: $border-color !default;
1424
+ $modal-footer-border-color: $modal-header-border-color !default;
1425
+ $modal-header-border-width: $modal-content-border-width !default;
1426
+ $modal-footer-border-width: $modal-header-border-width !default;
1427
+ $modal-header-padding-y: $modal-inner-padding !default;
1428
+ $modal-header-padding-x: $modal-inner-padding !default;
1429
+ $modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility
1430
+
1431
+ $modal-sm: 300px !default;
1432
+ $modal-md: 500px !default;
1433
+ $modal-lg: 800px !default;
1434
+ $modal-xl: 1140px !default;
1435
+
1436
+ $modal-fade-transform: translate(0, -50px) !default;
1437
+ $modal-show-transform: none !default;
1438
+ $modal-transition: transform .3s ease-out !default;
1439
+ $modal-scale-transform: scale(1.02) !default;
1440
+ // scss-docs-end modal-variables
1441
+
1442
+
1443
+ // Alerts
1444
+ //
1445
+ // Define alert colors, border radius, and padding.
1446
+
1447
+ // scss-docs-start alert-variables
1448
+ $alert-padding-y: $spacer !default;
1449
+ $alert-padding-x: $spacer !default;
1450
+ $alert-margin-bottom: 1rem !default;
1451
+ $alert-border-radius: $border-radius !default;
1452
+ $alert-link-font-weight: $font-weight-bold !default;
1453
+ $alert-border-width: $border-width !default;
1454
+ $alert-bg-scale: -80% !default;
1455
+ $alert-border-scale: -70% !default;
1456
+ $alert-color-scale: 40% !default;
1457
+ $alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side
1458
+ // scss-docs-end alert-variables
1459
+
1460
+
1461
+ // Progress bars
1462
+
1463
+ // scss-docs-start progress-variables
1464
+ $progress-height: 1rem !default;
1465
+ $progress-font-size: $font-size-base * .75 !default;
1466
+ $progress-bg: $gray-200 !default;
1467
+ $progress-border-radius: $border-radius !default;
1468
+ $progress-box-shadow: $box-shadow-inset !default;
1469
+ $progress-bar-color: $white !default;
1470
+ $progress-bar-bg: $primary !default;
1471
+ $progress-bar-animation-timing: 1s linear infinite !default;
1472
+ $progress-bar-transition: width .6s ease !default;
1473
+ // scss-docs-end progress-variables
1474
+
1475
+
1476
+ // List group
1477
+
1478
+ // scss-docs-start list-group-variables
1479
+ $list-group-color: $gray-900 !default;
1480
+ $list-group-bg: $white !default;
1481
+ $list-group-border-color: rgba($black, .125) !default;
1482
+ $list-group-border-width: $border-width !default;
1483
+ $list-group-border-radius: $border-radius !default;
1484
+
1485
+ $list-group-item-padding-y: $spacer * .5 !default;
1486
+ $list-group-item-padding-x: $spacer !default;
1487
+ $list-group-item-bg-scale: -80% !default;
1488
+ $list-group-item-color-scale: 40% !default;
1489
+
1490
+ $list-group-hover-bg: $gray-100 !default;
1491
+ $list-group-active-color: $component-active-color !default;
1492
+ $list-group-active-bg: $component-active-bg !default;
1493
+ $list-group-active-border-color: $list-group-active-bg !default;
1494
+
1495
+ $list-group-disabled-color: $gray-600 !default;
1496
+ $list-group-disabled-bg: $list-group-bg !default;
1497
+
1498
+ $list-group-action-color: $gray-700 !default;
1499
+ $list-group-action-hover-color: $list-group-action-color !default;
1500
+
1501
+ $list-group-action-active-color: $body-color !default;
1502
+ $list-group-action-active-bg: $gray-200 !default;
1503
+ // scss-docs-end list-group-variables
1504
+
1505
+
1506
+ // Image thumbnails
1507
+
1508
+ // scss-docs-start thumbnail-variables
1509
+ $thumbnail-padding: .25rem !default;
1510
+ $thumbnail-bg: $body-bg !default;
1511
+ $thumbnail-border-width: $border-width !default;
1512
+ $thumbnail-border-color: $gray-300 !default;
1513
+ $thumbnail-border-radius: $border-radius !default;
1514
+ $thumbnail-box-shadow: $box-shadow-sm !default;
1515
+ // scss-docs-end thumbnail-variables
1516
+
1517
+
1518
+ // Figures
1519
+
1520
+ // scss-docs-start figure-variables
1521
+ $figure-caption-font-size: $small-font-size !default;
1522
+ $figure-caption-color: $gray-600 !default;
1523
+ // scss-docs-end figure-variables
1524
+
1525
+
1526
+ // Breadcrumbs
1527
+
1528
+ // scss-docs-start breadcrumb-variables
1529
+ $breadcrumb-font-size: null !default;
1530
+ $breadcrumb-padding-y: 0 !default;
1531
+ $breadcrumb-padding-x: 0 !default;
1532
+ $breadcrumb-item-padding-x: .5rem !default;
1533
+ $breadcrumb-margin-bottom: 1rem !default;
1534
+ $breadcrumb-bg: null !default;
1535
+ $breadcrumb-divider-color: $gray-600 !default;
1536
+ $breadcrumb-active-color: $gray-600 !default;
1537
+ $breadcrumb-divider: quote("/") !default;
1538
+ $breadcrumb-divider-flipped: $breadcrumb-divider !default;
1539
+ $breadcrumb-border-radius: null !default;
1540
+ // scss-docs-end breadcrumb-variables
1541
+
1542
+ // Carousel
1543
+
1544
+ // scss-docs-start carousel-variables
1545
+ $carousel-control-color: $white !default;
1546
+ $carousel-control-width: 15% !default;
1547
+ $carousel-control-opacity: .5 !default;
1548
+ $carousel-control-hover-opacity: .9 !default;
1549
+ $carousel-control-transition: opacity .15s ease !default;
1550
+
1551
+ $carousel-indicator-width: 30px !default;
1552
+ $carousel-indicator-height: 3px !default;
1553
+ $carousel-indicator-hit-area-height: 10px !default;
1554
+ $carousel-indicator-spacer: 3px !default;
1555
+ $carousel-indicator-opacity: .5 !default;
1556
+ $carousel-indicator-active-bg: $white !default;
1557
+ $carousel-indicator-active-opacity: 1 !default;
1558
+ $carousel-indicator-transition: opacity .6s ease !default;
1559
+
1560
+ $carousel-caption-width: 70% !default;
1561
+ $carousel-caption-color: $white !default;
1562
+ $carousel-caption-padding-y: 1.25rem !default;
1563
+ $carousel-caption-spacer: 1.25rem !default;
1564
+
1565
+ $carousel-control-icon-width: 2rem !default;
1566
+
1567
+ $carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/></svg>") !default;
1568
+ $carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$carousel-control-color}'><path d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/></svg>") !default;
1569
+
1570
+ $carousel-transition-duration: .6s !default;
1571
+ $carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)
1572
+
1573
+ $carousel-dark-indicator-active-bg: $black !default;
1574
+ $carousel-dark-caption-color: $black !default;
1575
+ $carousel-dark-control-icon-filter: invert(1) grayscale(100) !default;
1576
+ // scss-docs-end carousel-variables
1577
+
1578
+
1579
+ // Spinners
1580
+
1581
+ // scss-docs-start spinner-variables
1582
+ $spinner-width: 2rem !default;
1583
+ $spinner-height: $spinner-width !default;
1584
+ $spinner-vertical-align: -.125em !default;
1585
+ $spinner-border-width: .25em !default;
1586
+ $spinner-animation-speed: .75s !default;
1587
+
1588
+ $spinner-width-sm: 1rem !default;
1589
+ $spinner-height-sm: $spinner-width-sm !default;
1590
+ $spinner-border-width-sm: .2em !default;
1591
+ // scss-docs-end spinner-variables
1592
+
1593
+
1594
+ // Close
1595
+
1596
+ // scss-docs-start close-variables
1597
+ $btn-close-width: 1em !default;
1598
+ $btn-close-height: $btn-close-width !default;
1599
+ $btn-close-padding-x: .25em !default;
1600
+ $btn-close-padding-y: $btn-close-padding-x !default;
1601
+ $btn-close-color: $black !default;
1602
+ $btn-close-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$btn-close-color}'><path d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/></svg>") !default;
1603
+ $btn-close-focus-shadow: $input-btn-focus-box-shadow !default;
1604
+ $btn-close-opacity: .5 !default;
1605
+ $btn-close-hover-opacity: .75 !default;
1606
+ $btn-close-focus-opacity: 1 !default;
1607
+ $btn-close-disabled-opacity: .25 !default;
1608
+ $btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default;
1609
+ // scss-docs-end close-variables
1610
+
1611
+
1612
+ // Offcanvas
1613
+
1614
+ // scss-docs-start offcanvas-variables
1615
+ $offcanvas-padding-y: $modal-inner-padding !default;
1616
+ $offcanvas-padding-x: $modal-inner-padding !default;
1617
+ $offcanvas-horizontal-width: 400px !default;
1618
+ $offcanvas-vertical-height: 30vh !default;
1619
+ $offcanvas-transition-duration: .3s !default;
1620
+ $offcanvas-border-color: $modal-content-border-color !default;
1621
+ $offcanvas-border-width: $modal-content-border-width !default;
1622
+ $offcanvas-title-line-height: $modal-title-line-height !default;
1623
+ $offcanvas-bg-color: $modal-content-bg !default;
1624
+ $offcanvas-color: $modal-content-color !default;
1625
+ $offcanvas-box-shadow: $modal-content-box-shadow-xs !default;
1626
+ $offcanvas-backdrop-bg: $modal-backdrop-bg !default;
1627
+ $offcanvas-backdrop-opacity: $modal-backdrop-opacity !default;
1628
+ // scss-docs-end offcanvas-variables
1629
+
1630
+ // Code
1631
+
1632
+ $code-font-size: $small-font-size !default;
1633
+ $code-color: $pink !default;
1634
+
1635
+ $kbd-padding-y: .2rem !default;
1636
+ $kbd-padding-x: .4rem !default;
1637
+ $kbd-font-size: $code-font-size !default;
1638
+ $kbd-color: $white !default;
1639
+ $kbd-bg: $gray-900 !default;
1640
+
1641
+ $pre-color: null !default;