Proyectos de Subversion Moodle

Rev

| Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 efrain 1
/// Slightly lighten a color
2
/// @access public
3
/// @param {Color} $color - color to tint
4
/// @param {Number} $percentage - percentage of `$color` in returned color
5
/// @return {Color}
6
@function tint($color, $percentage) {
7
  @return mix(white, $color, $percentage);
8
}
9
 
10
/// Slightly darken a color
11
/// @access public
12
/// @param {Color} $color - color to shade
13
/// @param {Number} $percentage - percentage of `$color` in returned color
14
/// @return {Color}
15
@function shade($color, $percentage) {
16
  @return mix(black, $color, $percentage);
17
}
18
 
19
// Variables
20
//
21
// Variables should follow the `$component-state-property-size` formula for
22
// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.
23
 
24
// Color system
25
$white: #fff !default;
26
$gray-100: #F5F5F5 !default;
27
$gray-200: #EEEEEE !default;
28
$gray-300: #E1E1E1 !default;
29
$gray-400: #D8D8D8 !default;
30
$gray-500: #B7B7B7 !default;
31
$gray-600: #757474 !default;
32
$gray-700: #6B6B6B !default;
33
$gray-800: #434343 !default;
34
$gray-900: #212121 !default;
35
$black: #0b0b0b !default;
36
 
37
 
38
//Dark mode
39
$dm-white: #fff !default;
40
$dm-gray-900: #ebedf7 !default;
41
$dm-gray-800: #d0d3e3 !default;
42
$dm-gray-700: #b3b7cb !default;
43
$dm-gray-600: #9499b0 !default;
44
$dm-gray-500: #737990 !default;
45
$dm-gray-400: #545a72 !default;
46
$dm-gray-300: #3c4155 !default;
47
$dm-gray-200: #272b3c !default;
48
$dm-gray-100: #1d202d !default;
49
$dm-black: #090c11 !default;
50
 
51
 
52
// Colors
53
$blue-900: #032574 !default;
54
$blue-800: #00309F !default;
55
$blue-700: #0642CD !default;
56
$blue-600: #406CD2 !default;
57
$blue-500: #6E8EDA !default;
58
$blue-400: #94ADE7 !default;
59
$blue-300: #BACDF7 !default;
60
$blue-200: #D4DEF8 !default;
61
$blue-100: #EEF8FF !default;
62
 
63
$red-900: #680505 !default;
64
$red-800: #910808 !default;
65
$red-700: #ca0d0d !default;
66
$red-600: #ef1010 !default;
67
$red-500: #f45959 !default;
68
$red-400: #f67e7e !default;
69
$red-300: #f9a3a3 !default;
70
$red-200: #fbc8c8 !default;
71
$red-100: #feeded !default;
72
 
73
$yellow-900: #93640A !default;
74
$yellow-800: #C3850C !default;
75
$yellow-700: #F4A614 !default;
76
$yellow-600: #F7B742 !default;
77
$yellow-500: #F8C971 !default;
78
$yellow-400: #F7DAA2 !default;
79
$yellow-300: #FFEBC7 !default;
80
$yellow-200: #FFF1D5 !default;
81
$yellow-100: #FDF6EA !default;
82
 
83
$orange-900: #4c2101 !default;
84
$orange-800: #7e3601 !default;
85
$orange-700: #b14c01 !default;
86
$orange-600: #FB6C02 !default;
87
$orange-500: #df6c39 !default;
88
$orange-400: #e68d65 !default;
89
$orange-300: #edad91 !default;
90
$orange-200: #f4cebd !default;
91
$orange-100: #fbefe9 !default;
92
 
93
$green-900: #043a2d !default;
94
$green-800: #005742 !default;
95
$green-700: #087159 !default;
96
$green-600: #027654 !default;
97
$green-500: #048444 !default;
98
$green-400: #5FB86B !default;
99
$green-300: #96CA88 !default;
100
$green-200: #D1ECC0 !default;
101
$green-100: #EAF4DD !default;
102
 
103
$purple-900: #3D374F !default;
104
$purple-800: #60587B !default;
105
$purple-700: #AAA0CB !default;
106
$purple-600: #D0C6F0 !default;
107
$purple-500: #D8D0F2 !default;
108
$purple-400: #DFD9F4 !default;
109
$purple-300: #E6E2F6 !default;
110
$purple-200: #EEEAF8 !default;
111
$purple-100: #F5F3FB !default;
112
 
113
 
114
$deep-blue-900: #000B0C !default;
115
$deep-blue-800: #00191F !default;
116
$deep-blue-700: #00212C !default;
117
$deep-blue-600: #002D47 !default;
118
$deep-blue-500: #2F5A69 !default;
119
$deep-blue-400: #5F858B !default;
120
$deep-blue-300: #8EADAE !default;
121
$deep-blue-200: #BED0CF !default;
122
$deep-blue-100: #EDF2F1 !default;
123
 
124
 
125
$primary-color-600: #FF3F05 !default;
126
$primary-color-900: shade($primary-color-600, 70%) !default;
127
$primary-color-800: shade($primary-color-600, 55%) !default;
128
$primary-color-700: shade($primary-color-600, 44%) !default;
129
$primary-color-500: tint($primary-color-600, 20%) !default;
130
$primary-color-400: tint($primary-color-600, 50%) !default;
131
$primary-color-300: tint($primary-color-600, 70%) !default;
132
$primary-color-200: tint($primary-color-600, 80%) !default;
133
$primary-color-100: tint($primary-color-600, 90%) !default;
134
 
135
// fusv-disable
136
$grays: ("100": $gray-100,
137
  "200": $gray-200,
138
  "300": $gray-300,
139
  "400": $gray-400,
140
  "500": $gray-500,
141
  "600": $gray-600,
142
  "700": $gray-700,
143
  "800": $gray-800,
144
  "900": $gray-900) !default;
145
// fusv-enable
146
 
147
$blue: $blue-600 !default;
148
$purple: $purple-600 !default;
149
$red: $red-600 !default;
150
$orange: $orange-900 !default;
151
$yellow: $yellow-600 !default;
152
$green: $green-600 !default;
153
 
154
// scss-docs-start colors-map
155
$colors: ("blue": $blue,
156
  "purple": $purple,
157
  "red": $red,
158
  "orange": $orange,
159
  "yellow": $yellow,
160
  "green": $green,
161
  "white": $white,
162
  "gray": $gray-600,
163
  "gray-dark": $gray-800) !default;
164
// scss-docs-end colors-map
165
 
166
$primary: $primary-color-600 !default;
167
$secondary: $gray-600 !default;
168
$success: $green-600 !default;
169
$info: $blue-600 !default;
170
$warning: $yellow-600 !default;
171
$danger: $red-600 !default;
172
$light: $gray-600 !default;
173
$dark: $gray-900 !default;
174
 
175
// scss-docs-start theme-colors-map
176
$theme-colors: ("primary-color-100": $primary-color-100,
177
  "primary-color-200": $primary-color-200,
178
  "primary-color-300": $primary-color-300,
179
  "primary-color-400": $primary-color-400,
180
  "primary-color-500": $primary-color-500,
181
  "primary-color-600": $primary-color-600,
182
  "primary-color-700": $primary-color-700,
183
  "primary-color-800": $primary-color-800,
184
  "primary-color-900": $primary-color-900,
185
  "gray-100": $gray-100,
186
  "gray-200": $gray-200,
187
  "gray-300": $gray-300,
188
  "gray-400": $gray-400,
189
  "gray-500": $gray-500,
190
  "gray-600": $gray-600,
191
  "gray-700": $gray-700,
192
  "gray-800": $gray-800,
193
  "gray-900": $gray-900,
194
  "primary": $primary,
195
  "secondary": $secondary,
196
  "success": $success,
197
  "info": $info,
198
  "warning": $warning,
199
  "danger": $danger,
200
  "light": $light,
201
  "dark": $dark) !default;
202
// scss-docs-end theme-colors-map
203
 
204
// 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.
205
// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
206
$min-contrast-ratio: 4.5 !default;
207
 
208
// Customize the light and dark text colors for use in our color contrast function.
209
$color-contrast-dark: $black !default;
210
$color-contrast-light: $white !default;
211
$dm-color-contrast-dark: $dm-black !default;
212
$dm-color-contrast-light: $dm-white !default;
213
 
214
// Characters which are escaped by the escape-svg function
215
$escaped-characters: (("<", "%3c"),
216
  (">", "%3e"),
217
  ("#", "%23"),
218
  ("(", "%28"),
219
  (")", "%29"),
220
) !default;
221
 
222
 
223
// Set a specific jump point for requesting color jumps
224
$theme-color-interval: 8% !default;
225
 
226
// The yiq lightness value that determines when the lightness of color changes from "dark" to "light". Acceptable values are between 0 and 255.
227
$yiq-contrasted-threshold: 150 !default;
228
 
229
// Customize the light and dark text colors for use in our YIQ color contrast function.
230
$yiq-text-dark: $gray-900 !default;
231
$dm-yiq-text-dark: dm-gray-900 !default;
232
$yiq-text-light: $white !default;
233
$dm-yiq-text-light: $dm-white !default;
234
 
235
// Characters which are escaped by the escape-svg function
236
$escaped-characters: (("<", "%3c"),
237
  (">", "%3e"),
238
  ("#", "%23"),
239
  ("(", "%28"),
240
  (")", "%29"),
241
) !default;
242
 
243
 
244
// Options
245
//
246
// Quickly modify global styling by enabling or disabling optional features.
247
 
248
$enable-caret: true !default;
249
$enable-rounded: true !default;
250
$enable-shadows: false !default;
251
$enable-gradients: false !default;
252
$enable-transitions: true !default;
253
$enable-prefers-reduced-motion-media-query: true !default;
254
$enable-hover-media-query: false !default; // Deprecated, no longer affects any compiled CSS
255
$enable-grid-classes: true !default;
256
$enable-pointer-cursor-for-buttons: true !default;
257
$enable-print-styles: true !default;
258
$enable-responsive-font-sizes: false !default;
259
$enable-validation-icons: true !default;
260
$enable-deprecation-messages: true !default;
261
 
262
 
263
// Spacing
264
//
265
// Control the default styling of most Bootstrap elements by modifying these
266
// variables. Mostly focused on spacing.
267
// You can add more entries to the $spacers map, should you need more variation.
268
 
269
$spacer: 1rem !default;
270
$spacers: () !default;
271
$spacers: map-merge((0: 0,
272
    1: ($spacer * .25),
273
    2: ($spacer * .5),
274
    3: $spacer,
275
    4: ($spacer * 1.875),
276
    5: ($spacer * 2.5),
277
    6: ($spacer * 3),
278
  ),
279
  $spacers);
280
 
281
// This variable affects the `.h-*` and `.w-*` classes.
282
$sizes: () !default;
283
$sizes: map-merge((25: 25%,
284
    50: 50%,
285
    75: 75%,
286
    100: 100%,
287
    auto: auto),
288
  $sizes);
289
 
290
 
291
// Body
292
//
293
// Settings for the `<body>` element.
294
 
295
$body-bg: $white !default;
296
$body-color: $gray-900 !default;
297
$body-color-secondary: $gray-800 !default;
298
$body-color-light: $gray-700 !default;
299
$container-bg: $white !default;
300
 
301
//Dark Mode
302
$dm-body-bg: #0d1117 !default;
303
$dm-body-color: $dm-gray-900 !default;
304
$dm-body-color-secondary: $dm-gray-800 !default;
305
$dm-body-color-light: #798590 !default;
306
$dm-container-bg: $dm-black !default;
307
 
308
 
309
// Links
310
//
311
// Style anchor elements.
312
 
313
$link-color: $primary-color-600 !default;
314
$dm-link-color: $primary-color-300 !default;
315
$link-decoration: none !default;
316
$link-hover-color: $primary-color-500 !default;
317
$dm-link-hover-color: $primary-color-500 !default;
318
// Darken percentage for links with `.text-*` class (e.g. `.text-success`)
319
$emphasized-link-hover-darken-percentage: 15% !default;
320
 
321
// Paragraphs
322
//
323
// Style p element.
324
 
325
$paragraph-margin-bottom: .5rem !default;
326
 
327
 
328
// Grid breakpoints
329
//
330
// Define the minimum dimensions at which your layout will change,
331
// adapting to different screen sizes, for use in media queries.
332
 
333
$grid-breakpoints: (xs: 0,
334
  sm: 320px,
335
  md: 768px,
336
  lg: 1100px,
337
  xl: 1300px,
338
  xxl: 1900px) !default;
339
 
340
@include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
341
@include _assert-starts-at-zero($grid-breakpoints, "$grid-breakpoints");
342
 
343
 
344
// Grid containers
345
//
346
// Define the maximum width of `.container` for different screen sizes.
347
 
348
$container-max-widths: (sm: 90%,
349
  md: 90%,
350
  lg: 960px,
351
  xl: 1140px) !default;
352
 
353
@include _assert-ascending($container-max-widths, "$container-max-widths");
354
 
355
 
356
// Grid columns
357
//
358
// Set the number of columns and specify the width of the gutters.
359
 
360
$grid-columns: 12 !default;
361
$grid-gutter-width: 30px !default;
362
$grid-row-columns: 6 !default;
363
 
364
 
365
// Components
366
//
367
// Define common padding and border radius sizes and more.
368
 
369
$line-height-lg: 1.5 !default;
370
$line-height-sm: 1.5 !default;
371
 
372
$border-width: 1px !default;
373
$border-color: $gray-400 !default;
374
//Dark Mode
375
$dm-border-color: #262a30 !default;
376
 
377
// Allows for customizing button radius independently from global border radius
378
$btn-border-radius: 12px !default;
379
$btn-border-radius-xl: $btn-border-radius * 8 !default;
380
$btn-border-radius-lg: $btn-border-radius * 2 !default;
381
$btn-border-radius-md: $btn-border-radius - 4px !default;
382
$btn-border-radius-sm: $btn-border-radius - 6px !default;
383
 
384
$border-radius: $btn-border-radius !default;
385
$border-radius-xl: $border-radius * 12 !default;
386
$border-radius-lg: $border-radius * 8 !default;
387
$border-radius-md: $border-radius * 2 !default;
388
$border-radius-sm: $border-radius - 2px !default;
389
 
390
$rounded-pill: 50rem !default;
391
 
392
$box-shadow-sm: rgba(0, 0, 0, 0.12) 0px 1px 3px,
393
rgba(0, 0, 0, 0.24) 0px 1px 2px !default;
394
$box-shadow-md: rgba(0, 0, 0, 0.26) 0 9px 16px,
395
rgba(0, 0, 0, 0.2) 0 2px 3px !default;
396
$box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
397
rgba(0, 0, 0, 0.3) 0px 1px 3px -1px !default;
398
$box-shadow-lg: rgba(0, 0, 0, 0.15) 0px 15px 25px,
399
rgba(0, 0, 0, 0.05) 0px 5px 10px !default;
400
 
401
$component-active-color: $primary-color-600 !default;
402
$component-active-bg: $primary-color-100 !default;
403
 
404
// Dark mode.
405
$dm-component-active-color: $primary-color-200 !default;
406
$dm-component-active-bg: $primary-color-800 !default;
407
 
408
 
409
$caret-width: 3px !default;
410
$caret-vertical-align: $caret-width * .85 !default;
411
$caret-spacing: 10px !default;
412
 
413
$transition-base: all .2s ease-in-out !default;
414
$transition-fade: opacity .15s linear !default;
415
$transition-collapse: height .35s ease !default;
416
 
417
$embed-responsive-aspect-ratios: () !default;
418
$embed-responsive-aspect-ratios: join(((21 9),
419
    (16 9),
420
    (4 3),
421
    (1 1),
422
  ),
423
  $embed-responsive-aspect-ratios);
424
 
425
// Typography
426
//
427
// Font, line-height, and color for body text, headings, and more.
428
 
429
// stylelint-disable value-keyword-case
430
$font-family-sans-serif: "Arial",
431
system-ui,
432
-apple-system,
433
"Segoe UI",
434
Roboto,
435
"Helvetica Neue",
436
Arial,
437
"Noto Sans",
438
"Liberation Sans",
439
sans-serif,
440
"Apple Color Emoji",
441
"Segoe UI Emoji",
442
"Segoe UI Symbol",
443
"Noto Color Emoji" !default;
444
$font-family-monospace: "SFMono-Regular",
445
Menlo,
446
Monaco,
447
Consolas,
448
"Liberation Mono",
449
"Courier New",
450
monospace !default;
451
$font-family-base: $font-family-sans-serif !default;
452
//$font-family-serif:           "Playfair Display" !default;
453
// stylelint-enable value-keyword-case
454
 
455
$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`
456
$font-size-xl: 1.875rem !default; //30px
457
$font-size-lg: 1.125rem !default; //18px
458
$font-size-md: .875rem !default; //14px
459
$font-size-sm: .813rem !default; //14px
460
$font-size-xs: .75rem !default; //12px
461
 
462
$font-weight-lighter: lighter !default;
463
$font-weight-light: 300 !default;
464
$font-weight-normal: 400 !default;
465
$font-weight-medium: 500 !default;
466
$font-weight-bold: 700 !default;
467
$font-weight-bolder: bolder !default;
468
 
469
$font-weight-base: $font-weight-normal !default;
470
$line-height-base: 1.5 !default;
471
 
472
$h1-font-size: 3.75rem !default;
473
$h2-font-size: 3rem !default;
474
$h3-font-size: 1.5rem !default;
475
$h4-font-size: 1rem !default;
476
$h5-font-size: 0.75rem !default;
477
$h6-font-size: 0.688rem !default;
478
 
479
$headings-margin-bottom: $spacer * 0.5 !default;
480
$headings-font-weight: 700 !default;
481
$headings-line-height: 1.3 !default;
482
$headings-color: $gray-900 !default;
483
$dm-headings-color: $gray-100 !default;
484
 
485
$headings-gradient-color-1: $primary-color-600 !default;
486
$headings-gradient-color-2: $primary-color-400 !default;
487
$dm-headings-gradient-color-1: $primary-color-400 !default;
488
$dm-headings-gradient-color-2: $primary-color-200 !default;
489
 
490
$display1-size: 4rem !default;
491
$display2-size: 3.5rem !default;
492
$display3-size: 2.5rem !default;
493
$display4-size: 1.5rem !default;
494
 
495
$display1-weight: $font-weight-bold !default;
496
$display2-weight: $font-weight-bold !default;
497
$display3-weight: $font-weight-bold !default;
498
$display4-weight: $font-weight-bold !default;
499
$display-line-height: $headings-line-height !default;
500
 
501
$lead-font-size: $font-size-base * 1.25 !default;
502
$lead-font-weight: 400 !default;
503
 
504
$small-font-size: 0.75rem !default;
505
 
506
$text-muted: $gray-700 !default;
507
$dm-text-muted: $dm-gray-700 !default;
508
 
509
$blockquote-small-color: $gray-600 !default;
510
$dm-blockquote-small-color: $dm-gray-600 !default;
511
$blockquote-small-font-size: $small-font-size !default;
512
$blockquote-font-size: $font-size-base * 1.25 !default;
513
 
514
$hr-border-color: rgba($black, .1) !default;
515
$dm-hr-border-color: rgba($white, .1) !default;
516
$hr-border-width: $border-width !default;
517
 
518
$mark-padding: .2em !default;
519
 
520
$dt-font-weight: $font-weight-bold !default;
521
 
522
$kbd-box-shadow: inset 0 -.1rem 0 rgba($black, .25) !default;
523
$nested-kbd-font-weight: $font-weight-bold !default;
524
 
525
$list-inline-padding: .5rem !default;
526
 
527
$mark-bg: #fcf8e3 !default;
528
$dm-mark-bg: #fcf8e3 !default;
529
 
530
$hr-margin-y: 30px !default;
531
 
532
 
533
// Tables
534
//
535
// Customizes the `.table` component with basic values, each used across all table variations.
536
 
537
$table-cell-padding: .75rem !default;
538
$table-cell-padding-sm: .3rem !default;
539
$table-color: $body-color !default;
540
$table-bg: $white !default;
541
$table-accent-bg: rgba($black, .025) !default;
542
$table-hover-color: $table-color !default;
543
$table-hover-bg: rgba($black, .075) !default;
544
$table-active-bg: $table-hover-bg !default;
545
$table-border-width: $border-width !default;
546
$table-border-color: $border-color !default;
547
$table-head-bg: $gray-200 !default;
548
$table-head-color: $gray-700 !default;
549
$table-th-font-weight: null !default;
550
$table-dark-color: $white !default;
551
$table-dark-bg: $gray-800 !default;
552
$table-dark-accent-bg: rgba($white, .05) !default;
553
$table-dark-hover-color: $table-dark-color !default;
554
$table-dark-hover-bg: rgba($white, .075) !default;
555
$table-dark-border-color: lighten($table-dark-bg, 7.5%) !default;
556
$table-striped-order: odd !default;
557
$table-caption-color: $text-muted !default;
558
$table-bg-level: -9 !default;
559
$table-border-level: -6 !default;
560
 
561
//Dark Mode
562
$dm-table-color: $dm-body-color !default;
563
$dm-table-bg: $dm-container-bg !default;
564
$dm-table-accent-bg: rgba($dm-black, .025) !default;
565
$dm-table-hover-color: $dm-table-color !default;
566
$dm-table-hover-bg: rgba($dm-black, .075) !default;
567
$dm-table-active-bg: $dm-table-hover-bg !default;
568
$dm-table-border-color: $dm-border-color !default;
569
$dm-table-head-bg: $dm-gray-200 !default;
570
$dm-table-head-color: $dm-gray-700 !default;
571
$dm-table-dark-color: $dm-white !default;
572
$dm-table-dark-bg: $dm-gray-800 !default;
573
$dm-table-dark-accent-bg: rgba($dm-white, .05) !default;
574
$dm-table-dark-hover-color: $dm-table-dark-color !default;
575
$dm-table-dark-hover-bg: rgba($dm-white, .075) !default;
576
$dm-table-dark-border-color: lighten($dm-table-dark-bg, 7.5%) !default;
577
$dm-table-caption-color: $dm-text-muted !default;
578
 
579
 
580
 
581
 
582
// Buttons + Forms
583
//
584
// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.
585
 
586
$input-btn-padding-y: .6rem !default;
587
$input-btn-padding-x: 1.25rem !default;
588
$input-btn-font-family: null !default;
589
$input-btn-font-size: 0.875rem !default;
590
$input-btn-line-height: $line-height-base !default;
591
 
592
$input-btn-focus-width: .2rem !default;
593
$input-btn-focus-color: rgba($primary-color-600, .3) !default;
594
$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
595
 
596
$input-btn-padding-y-sm: .5rem !default;
597
$input-btn-padding-x-sm: 1.25rem !default;
598
$input-btn-font-size-sm: .8125rem !default; //13px
599
$input-btn-line-height-sm: $line-height-sm !default;
600
 
601
$input-btn-padding-y-lg: 1rem !default;
602
$input-btn-padding-x-lg: 1.75rem !default;
603
$input-btn-font-size-lg: 1rem !default;
604
$input-btn-line-height-lg: $line-height-lg !default;
605
 
606
$input-btn-border-width: $border-width !default;
607
 
608
 
609
// Buttons
610
//
611
// For each of Bootstrap's buttons, define text, background, and border color.
612
 
613
$btn-padding-y: $input-btn-padding-y !default;
614
$btn-padding-x: $input-btn-padding-x !default;
615
$btn-font-family: $input-btn-font-family !default;
616
$btn-font-size: $input-btn-font-size !default;
617
$btn-line-height: $input-btn-line-height !default;
618
$btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping
619
 
620
$btn-padding-y-sm: $input-btn-padding-y-sm !default;
621
$btn-padding-x-sm: $input-btn-padding-x-sm !default;
622
$btn-font-size-sm: $input-btn-font-size-sm !default;
623
$btn-line-height-sm: $input-btn-line-height-sm !default;
624
 
625
$btn-padding-y-lg: $input-btn-padding-y-lg !default;
626
$btn-padding-x-lg: $input-btn-padding-x-lg !default;
627
$btn-font-size-lg: $input-btn-font-size-lg !default;
628
$btn-line-height-lg: $input-btn-line-height-lg !default;
629
 
630
$btn-border-width: $input-btn-border-width !default;
631
 
632
$btn-font-weight: $font-weight-medium !default;
633
$btn-box-shadow: inset 0 1px 0 rgba($white, .15),
634
 
635
$btn-focus-width: $input-btn-focus-width !default;
636
$btn-focus-box-shadow: $input-btn-focus-box-shadow !default;
637
$btn-disabled-opacity: .35 !default;
638
$btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;
639
 
640
$btn-link-disabled-color: $gray-600 !default;
641
$dm-btn-link-disabled-color: $dm-gray-600 !default;
642
 
643
$btn-block-spacing-y: .5rem !default;
644
 
645
$btn-transition: color .15s ease-in-out,
646
background-color .15s ease-in-out,
647
border-color .15s ease-in-out,
648
box-shadow .15s ease-in-out !default;
649
 
650
 
651
// Forms
652
 
653
$label-margin-bottom: .5rem !default;
654
 
655
$input-padding-y: $input-btn-padding-y !default;
656
$input-padding-x: $input-btn-padding-x !default;
657
$input-font-family: $input-btn-font-family !default;
658
$input-font-size: $input-btn-font-size !default;
659
$input-font-weight: $font-weight-base !default;
660
$input-line-height: $input-btn-line-height !default;
661
 
662
$input-padding-y-sm: $input-btn-padding-y-sm !default;
663
$input-padding-x-sm: $input-btn-padding-x-sm !default;
664
$input-font-size-sm: $input-btn-font-size-sm !default;
665
$input-line-height-sm: $input-btn-line-height-sm !default;
666
 
667
$input-padding-y-lg: $input-btn-padding-y-lg !default;
668
$input-padding-x-lg: $input-btn-padding-x-lg !default;
669
$input-font-size-lg: $input-btn-font-size-lg !default;
670
$input-line-height-lg: $input-btn-line-height-lg !default;
671
 
672
$input-bg: $container-bg !default;
673
$dm-input-bg: #14161f !default;
674
$input-disabled-bg: $gray-200 !default;
675
$dm-input-disabled-bg: $dm-gray-200 !default;
676
$input-color: $gray-800 !default;
677
$dm-input-color: $dm-gray-800 !default;
678
$input-border-color: $gray-400 !default;
679
$dm-input-border-color: $dm-gray-400 !default;
680
$input-border-width: $input-btn-border-width !default;
681
$input-box-shadow: inset 0 1px 1px rgba($black, .075) !default;
682
 
683
$input-border-radius: $btn-border-radius !default;
684
$input-border-radius-lg: $border-radius-lg !default;
685
$input-border-radius-sm: $border-radius-sm !default;
686
 
687
$input-focus-bg: $input-bg !default;
688
$input-focus-border-color: $primary-color-200 !default;
689
$input-focus-color: $input-color !default;
690
$input-focus-width: $input-btn-focus-width !default;
691
$input-focus-box-shadow: $input-btn-focus-box-shadow !default;
692
 
693
$dm-input-focus-bg: $dm-input-bg !default;
694
$dm-input-focus-border-color: $primary-color-600 !default;
695
$dm-input-focus-color: $dm-input-color !default;
696
 
697
$input-placeholder-color: $gray-600 !default;
698
$input-plaintext-color: $body-color !default;
699
$dm-input-placeholder-color: $dm-gray-600 !default;
700
$dm-input-plaintext-color: $dm-body-color !default;
701
 
702
$input-height-border: $input-border-width * 2 !default;
703
 
704
$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;
705
$input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default;
706
$input-height-inner-quarter: add($input-line-height * .25em, $input-padding-y * 0.5) !default;
707
 
708
$input-height: add($input-line-height * 1em, add($input-padding-y * 2, $input-height-border, false)) !default;
709
$input-height-sm: 36px !default;
710
$input-height-lg: add($input-line-height-lg * 1em, add($input-padding-y-lg * 2, $input-height-border, false)) !default;
711
 
712
$input-transition: border-color .15s ease-in-out,
713
box-shadow .15s ease-in-out !default;
714
 
715
$form-text-margin-top: .25rem !default;
716
 
717
$form-check-input-gutter: .5rem !default;
718
$form-check-input-margin-y: .3rem !default;
719
$form-check-input-margin-x: .25rem !default;
720
 
721
$form-check-inline-margin-x: .75rem !default;
722
$form-check-inline-input-margin-x: .3125rem !default;
723
 
724
$form-grid-gutter-width: 10px !default;
725
$form-group-margin-bottom: 1rem !default;
726
 
727
$input-group-addon-color: $input-color !default;
728
$input-group-addon-bg: $gray-200 !default;
729
$dm-input-group-addon-bg: $dm-gray-200 !default;
730
$input-group-addon-border-color: $input-border-color !default;
731
 
732
$custom-forms-transition: background-color .15s ease-in-out,
733
border-color .15s ease-in-out,
734
box-shadow .15s ease-in-out !default;
735
 
736
$custom-control-gutter: .5rem !default;
737
$custom-control-spacer-x: 1rem !default;
738
$custom-control-cursor: null !default;
739
 
740
$custom-control-indicator-size: 1.25rem !default;
741
$custom-control-indicator-bg: $input-bg !default;
742
 
743
$custom-control-indicator-bg-size: 50% 50% !default;
744
$custom-control-indicator-box-shadow: $input-box-shadow !default;
745
$custom-control-indicator-color: $gray-600 !default;
746
$custom-control-indicator-border-color: $gray-500 !default;
747
$dm-custom-control-indicator-border-color: $dm-gray-500 !default;
748
$custom-control-indicator-border-width: 2px !default;
749
 
750
$custom-control-label-color: null !default;
751
 
752
$custom-control-indicator-disabled-bg: $input-disabled-bg !default;
753
$custom-control-label-disabled-color: $gray-600 !default;
754
$dm-custom-control-label-disabled-color: $dm-gray-600 !default;
755
 
756
$custom-control-indicator-checked-color: $primary-color-500 !default;
757
$custom-control-indicator-checked-bg: $primary-color-300 !default;
758
$custom-control-indicator-checked-disabled-bg: $primary-color-100 !default;
759
$custom-control-indicator-checked-disabled-color: $primary-color-300 !default;
760
$custom-control-indicator-checked-box-shadow: null !default;
761
$custom-control-indicator-checked-border-color: $custom-control-indicator-checked-bg !default;
762
 
763
$custom-control-indicator-focus-box-shadow: $input-focus-box-shadow !default;
764
$custom-control-indicator-focus-border-color: $input-focus-border-color !default;
765
 
766
$custom-control-indicator-active-color: $component-active-color !default;
767
$custom-control-indicator-active-bg: lighten($component-active-bg, 35%) !default;
768
$custom-control-indicator-active-box-shadow: null !default;
769
$custom-control-indicator-active-border-color: $custom-control-indicator-active-bg !default;
770
 
771
$custom-checkbox-indicator-border-radius: 3px !default;
772
$custom-checkbox-indicator-icon-checked: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'><path fill='#{$custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/></svg>") !default;
773
 
774
$custom-checkbox-indicator-indeterminate-bg: $component-active-bg !default;
775
$custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color !default;
776
$custom-checkbox-indicator-icon-indeterminate: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'><path stroke='#{$custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/></svg>") !default;
777
$custom-checkbox-indicator-indeterminate-box-shadow: null !default;
778
$custom-checkbox-indicator-indeterminate-border-color: $custom-checkbox-indicator-indeterminate-bg !default;
779
 
780
$custom-radio-indicator-border-radius: 50% !default;
781
$custom-radio-indicator-icon-checked: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'><circle r='3' fill='#{$custom-control-indicator-checked-color}'/></svg>") !default;
782
 
783
$custom-switch-width: $custom-control-indicator-size * 1.75 !default;
784
$custom-switch-indicator-border-radius: $btn-border-radius-xl !default;
785
$custom-switch-indicator-size: subtract($custom-control-indicator-size, $custom-control-indicator-border-width * 4) !default;
786
 
787
$custom-select-padding-y: $input-padding-y !default;
788
$custom-select-padding-x: $input-padding-x !default;
789
$custom-select-font-family: $input-font-family !default;
790
$custom-select-font-size: $input-font-size !default;
791
$custom-select-height: $input-height !default;
792
$custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator
793
$custom-select-font-weight: $input-font-weight !default;
794
$custom-select-line-height: $input-line-height !default;
795
$custom-select-color: $input-color !default;
796
$custom-select-disabled-color: $gray-600 !default;
797
$custom-select-bg: $input-bg !default;
798
$custom-select-disabled-bg: $gray-200 !default;
799
$custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions
800
$custom-select-indicator-color: $gray-800 !default;
801
$custom-select-indicator: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'><path fill='#{$custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>") !default;
802
$custom-select-background: escape-svg($custom-select-indicator) right 10px center / $custom-select-bg-size no-repeat !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
803
 
804
// Dark mode.
805
$dm-input-bg: $dm-container-bg !default;
806
$dm-input-disabled-bg: $dm-gray-200 !default;
807
$dm-input-color: $dm-gray-800 !default;
808
$dm-input-border-color: $dm-gray-300 !default;
809
$dm-input-focus-bg: $dm-gray-100 !default;
810
$dm-input-focus-border-color: lighten($dm-component-active-bg, 25%) !default;
811
$dm-input-focus-color: $dm-input-color !default;
812
$dm-input-placeholder-color: $dm-gray-600 !default;
813
$dm-input-plaintext-color: $dm-body-color !default;
814
$dm-input-group-addon-color: $dm-input-color !default;
815
$dm-input-group-addon-bg: $dm-gray-200 !default;
816
$dm-input-group-addon-border-color: $dm-input-border-color !default;
817
$dm-custom-control-indicator-bg: $dm-input-bg !default;
818
$dm-custom-control-indicator-border-color: $dm-gray-500 !default;
819
$dm-custom-control-label-color: null !default;
820
$dm-custom-control-indicator-disabled-bg: $dm-gray-100 !default;
821
$dm-custom-control-label-disabled-color: $dm-gray-600 !default;
822
$dm-custom-control-indicator-checked-color: $dm-gray-800 !default;
823
$dm-custom-control-indicator-checked-bg: $dm-gray-100 !default;
824
$dm-custom-control-indicator-checked-disabled-bg: rgba(theme-color("primary"), .5) !default;
825
$dm-custom-control-indicator-checked-box-shadow: null !default;
826
$dm-custom-control-indicator-checked-border-color: $dm-custom-control-indicator-checked-bg !default;
827
$dm-custom-control-indicator-focus-border-color: $dm-input-focus-border-color !default;
828
$dm-custom-control-indicator-active-color: $dm-component-active-color !default;
829
$dm-custom-control-indicator-active-bg: lighten($dm-component-active-bg, 35%) !default;
830
$dm-custom-control-indicator-active-border-color: $dm-custom-control-indicator-active-bg !default;
831
$dm-custom-checkbox-indicator-icon-checked: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'><path fill='#{$dm-custom-control-indicator-checked-color}' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/></svg>") !default;
832
$dm-custom-checkbox-indicator-indeterminate-bg: $dm-component-active-bg !default;
833
$dm-custom-checkbox-indicator-indeterminate-color: $dm-custom-control-indicator-checked-color !default;
834
$dm-custom-checkbox-indicator-icon-indeterminate: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'><path stroke='#{$dm-custom-checkbox-indicator-indeterminate-color}' d='M0 2h4'/></svg>") !default;
835
$dm-custom-checkbox-indicator-indeterminate-border-color: $dm-custom-checkbox-indicator-indeterminate-bg !default;
836
$dm-custom-radio-indicator-icon-checked: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'><circle r='3' fill='#{$dm-custom-control-indicator-checked-color}'/></svg>") !default;
837
$dm-custom-select-color: $dm-input-color !default;
838
$dm-custom-select-disabled-color: $dm-gray-600 !default;
839
$dm-custom-select-bg: $dm-input-bg !default;
840
$dm-custom-select-disabled-bg: $dm-gray-200 !default;
841
$dm-custom-select-indicator-color: $dm-gray-800 !default;
842
$dm-custom-select-indicator: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'><path fill='#{$dm-custom-select-indicator-color}' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>") !default;
843
$dm-custom-select-background: escape-svg($dm-custom-select-indicator) right 10px center / $custom-select-bg-size no-repeat !default; // Used so we can have multiple background elements (e.g., arrow and feedback icon)
844
 
845
 
846
 
847
$custom-select-feedback-icon-padding-right: add(1em * .75, (2 * $custom-select-padding-y * .75) + $custom-select-padding-x + $custom-select-indicator-padding) !default;
848
$custom-select-feedback-icon-position: center right ($custom-select-padding-x + $custom-select-indicator-padding) !default;
849
$custom-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;
850
 
851
$custom-select-border-width: $input-border-width !default;
852
$custom-select-border-color: $input-border-color !default;
853
$custom-select-border-radius: $btn-border-radius !default;
854
$custom-select-box-shadow: inset 0 1px 2px rgba($black, .075) !default;
855
 
856
$custom-select-focus-border-color: $input-focus-border-color !default;
857
$custom-select-focus-width: $input-focus-width !default;
858
$custom-select-focus-box-shadow: 0 0 0 $custom-select-focus-width $input-btn-focus-color !default;
859
 
860
$custom-select-padding-y-sm: $input-padding-y-sm !default;
861
$custom-select-padding-x-sm: $input-padding-x-sm !default;
862
$custom-select-font-size-sm: $input-font-size-sm !default;
863
$custom-select-height-sm: $input-height-sm !default;
864
 
865
$custom-select-padding-y-lg: $input-padding-y-lg !default;
866
$custom-select-padding-x-lg: $input-padding-x-lg !default;
867
$custom-select-font-size-lg: $input-font-size-lg !default;
868
$custom-select-height-lg: $input-height-lg !default;
869
 
870
$custom-range-track-width: 100% !default;
871
$custom-range-track-height: .5rem !default;
872
$custom-range-track-cursor: pointer !default;
873
$custom-range-track-bg: $gray-300 !default;
874
$custom-range-track-border-radius: 1rem !default;
875
$custom-range-track-box-shadow: inset 0 .25rem .25rem rgba($black, .1) !default;
876
 
877
// Dark mode.
878
$dm-custom-select-border-color: $dm-input-border-color !default;
879
$dm-custom-select-focus-border-color: $dm-input-focus-border-color !default;
880
$dm-custom-range-track-bg: $dm-gray-300 !default;
881
 
882
 
883
 
884
$custom-range-thumb-width: 1rem !default;
885
$custom-range-thumb-height: $custom-range-thumb-width !default;
886
$custom-range-thumb-bg: $component-active-bg !default;
887
$custom-range-thumb-border: 0 !default;
888
$custom-range-thumb-border-radius: 1rem !default;
889
$custom-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;
890
$custom-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg,
891
$input-focus-box-shadow !default;
892
$custom-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in IE/Edge
893
$custom-range-thumb-active-bg: lighten($component-active-bg, 35%) !default;
894
$custom-range-thumb-disabled-bg: $gray-500 !default;
895
 
896
// Dark mode.
897
$dm-custom-range-thumb-bg: $dm-component-active-bg !default;
898
$dm-custom-range-thumb-active-bg: lighten($dm-component-active-bg, 35%) !default;
899
$dm-custom-range-thumb-disabled-bg: $dm-gray-500 !default;
900
 
901
 
902
 
903
$custom-file-height: $input-height !default;
904
$custom-file-height-inner: $input-height-inner !default;
905
$custom-file-focus-border-color: $input-focus-border-color !default;
906
$custom-file-focus-box-shadow: $input-focus-box-shadow !default;
907
$custom-file-disabled-bg: $input-disabled-bg !default;
908
 
909
$custom-file-padding-y: $input-padding-y !default;
910
$custom-file-padding-x: $input-padding-x !default;
911
$custom-file-line-height: $input-line-height !default;
912
$custom-file-font-family: $input-font-family !default;
913
$custom-file-font-weight: $input-font-weight !default;
914
$custom-file-color: $input-color !default;
915
$custom-file-bg: $input-bg !default;
916
$custom-file-border-width: $input-border-width !default;
917
$custom-file-border-color: $input-border-color !default;
918
$custom-file-border-radius: $input-border-radius !default;
919
$custom-file-box-shadow: $input-box-shadow !default;
920
$custom-file-button-color: $custom-file-color !default;
921
$custom-file-button-bg: $input-group-addon-bg !default;
922
$custom-file-text: (en: "Browse"
923
) !default;
924
 
925
// Dark mode.
926
$dm-custom-file-focus-border-color: $dm-input-focus-border-color !default;
927
$dm-custom-file-disabled-bg: $dm-input-disabled-bg !default;
928
$dm-custom-file-color: $dm-input-color !default;
929
$dm-custom-file-bg: $dm-input-bg !default;
930
$dm-custom-file-border-color: $dm-input-border-color !default;
931
$dm-custom-file-button-color: $dm-custom-file-color !default;
932
$dm-custom-file-button-bg: $dm-input-group-addon-bg !default;
933
 
934
 
935
 
936
 
937
// Form validation
938
 
939
$form-feedback-margin-top: $form-text-margin-top !default;
940
$form-feedback-font-size: $small-font-size !default;
941
$form-feedback-valid-color: theme-color("success") !default;
942
$form-feedback-invalid-color: theme-color("danger") !default;
943
 
944
$form-feedback-icon-valid-color: $form-feedback-valid-color !default;
945
$form-feedback-icon-valid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8' 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;
946
$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;
947
$form-feedback-icon-invalid: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='#{$form-feedback-icon-invalid-color}' viewBox='0 0 12 12'><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;
948
 
949
$form-validation-states: () !default;
950
$form-validation-states: map-merge(("valid": ("color": $form-feedback-valid-color,
951
      "icon": $form-feedback-icon-valid),
952
    "invalid": ("color": $form-feedback-invalid-color,
953
      "icon": $form-feedback-icon-invalid),
954
  ),
955
  $form-validation-states);
956
 
957
// Z-index master list
958
//
959
// Warning: Avoid customizing these values. They're used for a bird's eye view
960
// of components dependent on the z-axis and are designed to all work together.
961
 
962
$zindex-dropdown: 1100 !default;
963
$zindex-sticky: 1020 !default;
964
$zindex-fixed: 1030 !default;
965
$zindex-modal-backdrop: 1250 !default;
966
$zindex-modal: 1251 !default;
967
$zindex-popover: 10000 !default;
968
$zindex-tooltip: 10001 !default;
969
 
970
 
971
// Navs
972
 
973
$nav-link-padding-y: .5rem !default;
974
$nav-link-padding-x: 1rem !default;
975
$nav-link-disabled-color: $gray-500 !default;
976
$dm-nav-link-disabled-color: $dm-gray-500 !default;
977
 
978
$nav-tabs-border-color: $gray-300 !default;
979
$nav-tabs-border-color: $gray-300 !default;
980
$nav-tabs-border-width: $border-width !default;
981
$nav-tabs-border-radius: $btn-border-radius !default;
982
$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default;
983
$nav-tabs-link-active-color: $primary-color-600 !default;
984
$nav-tabs-link-active-bg: $primary-color-200 !default;
985
$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;
986
$nav-tabs-link-hover-bg: $primary-color-600 !default;
987
$nav-tabs-link-hover-color: $primary-color-100 !default;
988
 
989
$nav-pills-border-radius: $btn-border-radius !default;
990
$nav-pills-link-active-color: $component-active-color !default;
991
$nav-pills-link-active-bg: $component-active-bg !default;
992
 
993
$nav-divider-color: $gray-200 !default;
994
$nav-divider-margin-y: $spacer * 0.5 !default;
995
 
996
// Dark mode.
997
$dm-nav-tabs-border-color: $dm-gray-300 !default;
998
$dm-nav-tabs-border-color: $dm-gray-300 !default;
999
$dm-nav-tabs-link-hover-border-color: $dm-gray-200 $dm-gray-200 $dm-nav-tabs-border-color !default;
1000
$dm-nav-tabs-link-active-color: $dm-body-color !default;
1001
$dm-nav-tabs-link-active-bg: $dm-black !default;
1002
$dm-nav-tabs-link-active-border-color: $dm-gray-300 $dm-gray-300 $dm-nav-tabs-link-active-bg !default;
1003
$dm-nav-pills-link-active-color: $dm-component-active-color !default;
1004
$dm-nav-pills-link-active-bg: $dm-component-active-bg !default;
1005
$dm-nav-divider-color: $dm-gray-200 !default;
1006
 
1007
 
1008
 
1009
// Navbar
1010
$navbar-padding-y: .5rem !default;
1011
$navbar-padding-x: $spacer !default;
1012
 
1013
$navbar-nav-link-padding-x: .5rem !default;
1014
 
1015
$navbar-brand-font-size: $font-size-lg !default;
1016
// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link
1017
$nav-link-height: $font-size-base * $line-height-base+$nav-link-padding-y * 2 !default;
1018
$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;
1019
$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) * 0.5 !default;
1020
 
1021
$navbar-toggler-padding-y: .25rem !default;
1022
$navbar-toggler-padding-x: .75rem !default;
1023
$navbar-toggler-font-size: $font-size-lg !default;
1024
$navbar-toggler-border-radius: $btn-border-radius !default;
1025
 
1026
$navbar-nav-scroll-max-height: 75vh !default;
1027
 
1028
 
1029
// Dropdowns
1030
// Dropdown menu container and contents.
1031
$dropdown-min-width: 90px !default;
1032
$dropdown-padding-x: .35rem !default;
1033
$dropdown-padding-y: .35rem !default;
1034
$dropdown-spacer: .125rem !default;
1035
$dropdown-font-size: $font-size-sm !default;
1036
$dropdown-color: $gray-200 !default;
1037
$dropdown-bg: $gray-900 !default;
1038
$dropdown-border-color: $gray-800 !default;
1039
$dropdown-border-radius: $btn-border-radius !default;
1040
$dropdown-border-width: $border-width !default;
1041
$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;
1042
$dropdown-divider-bg: $gray-800 !default;
1043
$dropdown-divider-margin-y: .35rem !default;
1044
$dropdown-box-shadow: 0 .5rem 1rem rgba($black, .175) !default;
1045
$dropdown-link-color: $gray-100 !default;
1046
$dropdown-link-hover-color: $gray-100 !default;
1047
$dropdown-link-hover-bg: $gray-800 !default;
1048
$dropdown-link-active-color: $gray-500 !default;
1049
$dropdown-link-active-bg: $gray-800 !default;
1050
$dropdown-link-disabled-color: $gray-700 !default;
1051
$dropdown-item-padding-y: .4rem !default;
1052
$dropdown-item-padding-x: .75rem !default;
1053
$dropdown-header-color: $gray-500 !default;
1054
$dropdown-header-padding: $dropdown-padding-y $dropdown-item-padding-x !default;
1055
$dropdown-text: $gray-100 !default;
1056
$dropdown-icon: $gray-300 !default;
1057
 
1058
// Dark mode.
1059
$dm-dropdown-color: $dm-body-color !default;
1060
$dm-dropdown-bg: $dm-gray-100 !default;
1061
$dm-dropdown-border-color: $dm-gray-300 !default;
1062
$dm-dropdown-divider-bg: $dm-gray-300 !default;
1063
$dm-dropdown-link-color: $primary-color-400 !default;
1064
$dm-dropdown-link-hover-color: $dm-gray-900 !default;
1065
$dm-dropdown-link-hover-bg: #2d333b !default;
1066
$dm-dropdown-link-active-color: $dm-gray-900 !default;
1067
$dm-dropdown-link-active-bg: $dm-gray-200 !default;
1068
$dm-dropdown-link-disabled-color: $dm-gray-400 !default;
1069
$dm-dropdown-header-color: $dm-gray-700 !default;
1070
$dm-dropdown-text: $dm-gray-900 !default;
1071
 
1072
 
1073
 
1074
 
1075
// Pagination
1076
$pagination-padding-y: .5rem !default;
1077
$pagination-padding-x: .75rem !default;
1078
$pagination-padding-y-sm: .25rem !default;
1079
$pagination-padding-x-sm: .5rem !default;
1080
$pagination-padding-y-lg: .75rem !default;
1081
$pagination-padding-x-lg: 1.5rem !default;
1082
$pagination-line-height: 1.5 !default;
1083
 
1084
$pagination-color: $gray-800 !default;
1085
$pagination-bg: $container-bg !default;
1086
$pagination-border-width: $border-width !default;
1087
$pagination-border-color: $gray-300 !default;
1088
 
1089
$pagination-focus-box-shadow: $input-btn-focus-box-shadow !default;
1090
$pagination-focus-outline: 0 !default;
1091
 
1092
$pagination-hover-color: $primary-color-600 !default;
1093
$pagination-hover-bg: $primary-color-100 !default;
1094
$pagination-hover-border-color: $primary-color-100 !default;
1095
 
1096
$pagination-active-color: $body-color-secondary !default;
1097
$pagination-active-bg: $gray-200 !default;
1098
$pagination-active-border-color: $pagination-active-bg !default;
1099
 
1100
$pagination-disabled-color: $gray-400 !default;
1101
$pagination-disabled-bg: $container-bg !default;
1102
$pagination-disabled-border-color: $gray-300 !default;
1103
 
1104
$pagination-border-radius-sm: $btn-border-radius !default;
1105
$pagination-border-radius-lg: $btn-border-radius !default;
1106
 
1107
//Dark mode
1108
$dm-pagination-color: $dm-gray-800 !default;
1109
$dm-pagination-bg: $dm-container-bg !default;
1110
$dm-pagination-border-color: $dm-gray-300 !default;
1111
$dm-pagination-hover-color: $blue-200 !default;
1112
$dm-pagination-hover-bg: $blue-800 !default;
1113
$dm-pagination-hover-border-color: $blue-100 !default;
1114
 
1115
$dm-pagination-active-color: $dm-body-color-secondary !default;
1116
$dm-pagination-active-bg: $dm-gray-100 !default;
1117
$dm-pagination-active-border-color: $dm-pagination-active-bg !default;
1118
 
1119
$dm-pagination-disabled-color: $dm-gray-400 !default;
1120
$dm-pagination-disabled-bg: $dm-container-bg !default;
1121
$dm-pagination-disabled-border-color: $dm-gray-300 !default;
1122
 
1123
 
1124
 
1125
// Cards
1126
$card-spacer-y: 1.25rem !default;
1127
$card-spacer-x: 1.25rem !default;
1128
$card-border-width: 1px !default;
1129
$card-border-radius: $btn-border-radius !default;
1130
$card-border-color: $border-color !default;
1131
$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;
1132
$card-cap-bg: null !default;
1133
$card-cap-color: null !default;
1134
$card-height: null !default;
1135
$card-color: null !default;
1136
$card-bg: $container-bg !default;
1137
$card-img-overlay-padding: 1.25rem !default;
1138
$card-group-margin: $grid-gutter-width * 0.5 !default;
1139
$card-deck-margin: $card-group-margin !default;
1140
$card-columns-count: 3 !default;
1141
$card-columns-gap: 1.25rem !default;
1142
$card-columns-margin: $card-spacer-y !default;
1143
 
1144
// Dark mode.
1145
$dm-card-border-color: $dm-border-color !default;
1146
$dm-card-cap-bg: null !default;
1147
$dm-card-cap-color: null !default;
1148
$dm-card-color: null !default;
1149
$dm-card-bg: $dm-container-bg !default;
1150
 
1151
 
1152
 
1153
// Accordion
1154
// scss-docs-start accordion-variables
1155
$accordion-padding-y: 1rem !default;
1156
$accordion-padding-x: 1.25rem !default;
1157
$accordion-color: $body-color !default;
1158
$accordion-bg: $container-bg !default;
1159
$accordion-border-width: $border-width !default;
1160
$accordion-border-color: $border-color !default;
1161
$accordion-border-radius: $btn-border-radius !default;
1162
$accordion-inner-border-radius: subtract($accordion-border-radius, $accordion-border-width) !default;
1163
 
1164
$accordion-body-padding-y: $accordion-padding-y !default;
1165
$accordion-body-padding-x: $accordion-padding-x !default;
1166
 
1167
$accordion-button-padding-y: $accordion-padding-y !default;
1168
$accordion-button-padding-x: $accordion-padding-x !default;
1169
$accordion-button-color: $accordion-color !default;
1170
$accordion-button-bg: $accordion-bg !default;
1171
$accordion-transition: all 350ms ease !default;
1172
$accordion-button-active-bg: $primary-color-100 !default;
1173
$accordion-button-active-color: $primary-color-600 !default;
1174
 
1175
$accordion-button-focus-border-color: $input-focus-border-color !default;
1176
$accordion-button-focus-box-shadow: $btn-focus-box-shadow !default;
1177
 
1178
$accordion-icon-width: 1.25rem !default;
1179
$accordion-icon-color: $accordion-color !default;
1180
$accordion-icon-active-color: $accordion-button-active-color !default;
1181
$accordion-icon-transition: transform .2s ease-in-out !default;
1182
$accordion-icon-transform: rotate(-180deg) !default;
1183
 
1184
$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;
1185
$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;
1186
// scss-docs-end accordion-variables
1187
 
1188
// Dark mode.
1189
$dm-accordion-color: $dm-body-color !default;
1190
$dm-accordion-bg: $dm-container-bg !default;
1191
$dm-accordion-border-color: $dm-border-color !default;
1192
$dm-accordion-button-color: $dm-accordion-color !default;
1193
$dm-accordion-button-bg: $dm-accordion-bg !default;
1194
$dm-accordion-button-active-bg: $dm-black !default;
1195
$dm-accordion-button-active-color: $dm-white !default;
1196
$dm-accordion-button-focus-border-color: $dm-input-focus-border-color !default;
1197
$dm-accordion-icon-color: $dm-accordion-color !default;
1198
$dm-accordion-button-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$dm-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;
1199
$dm-accordion-button-active-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$dm-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;
1200
 
1201
 
1202
// Tooltips
1203
$tooltip-font-size: $font-size-md !default;
1204
$tooltip-max-width: 200px !default;
1205
$tooltip-color: $white !default;
1206
$tooltip-bg: $black !default;
1207
$tooltip-border-radius: $btn-border-radius !default;
1208
$tooltip-opacity: .9 !default;
1209
$tooltip-padding-y: .25rem !default;
1210
$tooltip-padding-x: .5rem !default;
1211
$tooltip-margin: 0 !default;
1212
 
1213
$tooltip-arrow-width: .8rem !default;
1214
$tooltip-arrow-height: .4rem !default;
1215
$tooltip-arrow-color: $tooltip-bg !default;
1216
 
1217
// Dark mode.
1218
$dm-tooltip-color: $dm-body-color !default;
1219
$dm-tooltip-bg: $black !default;
1220
$dm-tooltip-arrow-color: $dm-tooltip-bg !default;
1221
 
1222
 
1223
 
1224
// Form tooltips must come after regular tooltips
1225
$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;
1226
$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;
1227
$form-feedback-tooltip-font-size: $tooltip-font-size !default;
1228
$form-feedback-tooltip-line-height: $line-height-base !default;
1229
$form-feedback-tooltip-opacity: $tooltip-opacity !default;
1230
$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
1231
 
1232
 
1233
// Popovers
1234
 
1235
 
1236
// Dark mode.
1237
$dm-popover-bg: $dm-gray-300 !default;
1238
$dm-popover-border-color: $dm-gray-800 !default;
1239
$dm-popover-header-bg: $dm-gray-300 !default;
1240
$dm-popover-header-color: $dm-body-color !default;
1241
$dm-popover-body-color: $dm-body-color !default;
1242
$dm-popover-arrow-color: $dm-popover-bg !default;
1243
$dm-popover-arrow-outer-color: transparent !default;
1244
 
1245
 
1246
$popover-font-size: $font-size-sm !default;
1247
$popover-bg: $gray-800 !default;
1248
$popover-max-width: 276px !default;
1249
$popover-border-width: $border-width !default;
1250
$popover-border-color: $gray-200 !default;
1251
$dm-popover-border-color: $dm-gray-800 !default;
1252
$popover-border-radius: $btn-border-radius !default;
1253
$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;
1254
$popover-box-shadow: 0 1px 2px rgba(0, 0, 0, .07),
1255
 
1256
 
1257
 
1258
 
1259
 
1260
 
1261
$popover-header-bg: $dm-container-bg !default;
1262
$popover-header-color: $dm-body-color !default;
1263
$popover-header-padding-y: .95rem !default;
1264
$popover-header-padding-x: .95rem !default;
1265
 
1266
$popover-body-color: $gray-200 !default;
1267
$popover-body-padding-y: $popover-header-padding-y !default;
1268
$popover-body-padding-x: $popover-header-padding-x !default;
1269
 
1270
$popover-arrow-width: 1rem !default;
1271
$popover-arrow-height: .5rem !default;
1272
$popover-arrow-color: $gray-800 !default;
1273
 
1274
$popover-arrow-outer-color: transparent !default;
1275
 
1276
 
1277
 
1278
// Toasts
1279
$toast-max-width: 340px !default;
1280
$toast-padding-x: 16px !default;
1281
$toast-padding-y: 16px !default;
1282
$toast-font-size: .875rem !default;
1283
$toast-color: $gray-900 !default;
1284
$toast-background-color: $yellow-200 !default;
1285
$toast-border-width: 1px !default;
1286
$toast-border-color: rgba(0, 0, 0, .1) !default;
1287
$toast-border-radius: .25rem !default;
1288
$toast-box-shadow: 0 .25rem .75rem rgba($black, .1) !default;
1289
 
1290
$toast-header-color: $gray-900 !default;
1291
$toast-header-background-color: $yellow-300 !default;
1292
$toast-header-border-color: rgba(0, 0, 0, .05) !default;
1293
 
1294
// Dark mode.
1295
$dm-toast-color: $dm-gray-900 !default;
1296
$dm-toast-background-color: $yellow-800 !default;
1297
$dm-toast-border-color: rgba($dm-black, .1) !default;
1298
$dm-toast-header-color: $dm-gray-900 !default;
1299
$dm-toast-header-background-color: $yellow-700 !default;
1300
$dm-toast-header-border-color: rgba($dm-black, .05) !default;
1301
 
1302
 
1303
 
1304
// Badges
1305
 
1306
$badge-font-size: 0.75rem !default;
1307
$badge-font-weight: $font-weight-medium !default;
1308
$badge-padding-y: .35rem !default;
1309
$badge-padding-x: .85rem !default;
1310
$badge-border-radius: $btn-border-radius !default;
1311
 
1312
$badge-transition: $btn-transition !default;
1313
$badge-focus-width: $input-btn-focus-width !default;
1314
 
1315
$badge-pill-padding-x: .6em !default;
1316
// Use a higher than normal value to ensure completely rounded edges when
1317
// customizing padding or font-size on labels.
1318
$badge-pill-border-radius: 10rem !default;
1319
 
1320
 
1321
// Modals
1322
 
1323
// Padding applied to the modal body
1324
$modal-inner-padding: 1rem !default;
1325
 
1326
// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding
1327
$modal-footer-margin-between: .5rem !default;
1328
 
1329
$modal-dialog-margin: .5rem !default;
1330
$modal-dialog-margin-y-sm-up: 1.75rem !default;
1331
 
1332
$modal-title-line-height: $line-height-base !default;
1333
 
1334
$modal-content-color: null !default;
1335
$modal-content-bg: $container-bg !default;
1336
$modal-content-border-color: $border-color !default;
1337
$modal-content-border-width: $border-width !default;
1338
$modal-content-border-radius: $btn-border-radius !default;
1339
$modal-content-inner-border-radius: $btn-border-radius !default;
1340
$modal-content-box-shadow-xs: $box-shadow-md !default;
1341
$modal-content-box-shadow-sm-up: 0 .5rem 1rem rgba($black, .5) !default;
1342
 
1343
$modal-backdrop-bg: $black !default;
1344
$modal-backdrop-opacity: .5 !default;
1345
$modal-header-border-color: $border-color !default;
1346
$modal-footer-border-color: $modal-header-border-color !default;
1347
$modal-header-border-width: $modal-content-border-width !default;
1348
$modal-footer-border-width: $modal-header-border-width !default;
1349
$modal-header-padding-y: 15px !default;
1350
$modal-header-padding-x: 16px !default;
1351
$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility
1352
 
1353
$modal-xl: 1140px !default;
1354
$modal-lg: 800px !default;
1355
$modal-md: 500px !default;
1356
$modal-sm: 420px !default;
1357
 
1358
$modal-fade-transform: translate(0, -50px) !default;
1359
$modal-show-transform: none !default;
1360
$modal-transition: transform .3s ease-out !default;
1361
$modal-scale-transform: scale(1.02) !default;
1362
 
1363
// Dark mode.
1364
$dm-modal-content-color: $dm-dropdown-color !default;
1365
$dm-modal-content-bg: $dm-dropdown-bg !default;
1366
$dm-modal-content-border-color: $dm-dropdown-border-color !default;
1367
$dm-modal-backdrop-bg: $dm-black !default;
1368
$dm-modal-header-border-color: $dm-dropdown-border-color !default;
1369
$dm-modal-footer-border-color: $dm-dropdown-border-color !default;
1370
 
1371
 
1372
 
1373
// Alerts
1374
//
1375
// Define alert colors, border radius, and padding.
1376
 
1377
$alert-padding-y: .55rem !default;
1378
$alert-padding-x: 1.25rem !default;
1379
$alert-margin-bottom: 1rem !default;
1380
$alert-border-radius: $btn-border-radius !default;
1381
$alert-link-font-weight: $font-weight-bold !default;
1382
$alert-border-width: $border-width !default;
1383
 
1384
$alert-bg-level: -10 !default;
1385
$alert-border-level: -9 !default;
1386
$alert-color-level: 6 !default;
1387
 
1388
 
1389
// Progress bars
1390
 
1391
$progress-height: 16px !default;
1392
$progress-font-size: 11px !default;
1393
$progress-bg: $gray-300 !default;
1394
$progress-border-radius: 16px !default;
1395
$progress-box-shadow: inset 0 .1rem .1rem rgba($black, .1) !default;
1396
$progress-bar-color: $white !default;
1397
$progress-bar-bg: $primary-color-600 !default;
1398
$progress-bar-animation-timing: 1s linear infinite !default;
1399
$progress-bar-transition: width .6s ease !default;
1400
 
1401
// Dark mode.
1402
$dm-progress-bg: $dm-gray-200 !default;
1403
 
1404
 
1405
// List group
1406
$list-group-color: null !default;
1407
$list-group-bg: $container-bg !default;
1408
$list-group-border-color: rgba($black, .125) !default;
1409
$list-group-border-width: $border-width !default;
1410
$list-group-border-radius: $border-radius !default;
1411
 
1412
$list-group-item-padding-y: 7px !default;
1413
$list-group-item-padding-x: 8px !default;
1414
 
1415
$list-group-hover-bg: $gray-100 !default;
1416
$list-group-active-color: $component-active-color !default;
1417
$list-group-active-bg: $component-active-bg !default;
1418
$list-group-active-border-color: $list-group-active-bg !default;
1419
 
1420
$list-group-disabled-color: $gray-600 !default;
1421
$list-group-disabled-bg: $list-group-bg !default;
1422
 
1423
$list-group-action-color: $body-color !default;
1424
$list-group-action-hover-color: $list-group-action-color !default;
1425
 
1426
$list-group-action-active-color: $body-color !default;
1427
$list-group-action-active-bg: $gray-200 !default;
1428
 
1429
//Dark mode
1430
$dm-list-group-color: null !default;
1431
$dm-list-group-bg: $dm-container-bg !default;
1432
$dm-list-group-border-color: rgba($dm-black, .125) !default;
1433
$dm-list-group-hover-bg: $dm-gray-100 !default;
1434
$dm-list-group-active-color: $dm-component-active-color !default;
1435
$dm-list-group-active-bg: $dm-component-active-bg !default;
1436
$dm-list-group-active-border-color: $dm-list-group-active-bg !default;
1437
$dm-list-group-disabled-color: $dm-gray-600 !default;
1438
$dm-list-group-disabled-bg: $dm-list-group-bg !default;
1439
$dm-list-group-action-color: $dm-gray-700 !default;
1440
$dm-list-group-action-hover-color: $dm-list-group-action-color !default;
1441
$dm-list-group-action-active-color: $dm-body-color !default;
1442
$dm-list-group-action-active-bg: $dm-gray-200 !default;
1443
 
1444
 
1445
 
1446
// Image thumbnails
1447
$thumbnail-padding: .25rem !default;
1448
$thumbnail-bg: $body-bg !default;
1449
$thumbnail-border-width: $border-width !default;
1450
$thumbnail-border-color: $gray-300 !default;
1451
$thumbnail-border-radius: $border-radius !default;
1452
$thumbnail-box-shadow: 0 1px 2px rgba($black, .075) !default;
1453
 
1454
//Dark mode
1455
$dm-thumbnail-bg: $dm-body-bg !default;
1456
$dm-thumbnail-border-color: $dm-gray-300 !default;
1457
$dm-thumbnail-box-shadow: 0 1px 2px rgba($dm-black, .075) !default;
1458
 
1459
 
1460
 
1461
// Figures
1462
$figure-caption-font-size: 90% !default;
1463
$figure-caption-color: $gray-600 !default;
1464
$dm-figure-caption-color: $dm-gray-600 !default;
1465
 
1466
// Breadcrumbs
1467
$breadcrumb-font-size: $font-size-xs !default;
1468
 
1469
$breadcrumb-padding-y: 1.25rem !default; //20px
1470
$breadcrumb-padding-x: 0 !default;
1471
$breadcrumb-item-padding: .5rem !default;
1472
 
1473
$breadcrumb-margin-bottom: 1rem !default;
1474
 
1475
$breadcrumb-bg: transparent !default;
1476
$breadcrumb-divider-color: $border-color !default;
1477
$breadcrumb-color: $body-color-light !default;
1478
$breadcrumb-active-color: $body-color !default;
1479
$breadcrumb-divider: quote("/") !default;
1480
$breadcrumb-border-radius: null !default;
1481
 
1482
//Dark mode
1483
$dm-breadcrumb-bg: transparent !default;
1484
$dm-breadcrumb-divider-color: $dm-border-color !default;
1485
$dm-breadcrumb-color: $dm-body-color-light !default;
1486
$dm-breadcrumb-active-color: $dm-body-color !default;
1487
 
1488
 
1489
 
1490
// Carousel
1491
$carousel-control-color: $white !default;
1492
$carousel-control-width: 15% !default;
1493
$carousel-control-opacity: .5 !default;
1494
$carousel-control-hover-opacity: .9 !default;
1495
$carousel-control-transition: opacity .15s ease !default;
1496
 
1497
$carousel-indicator-width: 30px !default;
1498
$carousel-indicator-height: 3px !default;
1499
$carousel-indicator-hit-area-height: 10px !default;
1500
$carousel-indicator-spacer: 3px !default;
1501
$carousel-indicator-active-bg: $white !default;
1502
$carousel-indicator-transition: opacity .6s ease !default;
1503
 
1504
$carousel-caption-width: 70% !default;
1505
$carousel-caption-color: $white !default;
1506
 
1507
$carousel-control-icon-width: 20px !default;
1508
 
1509
$carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/></svg>") !default;
1510
$carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/></svg>") !default;
1511
 
1512
$carousel-transition-duration: .6s !default;
1513
$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`)
1514
 
1515
//Dark mode
1516
$dm-carousel-control-color: $dm-white !default;
1517
$dm-carousel-indicator-active-bg: $dm-white !default;
1518
$dm-carousel-caption-color: $dm-white !default;
1519
$dm-carousel-control-prev-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$dm-carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M5.25 0l-4 4 4 4 1.5-1.5L4.25 4l2.5-2.5L5.25 0z'/></svg>") !default;
1520
$dm-carousel-control-next-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' fill='#{$dm-carousel-control-color}' width='8' height='8' viewBox='0 0 8 8'><path d='M2.75 0l-1.5 1.5L3.75 4l-2.5 2.5L2.75 8l4-4-4-4z'/></svg>") !default;
1521
 
1522
 
1523
 
1524
// Spinners
1525
 
1526
$spinner-width: 2rem !default;
1527
$spinner-height: $spinner-width !default;
1528
$spinner-border-width: .25em !default;
1529
 
1530
$spinner-width-sm: 1rem !default;
1531
$spinner-height-sm: $spinner-width-sm !default;
1532
$spinner-border-width-sm: .2em !default;
1533
 
1534
 
1535
// Close
1536
 
1537
$close-font-size: 0.8125rem !default; //13px
1538
$close-font-weight: $font-weight-bold !default;
1539
$close-color: $gray-800 !default;
1540
$close-text-shadow: 0 1px 0 $white !default;
1541
 
1542
$dm-close-color: $dm-gray-800 !default;
1543
$dm-close-text-shadow: 0 1px 0 $dm-white !default;
1544
 
1545
// Code
1546
 
1547
$code-font-size: 0.75rem !default;
1548
$code-color: $yellow-800 !default;
1549
 
1550
$kbd-padding-y: .2rem !default;
1551
$kbd-padding-x: .4rem !default;
1552
$kbd-font-size: $code-font-size !default;
1553
$kbd-color: $white !default;
1554
$kbd-bg: $gray-900 !default;
1555
 
1556
$pre-color: $gray-900 !default;
1557
$pre-scrollable-max-height: 340px !default;
1558
 
1559
// Dark mode.
1560
$dm-code-color: $yellow-800 !default;
1561
$dm-kbd-color: $dm-white !default;
1562
$dm-kbd-bg: $dm-gray-900 !default;
1563
$dm-pre-color: $dm-gray-900 !default;
1564
 
1565
// Utilities
1566
 
1567
$displays: none,
1568
inline,
1569
inline-block,
1570
block,
1571
table,
1572
table-row,
1573
table-cell,
1574
flex,
1575
inline-flex !default;
1576
$overflows: auto,
1577
hidden !default;
1578
$positions: static,
1579
relative,
1580
absolute,
1581
fixed,
1582
sticky !default;
1583
$user-selects: all,
1584
auto,
1585
none !default;
1586
 
1587
 
1588
// Printing
1589
 
1590
$print-page-size: a4 !default;
1591
$print-body-min-width: map-get($grid-breakpoints, "lg") !default;
1592
 
1593
 
1594
// Layout
1595
$wrapper-blocks: auto !default;
1596
$wrapper-lg: 960px !default;
1597
$wrapper-md: 860px !default;
1598
$wrapper-xl: 1200px !default;
1599
 
1600
$page-width: 1320px !default;
1601
$page-padding-global: 30px !default;
1602
 
1603
 
1604
//Drawer
1605
 
1606
// TODO: do przeglądnięcia
1607
$drawer-width: 280px !default;
1608
$drawer-left-width: 320px !default;
1609
$drawer-right-width: 320px !default;
1610
$drawer-padding-x: 20px !default;
1611
$drawer-padding-y: 20px !default;
1612
$drawer-offscreen-gutter: 20px !default;
1613
$drawer-bg-color: $container-bg !default;
1614
$scroll-bg-track: $white !default;
1615
$drawer-box-inner-padding: 3px !default;
1616
 
1617
$fixed-header-y: 100px;
1618
 
1619
$drawer-shadow-color: rgba(0, 0, 0, .25) !default;
1620
$dm-drawer-bg-color: $dm-body-bg !default;
1621
$dm-drawer-scroll-bg-track: $dm-gray-100 !default;
1622
$dm-drawer-shadow-color: rgba(255, 255, 255, 0.25) !default;
1623
 
1624
$drawer-bg: #0E1420 !default;
1625
$drawer-text: $white !default;
1626
$drawer-nav-container: $container-bg !default;
1627
$dm-drawer-nav-container: $dm-container-bg !default;
1628
$drawer-nav-btn-icon: $white !default;
1629
$drawer-border: rgba($white, .13) !default;
1630
$drawer-nav-box-bg: #04060a !default;
1631
$drawer-nav-btn-bg: $gray-100 !default;
1632
$drawer-nav-btn-text: $body-color !default;
1633
$drawer-nav-btn-text-hover: $white !default;
1634
$drawer-nav-btn-bg-hover: $primary-color-700 !default;
1635
$drawer-nav-btn-text-light: $white !default;
1636
$drawer-icon-opacity: .6 !default;
1637
$drawer-scroll-bg-track: $drawer-nav-box-bg !default;
1638
$drawer-link: $primary-color-600 !default;
1639
$drawer-link-h: $primary-color-500 !default;
1640
 
1641
$drawer-nav-icon-size: 14px !default;
1642
$drawer-nav-icon-position: $drawer-nav-icon-size * 0.5 !default;
1643
$drawer-nav-icon-font-size: $font-size-xs !default;
1644
$drawer-nav-icon-width: 30px !default;
1645
 
1646
// Dark mode.
1647
$dm-drawer-bg: $dm-body-bg !default;
1648
$dm-drawer-nav-box-bg: $dm-container-bg !default;
1649
$dm-drawer-nav-box-shadow: $dm-black !default;
1650
$dm-drawer-nav-item-active: $dm-gray-100 !default;
1651
$dm-drawer-nav-item-text-color: $dm-body-color-secondary !default;
1652
$dm-drawer-nav-item-text-color-active: $dm-gray-600 !default;
1653
$dm-drawer-nav-item-icon: $dm-body-color-secondary !default;
1654
$dm-drawer-nav-item-icon-active: $dm-gray-600 !default;
1655
$dm-drawer-heading: $dm-body-color-light !default;
1656
$dm-drawer-text: $dm-body-color-secondary !default;
1657
$dm-drawer-hr: $dm-border-color !default;
1658
$dm-drawer-link: $dm-body-color-secondary !default;
1659
$dm-drawer-link-hover-bg: $dm-drawer-nav-box-bg !default;
1660
 
1661
 
1662
// Top Bar
1663
$navbar-height: 60px !default;
1664
$topbar-padding-x: 10px !default;
1665
$topbar-padding-y: 10px !default;
1666
$topbar-fixed-btn: $navbar-height+10 !default;
1667
$topbar-bg: $container-bg !default;
1668
$topbar-text: $body-color !default;
1669
$topbar-link: $link-color !default;
1670
$topbar-link-hover: $link-hover-color !default;
1671
 
1672
$topbar-btn-text: $body-color !default;
1673
$topbar-btn: $gray-200 !default;
1674
$topbar-btn-hover: $primary-color-200 !default;
1675
$topbar-btn-hover-text: $primary-color-600 !default;
1676
 
1677
 
1678
$dm-topbar-bg: #06090c !default;
1679
$dm-topbar-text: $dm-gray-900 !default;
1680
 
1681
$dm-topbar-btn-text: $dm-gray-900 !default;
1682
$dm-topbar-btn: $dm-gray-300 !default;
1683
$dm-topbar-btn-hover: $primary-color-600 !default;
1684
$dm-topbar-btn-hover-text: $primary-color-100 !default;
1685
 
1686
$page-margin: 80px !default;
1687
$page-margin--sm: 60px !default;
1688
 
1689
$footer-bg: $gray-900 !default;
1690
$footer-border: $gray-800 !default;
1691
$footer-text-color: $gray-100 !default;
1692
$footer-link-color: $gray-100 !default;
1693
$footer-link-color-hover: $gray-300 !default;
1694
 
1695
 
1696
$max-course-card-text-height: 127px !default;
1697
 
1698
$course-card-mask-color: $black !default;
1699
$login-bgcolor: $gray-200 !default;
1700
$login-bgcolor-txt: $body-color !default;
1701
 
1702
 
1703
$page-main-container-width: 900px !default;