@coreui/coreui 5.0.0-alpha.1 → 5.0.0-alpha.3

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 (114) hide show
  1. package/README.md +1 -1
  2. package/dist/css/coreui-grid.css +13 -13
  3. package/dist/css/coreui-grid.css.map +1 -1
  4. package/dist/css/coreui-grid.min.css +2 -2
  5. package/dist/css/coreui-grid.min.css.map +1 -1
  6. package/dist/css/coreui-grid.rtl.css +13 -18
  7. package/dist/css/coreui-grid.rtl.css.map +1 -1
  8. package/dist/css/coreui-grid.rtl.min.css +2 -6
  9. package/dist/css/coreui-grid.rtl.min.css.map +1 -1
  10. package/dist/css/coreui-reboot.css +61 -43
  11. package/dist/css/coreui-reboot.css.map +1 -1
  12. package/dist/css/coreui-reboot.min.css +2 -2
  13. package/dist/css/coreui-reboot.min.css.map +1 -1
  14. package/dist/css/coreui-reboot.rtl.css +61 -48
  15. package/dist/css/coreui-reboot.rtl.css.map +1 -1
  16. package/dist/css/coreui-reboot.rtl.min.css +2 -6
  17. package/dist/css/coreui-reboot.rtl.min.css.map +1 -1
  18. package/dist/css/coreui-utilities.css +107 -90
  19. package/dist/css/coreui-utilities.css.map +1 -1
  20. package/dist/css/coreui-utilities.min.css +2 -2
  21. package/dist/css/coreui-utilities.min.css.map +1 -1
  22. package/dist/css/coreui-utilities.rtl.css +101 -89
  23. package/dist/css/coreui-utilities.rtl.css.map +1 -1
  24. package/dist/css/coreui-utilities.rtl.min.css +2 -6
  25. package/dist/css/coreui-utilities.rtl.min.css.map +1 -1
  26. package/dist/css/coreui.css +740 -713
  27. package/dist/css/coreui.css.map +1 -1
  28. package/dist/css/coreui.min.css +2 -2
  29. package/dist/css/coreui.min.css.map +1 -1
  30. package/dist/css/coreui.rtl.css +771 -755
  31. package/dist/css/coreui.rtl.css.map +1 -1
  32. package/dist/css/coreui.rtl.min.css +2 -6
  33. package/dist/css/coreui.rtl.min.css.map +1 -1
  34. package/dist/js/coreui.bundle.js +16 -8
  35. package/dist/js/coreui.bundle.js.map +1 -1
  36. package/dist/js/coreui.bundle.min.js +2 -2
  37. package/dist/js/coreui.bundle.min.js.map +1 -1
  38. package/dist/js/coreui.esm.js +16 -8
  39. package/dist/js/coreui.esm.js.map +1 -1
  40. package/dist/js/coreui.esm.min.js +2 -2
  41. package/dist/js/coreui.esm.min.js.map +1 -1
  42. package/dist/js/coreui.js +16 -8
  43. package/dist/js/coreui.js.map +1 -1
  44. package/dist/js/coreui.min.js +2 -2
  45. package/dist/js/coreui.min.js.map +1 -1
  46. package/js/dist/alert.js +1 -1
  47. package/js/dist/base-component.js +2 -2
  48. package/js/dist/base-component.js.map +1 -1
  49. package/js/dist/button.js +1 -1
  50. package/js/dist/carousel.js +1 -1
  51. package/js/dist/collapse.js +1 -1
  52. package/js/dist/dom/data.js +1 -1
  53. package/js/dist/dom/event-handler.js +1 -1
  54. package/js/dist/dom/manipulator.js +1 -1
  55. package/js/dist/dom/selector-engine.js +3 -3
  56. package/js/dist/dom/selector-engine.js.map +1 -1
  57. package/js/dist/dropdown.js +1 -1
  58. package/js/dist/modal.js +1 -1
  59. package/js/dist/navigation.js +1 -1
  60. package/js/dist/offcanvas.js +1 -1
  61. package/js/dist/popover.js +1 -1
  62. package/js/dist/scrollspy.js +1 -1
  63. package/js/dist/sidebar.js +1 -1
  64. package/js/dist/tab.js +13 -5
  65. package/js/dist/tab.js.map +1 -1
  66. package/js/dist/toast.js +1 -1
  67. package/js/dist/tooltip.js +1 -1
  68. package/js/dist/util/backdrop.js +1 -1
  69. package/js/dist/util/component-functions.js +1 -1
  70. package/js/dist/util/config.js +1 -1
  71. package/js/dist/util/focustrap.js +1 -1
  72. package/js/dist/util/index.js +1 -1
  73. package/js/dist/util/sanitizer.js +1 -1
  74. package/js/dist/util/scrollbar.js +1 -1
  75. package/js/dist/util/swipe.js +1 -1
  76. package/js/dist/util/template-factory.js +1 -1
  77. package/js/src/base-component.js +1 -1
  78. package/js/src/dom/selector-engine.js +2 -2
  79. package/js/src/tab.js +14 -4
  80. package/package.json +35 -35
  81. package/scss/_button-group.scss +3 -3
  82. package/scss/_buttons.scss +1 -1
  83. package/scss/_card.scss +3 -3
  84. package/scss/_close.scss +1 -0
  85. package/scss/_dropdown.scss +4 -4
  86. package/scss/_header.scss +3 -12
  87. package/scss/_nav.scss +77 -17
  88. package/scss/_reboot.scss +5 -4
  89. package/scss/_root.scss +32 -11
  90. package/scss/_tooltip.scss +1 -1
  91. package/scss/_type.scss +1 -1
  92. package/scss/_utilities.scss +3 -3
  93. package/scss/_variables-dark.scss +33 -34
  94. package/scss/_variables.scss +153 -151
  95. package/scss/coreui-grid.rtl.scss +0 -3
  96. package/scss/coreui-reboot.rtl.scss +0 -3
  97. package/scss/coreui-utilities.rtl.scss +0 -3
  98. package/scss/coreui.rtl.scss +0 -3
  99. package/scss/coreui.scss +0 -1
  100. package/scss/forms/_floating-labels.scss +3 -2
  101. package/scss/forms/_form-check.scss +13 -12
  102. package/scss/forms/_form-control.scss +1 -1
  103. package/scss/forms/_form-range.scss +3 -3
  104. package/scss/forms/_form-select.scss +1 -1
  105. package/scss/helpers/_color-bg.scss +1 -2
  106. package/scss/helpers/_vr.scss +1 -1
  107. package/scss/mixins/_banner.scss +1 -1
  108. package/scss/mixins/_caret.scss +3 -3
  109. package/scss/mixins/_grid.scss +1 -1
  110. package/scss/mixins/_list-group.scss +1 -1
  111. package/scss/sidebar/_sidebar-narrow.scss +33 -13
  112. package/scss/sidebar/_sidebar-nav.scss +114 -19
  113. package/scss/sidebar/_sidebar.scss +85 -134
  114. package/scss/_subheader.scss +0 -72
@@ -36,13 +36,15 @@ $grays: (
36
36
  // scss-docs-end gray-colors-map
37
37
  // fusv-enable
38
38
 
39
- $high-emphasis: rgba(shift-color($gray-base, +26%), .95) !default;
40
- $medium-emphasis: rgba(shift-color($gray-base, +26%), .681) !default;
41
- $disabled: rgba(shift-color($gray-base, +26%), .38) !default;
39
+ // fusv-disable
40
+ $high-emphasis: rgba(shift-color($gray-base, +26%), .95) !default; // Deprecated in 5.0.0
41
+ $medium-emphasis: rgba(shift-color($gray-base, +26%), .681) !default; // Deprecated in 5.0.0
42
+ $disabled: rgba(shift-color($gray-base, +26%), .38) !default; // Deprecated in 5.0.0
42
43
 
43
- $high-emphasis-inverse: rgba($white, .87) !default;
44
- $medium-emphasis-inverse: rgba($white, .6) !default;
45
- $disabled-inverse: rgba($white, .38) !default;
44
+ $high-emphasis-inverse: rgba($white, .87) !default; // Deprecated in 5.0.0
45
+ $medium-emphasis-inverse: rgba($white, .6) !default; // Deprecated in 5.0.0
46
+ $disabled-inverse: rgba($white, .38) !default; // Deprecated in 5.0.0
47
+ // fusv-enable
46
48
 
47
49
  // scss-docs-start color-variables
48
50
  $blue: #0d6efd !default;
@@ -81,8 +83,8 @@ $colors: (
81
83
  $min-contrast-ratio: 4.5 !default;
82
84
 
83
85
  // Customize the light and dark text colors for use in our color contrast function.
84
- $color-contrast-dark: $high-emphasis-inverse !default;
85
- $color-contrast-light: $high-emphasis !default;
86
+ $color-contrast-dark: $black !default;
87
+ $color-contrast-light: $white !default;
86
88
 
87
89
  // fusv-disable
88
90
  $blue-100: tint-color($blue, 80%) !default;
@@ -307,7 +309,7 @@ $cyans: (
307
309
  // fusv-enable
308
310
 
309
311
  // scss-docs-start theme-color-variables
310
- $primary: #321fdb !default;
312
+ $primary: #5856d6 !default;
311
313
  $secondary: #9da5b1 !default;
312
314
  $success: #2eb85c !default;
313
315
  $info: #39f !default;
@@ -331,7 +333,7 @@ $theme-colors: (
331
333
  // scss-docs-end theme-colors-map
332
334
 
333
335
  // scss-docs-start theme-text-variables
334
- $primary-text-emphasis: #1f1498 !default;
336
+ $primary-text-emphasis: #3634a3 !default;
335
337
  $secondary-text-emphasis: #212233 !default;
336
338
  $success-text-emphasis: #0f5722 !default;
337
339
  $info-text-emphasis: #184c77 !default;
@@ -342,7 +344,7 @@ $dark-text-emphasis: $gray-800 !default;
342
344
  // scss-docs-end theme-text-variables
343
345
 
344
346
  // scss-docs-start theme-bg-subtle-variables
345
- $primary-bg-subtle: #ccc7f6 !default;
347
+ $primary-bg-subtle: #cfc7f3 !default;
346
348
  $secondary-bg-subtle: #ced2d8 !default;
347
349
  $success-bg-subtle: #cbedd6 !default;
348
350
  $info-bg-subtle: #c0e6ff !default;
@@ -353,7 +355,7 @@ $dark-bg-subtle: $gray-400 !default;
353
355
  // scss-docs-end theme-bg-subtle-variables
354
356
 
355
357
  // scss-docs-start theme-border-subtle-variables
356
- $primary-border-subtle: #988fed !default;
358
+ $primary-border-subtle: #9d92e6 !default;
357
359
  $secondary-border-subtle: #9da5b1 !default;
358
360
  $success-border-subtle: #96dbad !default;
359
361
  $info-border-subtle: #80c6ff !default;
@@ -450,13 +452,13 @@ $position-values: (
450
452
  // Settings for the `<body>` element.
451
453
 
452
454
  $body-text-align: null !default;
453
- $body-color: $high-emphasis !default;
455
+ $body-color: rgba(shift-color($gray-base, +26%), .95) !default;
454
456
  $body-bg: $white !default;
455
457
 
456
- $body-secondary-color: $medium-emphasis !default;
458
+ $body-secondary-color: rgba(shift-color($gray-base, +26%), .681) !default;
457
459
  $body-secondary-bg: $gray-200 !default;
458
460
 
459
- $body-tertiary-color: $disabled !default;
461
+ $body-tertiary-color: rgba(shift-color($gray-base, +26%), .38) !default;
460
462
  $body-tertiary-bg: $gray-100 !default;
461
463
 
462
464
  $body-emphasis-color: $black !default;
@@ -568,7 +570,7 @@ $border-radius-xxl: 2rem !default;
568
570
  $border-radius-pill: 50rem !default;
569
571
  // scss-docs-end border-radius-variables
570
572
  // fusv-disable
571
- $border-radius-2xl: $border-radius-xxl !default; // Deprecated in v4.3.0
573
+ $border-radius-2xl: $border-radius-xxl !default; // Deprecated in v5.0.0
572
574
  // fusv-enable
573
575
 
574
576
  // scss-docs-start box-shadow-variables
@@ -578,8 +580,8 @@ $box-shadow-lg: 0 1rem 3rem rgba($black, .175) !default;
578
580
  $box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;
579
581
  // scss-docs-end box-shadow-variables
580
582
 
581
- $component-active-color: $high-emphasis-inverse !default;
582
- $component-active-bg: $primary !default;
583
+ $component-active-color: rgba($white, .87) !default;
584
+ $component-active-bg: var(--#{$prefix}primary) !default;
583
585
 
584
586
  // scss-docs-start focus-ring-variables
585
587
  $focus-ring-width: .25rem !default;
@@ -699,7 +701,7 @@ $small-font-size: .875em !default;
699
701
  $sub-sup-font-size: .75em !default;
700
702
 
701
703
  // fusv-disable
702
- $text-muted: var(--#{$prefix}secondary-color) !default; // Deprecated in 5.3.0
704
+ $text-muted: var(--#{$prefix}secondary-color) !default; // Deprecated in 5.0.0
703
705
  // fusv-enable
704
706
 
705
707
  $initialism-font-size: $small-font-size !default;
@@ -721,6 +723,10 @@ $hr-border-color: null !default; // Allows for inherited colors
721
723
  $hr-border-width: var(--#{$prefix}border-width) !default;
722
724
  $hr-opacity: .25 !default;
723
725
 
726
+ // scss-docs-start vr-variables
727
+ $vr-border-width: var(--#{$prefix}border-width) !default;
728
+ // scss-docs-end vr-variables
729
+
724
730
  $legend-margin-bottom: .5rem !default;
725
731
  $legend-font-size: 1.5rem !default;
726
732
  $legend-font-weight: null !default;
@@ -730,6 +736,7 @@ $dt-font-weight: $font-weight-bold !default;
730
736
  $list-inline-padding: .5rem !default;
731
737
 
732
738
  $mark-padding: .1875em !default;
739
+ $mark-color: $body-color !default;
733
740
  $mark-bg: $yellow-100 !default;
734
741
  // scss-docs-end type-variables
735
742
 
@@ -753,7 +760,7 @@ $table-cell-padding-x-sm: .25rem !default;
753
760
 
754
761
  $table-cell-vertical-align: top !default;
755
762
 
756
- $table-color: var(--#{$prefix}body-color) !default;
763
+ $table-color: var(--#{$prefix}emphasis-color) !default;
757
764
  $table-bg: var(--#{$prefix}body-bg) !default;
758
765
  $table-accent-bg: transparent !default;
759
766
 
@@ -761,17 +768,17 @@ $table-th-font-weight: null !default;
761
768
 
762
769
  $table-striped-color: $table-color !default;
763
770
  $table-striped-bg-factor: .05 !default;
764
- $table-striped-bg: rgba($black, $table-striped-bg-factor) !default;
771
+ $table-striped-bg: rgba(var(--#{$prefix}emphasis-color-rgb), $table-striped-bg-factor) !default;
765
772
 
766
773
  $table-active-color: $table-color !default;
767
774
  $table-active-bg-factor: .1 !default;
768
- $table-active-bg: rgba($black, $table-active-bg-factor) !default;
775
+ $table-active-bg: rgba(var(--#{$prefix}emphasis-color-rgb), $table-active-bg-factor) !default;
769
776
 
770
777
  $table-hover-color: $table-color !default;
771
778
  $table-hover-bg-factor: .075 !default;
772
- $table-hover-bg: rgba($black, $table-hover-bg-factor) !default;
779
+ $table-hover-bg: rgba(var(--#{$prefix}emphasis-color-rgb), $table-hover-bg-factor) !default;
773
780
 
774
- $table-border-factor: .1 !default;
781
+ $table-border-factor: .2 !default;
775
782
  $table-border-width: var(--#{$prefix}border-width) !default;
776
783
  $table-border-color: var(--#{$prefix}border-color) !default;
777
784
 
@@ -861,6 +868,7 @@ $btn-active-box-shadow: inset 0 3px 5px rgba($black, .125) !default;
861
868
  $btn-link-color: var(--#{$prefix}link-color) !default;
862
869
  $btn-link-hover-color: var(--#{$prefix}link-hover-color) !default;
863
870
  $btn-link-disabled-color: $gray-600 !default;
871
+ $btn-link-focus-shadow-rgb: to-rgb(mix(color-contrast($link-color), $link-color, 15%)) !default;
864
872
 
865
873
  // Allows for customizing button radius independently from global border radius
866
874
  $btn-border-radius: var(--#{$prefix}border-radius) !default;
@@ -946,14 +954,14 @@ $input-disabled-border-color: null !default;
946
954
  $input-color: var(--#{$prefix}body-color) !default;
947
955
  $input-border-color: var(--#{$prefix}border-color) !default;
948
956
  $input-border-width: $input-btn-border-width !default;
949
- $input-box-shadow: $box-shadow-inset !default;
957
+ $input-box-shadow: var(--#{$prefix}box-shadow-inset) !default;
950
958
 
951
959
  $input-border-radius: var(--#{$prefix}border-radius) !default;
952
960
  $input-border-radius-sm: var(--#{$prefix}border-radius-sm) !default;
953
961
  $input-border-radius-lg: var(--#{$prefix}border-radius-lg) !default;
954
962
 
955
963
  $input-focus-bg: $input-bg !default;
956
- $input-focus-border-color: tint-color($component-active-bg, 50%) !default;
964
+ $input-focus-border-color: tint-color($primary, 50%) !default;
957
965
  $input-focus-color: $input-color !default;
958
966
  $input-focus-width: $input-btn-focus-width !default;
959
967
  $input-focus-box-shadow: $input-btn-focus-box-shadow !default;
@@ -1075,7 +1083,7 @@ $form-select-feedback-icon-size: $input-height-inner-half $input-height-i
1075
1083
  $form-select-border-width: $input-border-width !default;
1076
1084
  $form-select-border-color: $input-border-color !default;
1077
1085
  $form-select-border-radius: $input-border-radius !default;
1078
- $form-select-box-shadow: $box-shadow-inset !default;
1086
+ $form-select-box-shadow: var(--#{$prefix}box-shadow-inset) !default;
1079
1087
 
1080
1088
  $form-select-focus-border-color: $input-focus-border-color !default;
1081
1089
  $form-select-focus-width: $input-focus-width !default;
@@ -1098,9 +1106,9 @@ $form-select-transition: $input-transition !default;
1098
1106
  $form-range-track-width: 100% !default;
1099
1107
  $form-range-track-height: .5rem !default;
1100
1108
  $form-range-track-cursor: pointer !default;
1101
- $form-range-track-bg: var(--#{$prefix}tertiary-bg) !default;
1109
+ $form-range-track-bg: var(--#{$prefix}secondary-bg) !default;
1102
1110
  $form-range-track-border-radius: 1rem !default;
1103
- $form-range-track-box-shadow: $box-shadow-inset !default;
1111
+ $form-range-track-box-shadow: var(--#{$prefix}box-shadow-inset) !default;
1104
1112
 
1105
1113
  $form-range-thumb-width: 1rem !default;
1106
1114
  $form-range-thumb-height: $form-range-thumb-width !default;
@@ -1110,7 +1118,7 @@ $form-range-thumb-border-radius: 1rem !default;
1110
1118
  $form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;
1111
1119
  $form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;
1112
1120
  $form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge
1113
- $form-range-thumb-active-bg: tint-color($component-active-bg, 70%) !default;
1121
+ $form-range-thumb-active-bg: tint-color($primary, 70%) !default;
1114
1122
  $form-range-thumb-disabled-bg: var(--#{$prefix}secondary-color) !default;
1115
1123
  $form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
1116
1124
  // scss-docs-end form-range-variables
@@ -1187,9 +1195,10 @@ $form-validation-states: (
1187
1195
  $zindex-dropdown: 1000 !default;
1188
1196
  $zindex-sticky: 1020 !default;
1189
1197
  $zindex-fixed: 1030 !default;
1190
- $zindex-sidebar-backdrop: 1030 !default;
1191
1198
  $zindex-offcanvas-backdrop: 1040 !default;
1199
+ $zindex-sidebar-backdrop: 1040 !default;
1192
1200
  $zindex-offcanvas: 1045 !default;
1201
+ $zindex-sidebar-overlaid: 1045 !default;
1193
1202
  $zindex-modal-backdrop: 1050 !default;
1194
1203
  $zindex-modal: 1055 !default;
1195
1204
  $zindex-popover: 1070 !default;
@@ -1232,6 +1241,19 @@ $nav-tabs-link-active-border-color: var(--#{$prefix}border-color) var(--#{$prefi
1232
1241
  $nav-pills-border-radius: var(--#{$prefix}border-radius) !default;
1233
1242
  $nav-pills-link-active-color: $component-active-color !default;
1234
1243
  $nav-pills-link-active-bg: $component-active-bg !default;
1244
+
1245
+ $nav-underline-gap: 1rem !default;
1246
+ $nav-underline-border-width: .125rem !default;
1247
+ $nav-underline-link-active-color: var(--#{$prefix}emphasis-color) !default;
1248
+
1249
+ $nav-underline-border-gap: .5rem !default;
1250
+ $nav-underline-border-border-color: var(--#{$prefix}border-color) !default;
1251
+ $nav-underline-border-border-width: .125rem !default;
1252
+ $nav-underline-border-link-padding-y: .5rem !default;
1253
+ $nav-underline-border-link-padding-x: .5rem !default;
1254
+ $nav-underline-border-link-color: var(--#{$prefix}secondary-color) !default;
1255
+ $nav-underline-border-link-active-color: var(--#{$prefix}primary) !default;
1256
+ $nav-underline-border-link-disabled-color: var(--#{$prefix}tertiary-color) !default;
1235
1257
  // scss-docs-end nav-variables
1236
1258
 
1237
1259
 
@@ -1273,8 +1295,9 @@ $navbar-dark-color: rgba($white, .55) !default;
1273
1295
  $navbar-dark-hover-color: rgba($white, .75) !default;
1274
1296
  $navbar-dark-active-color: $white !default;
1275
1297
  $navbar-dark-disabled-color: rgba($white, .25) !default;
1276
- $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;
1277
- $navbar-dark-toggler-border-color: rgba($white, .1) !default;
1298
+ $navbar-dark-icon-color: $navbar-dark-color !default;
1299
+ $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-icon-color}' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>") !default;
1300
+ $navbar-dark-toggler-border-color: rgba($white, .1) !default;$navbar-dark-toggler-border-color: rgba($white, .1) !default;
1278
1301
  $navbar-dark-brand-color: $navbar-dark-active-color !default;
1279
1302
  $navbar-dark-brand-hover-color: $navbar-dark-active-color !default;
1280
1303
  // scss-docs-end navbar-dark-variables
@@ -1298,7 +1321,7 @@ $dropdown-border-width: var(--#{$prefix}border-width) !default;
1298
1321
  $dropdown-inner-border-radius: calc(#{$dropdown-border-radius} - #{$dropdown-border-width}) !default; // stylelint-disable-line function-disallowed-list
1299
1322
  $dropdown-divider-bg: $dropdown-border-color !default;
1300
1323
  $dropdown-divider-margin-y: $spacer * .5 !default;
1301
- $dropdown-box-shadow: $box-shadow !default;
1324
+ $dropdown-box-shadow: var(--#{$prefix}box-shadow) !default;
1302
1325
 
1303
1326
  $dropdown-link-color: var(--#{$prefix}body-color) !default;
1304
1327
  $dropdown-link-hover-color: $dropdown-link-color !default;
@@ -1316,7 +1339,7 @@ $dropdown-header-color: $gray-600 !default;
1316
1339
  $dropdown-header-padding-x: $dropdown-item-padding-x !default;
1317
1340
  $dropdown-header-padding-y: $dropdown-padding-y !default;
1318
1341
  // fusv-disable
1319
- $dropdown-header-padding: $dropdown-header-padding-y $dropdown-header-padding-x !default; // Deprecated in v5.2.0
1342
+ $dropdown-header-padding: $dropdown-header-padding-y $dropdown-header-padding-x !default; // Deprecated in v4.2.6
1320
1343
  // fusv-enable
1321
1344
  // scss-docs-end dropdown-variables
1322
1345
 
@@ -1487,7 +1510,7 @@ $popover-border-width: var(--#{$prefix}border-width) !default;
1487
1510
  $popover-border-color: var(--#{$prefix}border-color-translucent) !default;
1488
1511
  $popover-border-radius: var(--#{$prefix}border-radius-lg) !default;
1489
1512
  $popover-inner-border-radius: calc(#{$popover-border-radius} - #{$popover-border-width}) !default; // stylelint-disable-line function-disallowed-list
1490
- $popover-box-shadow: $box-shadow !default;
1513
+ $popover-box-shadow: var(--#{$prefix}box-shadow) !default;
1491
1514
 
1492
1515
  $popover-header-font-size: $font-size-base !default;
1493
1516
  $popover-header-bg: var(--#{$prefix}secondary-bg) !default;
@@ -1509,12 +1532,6 @@ $popover-arrow-color: $popover-bg !default;
1509
1532
  $popover-arrow-outer-color: var(--#{$prefix}border-color-translucent) !default;
1510
1533
  // fusv-enable
1511
1534
 
1512
- // fusv-disable
1513
- // Deprecated in 4.2.0 for CSS variables
1514
- $popover-arrow-color: $popover-bg !default;
1515
- $popover-arrow-outer-color: var(--#{$prefix}border-color-translucent) !default;
1516
- // fusv-enable
1517
-
1518
1535
 
1519
1536
  // Toasts
1520
1537
 
@@ -1571,8 +1588,8 @@ $modal-content-border-color: var(--#{$prefix}border-color-translucent) !d
1571
1588
  $modal-content-border-width: var(--#{$prefix}border-width) !default;
1572
1589
  $modal-content-border-radius: var(--#{$prefix}border-radius-lg) !default;
1573
1590
  $modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;
1574
- $modal-content-box-shadow-xs: $box-shadow-sm !default;
1575
- $modal-content-box-shadow-sm-up: $box-shadow !default;
1591
+ $modal-content-box-shadow-xs: var(--#{$prefix}box-shadow-sm) !default;
1592
+ $modal-content-box-shadow-sm-up: var(--#{$prefix}box-shadow) !default;
1576
1593
 
1577
1594
  $modal-backdrop-bg: $black !default;
1578
1595
  $modal-backdrop-opacity: .5 !default;
@@ -1624,9 +1641,6 @@ $alert-margin-bottom: 1rem !default;
1624
1641
  $alert-border-radius: var(--#{$prefix}border-radius) !default;
1625
1642
  $alert-link-font-weight: $font-weight-bold !default;
1626
1643
  $alert-border-width: var(--#{$prefix}border-width) !default;
1627
- $alert-bg-scale: -80% !default;
1628
- $alert-border-scale: -70% !default;
1629
- $alert-color-scale: 40% !default;
1630
1644
  $alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side
1631
1645
  // scss-docs-end alert-variables
1632
1646
 
@@ -1689,8 +1703,8 @@ $list-group-border-radius: var(--#{$prefix}border-radius) !default;
1689
1703
  $list-group-item-padding-y: $spacer * .5 !default;
1690
1704
  $list-group-item-padding-x: $spacer !default;
1691
1705
  // fusv-disable
1692
- $list-group-item-bg-scale: -80% !default; // Deprecated in v4.3.0
1693
- $list-group-item-color-scale: 40% !default; // Deprecated in v4.3.0
1706
+ $list-group-item-bg-scale: -80% !default; // Deprecated in v5.0.0
1707
+ $list-group-item-color-scale: 40% !default; // Deprecated in v5.0.0
1694
1708
  // fusv-enable
1695
1709
 
1696
1710
  $list-group-hover-bg: var(--#{$prefix}tertiary-bg) !default;
@@ -1722,6 +1736,7 @@ $header-border-width: var(--#{$prefix}border-width) !default;
1722
1736
  $header-hover-color: rgba(var(--#{$prefix}emphasis-color-rgb), .8) !default;
1723
1737
  $header-active-color: rgba(var(--#{$prefix}emphasis-color-rgb), 1) !default;
1724
1738
  $header-disabled-color: rgba(var(--#{$prefix}emphasis-color-rgb), .3) !default;
1739
+ $header-transition: box-shadow .15s ease-in-out !default;
1725
1740
 
1726
1741
  // Compute the header-brand padding-y so the header-brand will have the same height as header-text and nav-link
1727
1742
  $nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
@@ -1750,26 +1765,6 @@ $header-divider-border-width: var(--#{$prefix}border-width) !default;
1750
1765
  $header-divider-border-color: var(--#{$prefix}border-color) !default;
1751
1766
  // scss-docs-end header-variables
1752
1767
 
1753
- // Subheader
1754
- // scss-docs-start subheader-variables
1755
- $subheader-min-height: 3rem !default;
1756
- $subheader-padding-y: $spacer * .5 !default;
1757
- $subheader-padding-x: $spacer !default;
1758
- $subheader-border-color: var(--#{$prefix}border-color) !default;
1759
- $subheader-border-width: 1px !default;
1760
-
1761
- $subheader-nav-link-padding-x: .5rem !default;
1762
- // scss-docs-end subheader-variables
1763
-
1764
- // Default theme //TODO: check
1765
- // scss-docs-start subheader-default-themes
1766
- $subheader-bg: $white !default;
1767
- $subheader-color: var(--#{$prefix}secondary-color) !default;
1768
- $subheader-hover-color: var(--#{$prefix}body-color) !default;
1769
- $subheader-active-color: var(--#{$prefix}body-color) !default;
1770
- $subheader-disabled-color: $disabled !default;
1771
- // scss-docs-end subheader-default-themes
1772
-
1773
1768
 
1774
1769
  // Image thumbnails
1775
1770
 
@@ -1852,93 +1847,100 @@ $sidebar-widths: (
1852
1847
  lg: 20rem,
1853
1848
  xl: 24rem
1854
1849
  ) !default;
1855
- $sidebar-padding-y: 0 !default;
1856
- $sidebar-padding-x: 0 !default;
1857
- $sidebar-color: $high-emphasis-inverse !default;
1858
- $sidebar-bg: $gray-800 !default;
1859
- $sidebar-border-width: 0 !default;
1860
- $sidebar-border-color: transparent !default;
1850
+ $sidebar-narrow-width: 4rem !default;
1851
+ $sidebar-padding-y: $spacer !default;
1852
+ $sidebar-padding-x: $spacer !default;
1853
+ $sidebar-color: var(--#{$prefix}body-color) !default;
1854
+ $sidebar-bg: var(--#{$prefix}body-bg) !default;
1861
1855
  $sidebar-transition: margin-left .15s, margin-right .15s, box-shadow .075s, transform .15s, width .15s, z-index 0s ease .15s !default;
1862
-
1863
- $sidebar-brand-height: 4rem !default;
1864
- $sidebar-brand-color: $high-emphasis-inverse !default;
1856
+ $sidebar-brand-color: var(--#{$prefix}body-color) !default;
1865
1857
  $sidebar-brand-bg: rgba($black, .2) !default;
1866
-
1867
- $sidebar-header-height: 4rem !default;
1868
- $sidebar-header-padding-y: .75rem !default;
1869
- $sidebar-header-padding-x: 1rem !default;
1870
- $sidebar-header-bg: rgba($black, .2) !default;
1871
- $sidebar-header-height-transition: height .15s, padding .15s !default;
1872
-
1873
- $sidebar-narrow-width: 4rem !default;
1874
-
1875
1858
  $sidebar-backdrop-bg: $black !default;
1876
1859
  $sidebar-backdrop-opacity: .5 !default;
1877
-
1878
- $sidebar-nav-title-padding-y: .75rem !default;
1879
- $sidebar-nav-title-padding-x: 1rem !default;
1880
- $sidebar-nav-title-margin-top: 1rem !default;
1881
- $sidebar-nav-title-color: $medium-emphasis-inverse !default;
1882
- $sidebar-nav-title-transition: height .15s, margin .15s !default;
1883
-
1884
- $sidebar-nav-link-padding-y: .8445rem !default;
1885
- $sidebar-nav-link-padding-x: 1rem !default;
1886
- $sidebar-nav-link-color: $medium-emphasis-inverse !default;
1887
- $sidebar-nav-link-bg: transparent !default;
1888
- $sidebar-nav-link-border-width: 0 !default;
1889
- $sidebar-nav-link-border-color: transparent !default;
1890
- $sidebar-nav-link-border-radius: 0 !default;
1891
- $sidebar-nav-link-transition: background .15s ease, color .15s ease !default;
1892
- $sidebar-nav-link-icon-color: $medium-emphasis-inverse !default;
1893
-
1894
- $sidebar-nav-link-hover-color: $high-emphasis-inverse !default;
1895
- $sidebar-nav-link-hover-bg: rgba($white, .05) !default;
1896
- $sidebar-nav-link-hover-icon-color: $high-emphasis-inverse !default;
1897
-
1898
- $sidebar-nav-link-active-color: $high-emphasis-inverse !default;
1899
- $sidebar-nav-link-active-bg: rgba($white, .05) !default;
1900
- $sidebar-nav-link-active-icon-color: $high-emphasis-inverse !default;
1901
-
1902
- $sidebar-nav-link-disabled-color: $disabled-inverse !default;
1903
- $sidebar-nav-link-disabled-icon-color: $sidebar-nav-link-icon-color !default;
1904
-
1905
- $sidebar-nav-icon-width: 4rem !default;
1906
- $sidebar-nav-icon-height: 1.25rem !default;
1907
- $sidebar-nav-icon-font-size: $sidebar-nav-icon-height !default;
1908
-
1909
- $sidebar-nav-group-bg: rgba(0, 0, 0, .2) !default;
1910
- $sidebar-nav-group-transition: background .15s ease-in-out !default;
1911
- $sidebar-nav-group-toggle-show-color: $sidebar-nav-link-color !default;
1912
-
1913
- $sidebar-nav-group-items-padding-y: 0 !default;
1914
- $sidebar-nav-group-items-padding-x: 0 !default;
1915
- $sidebar-nav-group-items-transition: height .15s ease !default;
1916
-
1917
- $sidebar-nav-group-indicator-color: $medium-emphasis-inverse !default;
1918
- $sidebar-nav-group-indicator-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$sidebar-nav-group-indicator-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;
1919
- $sidebar-nav-group-indicator-hover-color: $sidebar-nav-link-hover-color !default;
1920
- $sidebar-nav-group-indicator-hover-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$sidebar-nav-group-indicator-hover-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;
1921
- $sidebar-nav-group-indicator-transition: transform .15s !default;
1922
-
1923
- $sidebar-footer-height: auto !default;
1924
- $sidebar-footer-padding-y: .75rem !default;
1925
- $sidebar-footer-padding-x: 1rem !default;
1926
- $sidebar-footer-bg: rgba($black, .2) !default;
1927
- $sidebar-footer-height-transition: height .15s, padding .15s !default;
1928
-
1929
- $sidebar-toggler-height: 3rem !default;
1930
- $sidebar-toggler-bg: rgba($black, .2) !default;
1931
- $sidebar-toggler-transition: transform .15s !default;
1932
-
1933
- $sidebar-toggler-indicator-width: 4rem !default;
1934
- $sidebar-toggler-indicator-height: 3rem !default;
1935
- $sidebar-toggler-indicator-color: $disabled-inverse !default;
1936
- $sidebar-toggler-indicator-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 14'%3E%3Cpath fill='#{$sidebar-toggler-indicator-color}' d='M9.148 2.352l-4.148 4.148 4.148 4.148q0.148 0.148 0.148 0.352t-0.148 0.352l-1.297 1.297q-0.148 0.148-0.352 0.148t-0.352-0.148l-5.797-5.797q-0.148-0.148-0.148-0.352t0.148-0.352l5.797-5.797q0.148-0.148 0.352-0.148t0.352 0.148l1.297 1.297q0.148 0.148 0.148 0.352t-0.148 0.352z'/%3E%3C/svg%3E") !default;
1937
- $sidebar-toggler-hover-bg: rgba(0, 0, 0, .3) !default;
1938
- $sidebar-toggler-indicator-hover-color: $sidebar-nav-link-hover-color !default;
1939
- $sidebar-toggler-indicator-hover-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 14'%3E%3Cpath fill='#{$sidebar-toggler-indicator-hover-color}' d='M9.148 2.352l-4.148 4.148 4.148 4.148q0.148 0.148 0.148 0.352t-0.148 0.352l-1.297 1.297q-0.148 0.148-0.352 0.148t-0.352-0.148l-5.797-5.797q-0.148-0.148-0.148-0.352t0.148-0.352l5.797-5.797q0.148-0.148 0.352-0.148t0.352 0.148l1.297 1.297q0.148 0.148 0.148 0.352t-0.148 0.352z'/%3E%3C/svg%3E") !default;
1940
1860
  // scss-docs-end sidebar-variables
1941
1861
 
1862
+ // scss-docs-start sidebar-nav-variables
1863
+ $sidebar-nav-padding-y: $sidebar-padding-y * .5 !default;
1864
+ $sidebar-nav-padding-x: $sidebar-padding-x * .5 !default;
1865
+
1866
+ $sidebar-nav-title-padding-y: .75rem !default;
1867
+ $sidebar-nav-title-padding-x: 1rem !default;
1868
+ $sidebar-nav-title-margin-top: 1rem !default;
1869
+ $sidebar-nav-title-color: var(--#{$prefix}tertiary-color) !default;
1870
+ $sidebar-nav-title-transition: height .15s, margin .15s !default;
1871
+
1872
+ $sidebar-nav-link-padding-y: .75rem !default;
1873
+ $sidebar-nav-link-padding-x: 1rem !default;
1874
+ $sidebar-nav-link-color: var(--#{$prefix}body-color) !default;
1875
+ $sidebar-nav-link-bg: transparent !default;
1876
+ $sidebar-nav-link-border-width: 0 !default;
1877
+ $sidebar-nav-link-border-color: transparent !default;
1878
+ $sidebar-nav-link-border-radius: var(--#{$prefix}border-radius) !default;
1879
+ $sidebar-nav-link-transition: background .15s ease, color .15s ease, gap .15s ease !default;
1880
+
1881
+ $sidebar-narrow-nav-link-padding-y: .75rem !default;
1882
+ $sidebar-narrow-nav-link-padding-x: .5rem !default;
1883
+
1884
+ $sidebar-nav-link-icon-margin: .75rem !default;
1885
+ $sidebar-nav-link-icon-color: var(--#{$prefix}tertiary-color) !default;
1886
+ $sidebar-nav-link-icon-width: 1.25rem !default;
1887
+ $sidebar-nav-link-icon-height: 1.25rem !default;
1888
+ $sidebar-nav-link-icon-font-size: $sidebar-nav-link-icon-height !default;
1889
+
1890
+ $sidebar-nav-link-icon-bullet-size: .3125rem !default;
1891
+ $sidebar-nav-link-icon-bullet-bg: transparent !default;
1892
+ $sidebar-nav-link-icon-bullet-border-width: 1px !default;
1893
+ $sidebar-nav-link-icon-bullet-border-color: var(--#{$prefix}tertiary-color) !default;
1894
+ $sidebar-nav-link-icon-bullet-border-radius: 50rem !default;
1895
+
1896
+ $sidebar-nav-link-hover-color: var(--#{$prefix}emphasis-color) !default;
1897
+ $sidebar-nav-link-hover-bg: var(--#{$prefix}tertiary-bg) !default;
1898
+ $sidebar-nav-link-hover-icon-color: var(--#{$prefix}body-color) !default;
1899
+ $sidebar-nav-link-hover-icon-bullet-bg: transparent !default;
1900
+ $sidebar-nav-link-hover-icon-bullet-border-color: var(--#{$prefix}body-color) !default;
1901
+
1902
+ $sidebar-nav-link-active-color: var(--#{$prefix}emphasis-color) !default;
1903
+ $sidebar-nav-link-active-bg: var(--#{$prefix}tertiary-bg) !default;
1904
+ $sidebar-nav-link-active-icon-color: var(--#{$prefix}primary) !default;
1905
+ $sidebar-nav-link-active-icon-bullet-bg: transparent !default;
1906
+ $sidebar-nav-link-active-icon-bullet-border-color: var(--#{$prefix}primary) !default;
1907
+
1908
+ $sidebar-nav-link-disabled-color: var(--#{$prefix}tertiary-color) !default;
1909
+ $sidebar-nav-link-disabled-icon-color: var(--#{$prefix}tertiary-color) !default;
1910
+ $sidebar-nav-link-disabled-icon-bullet-bg: transparent !default;
1911
+ $sidebar-nav-link-disabled-icon-bullet-border-color: var(--#{$prefix}tertiary-color) !default;
1912
+
1913
+ $sidebar-nav-group-bg: transparent !default;
1914
+ $sidebar-nav-group-border-width: 0 !default;
1915
+ $sidebar-nav-group-border-color: transparent !default;
1916
+ $sidebar-nav-group-border-radius: var(--#{$prefix}border-radius) !default;
1917
+ $sidebar-nav-group-transition: background .15s ease-in-out !default;
1918
+ $sidebar-nav-group-toggle-show-color: $sidebar-nav-link-color !default;
1919
+
1920
+ $sidebar-nav-group-items-padding-y: 0 !default;
1921
+ $sidebar-nav-group-items-padding-x: 0 !default;
1922
+ $sidebar-nav-group-items-transition: height .15s ease !default;
1923
+
1924
+ $sidebar-nav-group-indicator-color: var(--#{$prefix}tertiary-color) !default;
1925
+ $sidebar-nav-group-indicator-icon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><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;
1926
+ $sidebar-nav-group-indicator-hover-color: $sidebar-nav-link-hover-color !default;
1927
+ $sidebar-nav-group-indicator-hover-icon: $sidebar-nav-group-indicator-icon !default;
1928
+ $sidebar-nav-group-indicator-transition: transform .15s !default;
1929
+ // scss-docs-end sidebar-nav-variables
1930
+
1931
+ // scss-docs-start sidebar-toggler
1932
+ $sidebar-toggler-width: .5rem !default;
1933
+ $sidebar-toggler-height: .5rem !default;
1934
+ $sidebar-toggler-padding-x: .25rem !default;
1935
+ $sidebar-toggler-padding-y: .25rem !default;
1936
+ $sidebar-toggler-color: var(--#{$prefix}tertiary-color) !default;
1937
+ $sidebar-toggler-bg: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cg xmlns='http://www.w3.org/2000/svg' transform='matrix(-1 0 0 -1 512 512)'%3E%3Cpath fill='%23000' d='M472,16H40A24.028,24.028,0,0,0,16,40V200H48V48H464V464H48V304H16V472a24.028,24.028,0,0,0,24,24H472a24.028,24.028,0,0,0,24-24V40A24.028,24.028,0,0,0,472,16Z'/%3E%3Cpolygon fill='%23000' points='209.377 363.306 232.004 385.933 366.627 251.31 232.004 116.687 209.377 139.313 305.374 235.311 16 235.311 16 267.311 305.372 267.311 209.377 363.306'/%3E%3C/g%3E%3C/svg%3E") !default;
1938
+ $sidebar-toggler-focus-shadow: $focus-ring-box-shadow !default;
1939
+ $sidebar-toggler-hover-color: var(--#{$prefix}secondary-color) !default;
1940
+ $sidebar-toggler-focus-color: var(--#{$prefix}secondary-color) !default;
1941
+ $sidebar-toggler-transition: transform .15s !default;
1942
+ // scss-docs-end sidebar-toggler
1943
+
1942
1944
  // Footer
1943
1945
  // scss-docs-start footer-variables
1944
1946
  $footer-min-height: 3rem !default;
@@ -2011,6 +2013,6 @@ $kbd-padding-x: .375rem !default;
2011
2013
  $kbd-font-size: $code-font-size !default;
2012
2014
  $kbd-color: var(--#{$prefix}body-bg) !default;
2013
2015
  $kbd-bg: var(--#{$prefix}body-color) !default;
2014
- $nested-kbd-font-weight: null !default; // Deprecated in v5.2.0, removing in v6
2016
+ $nested-kbd-font-weight: null !default; // Deprecated in v4.2.6, removing in v6
2015
2017
 
2016
2018
  $pre-color: null !default;
@@ -1,6 +1,3 @@
1
- @import "mixins/banner";
2
- @include bsBanner("");
3
-
4
1
  $enable-ltr: false !default;
5
2
  $enable-rtl: true !default;
6
3
 
@@ -1,6 +1,3 @@
1
- @import "mixins/banner";
2
- @include bsBanner("");
3
-
4
1
  $enable-ltr: false !default;
5
2
  $enable-rtl: true !default;
6
3
 
@@ -1,6 +1,3 @@
1
- @import "mixins/banner";
2
- @include bsBanner("");
3
-
4
1
  $enable-ltr: false !default;
5
2
  $enable-rtl: true !default;
6
3
 
@@ -1,6 +1,3 @@
1
- @import "mixins/banner";
2
- @include bsBanner("");
3
-
4
1
  $enable-ltr: false !default;
5
2
  $enable-rtl: true !default;
6
3
 
package/scss/coreui.scss CHANGED
@@ -49,7 +49,6 @@
49
49
  @import "header";
50
50
  @import "icon";
51
51
  @import "sidebar";
52
- @import "subheader";
53
52
 
54
53
  // Helpers
55
54
  @import "helpers";
@@ -12,7 +12,7 @@
12
12
  > label {
13
13
  position: absolute;
14
14
  top: 0;
15
- left: 0;
15
+ @include ltr-rtl("left", 0);
16
16
  z-index: 2;
17
17
  height: 100%; // allow textareas
18
18
  padding: $form-floating-padding-y $form-floating-padding-x;
@@ -84,7 +84,8 @@
84
84
  }
85
85
  }
86
86
 
87
- > :disabled ~ label {
87
+ > :disabled ~ label,
88
+ > .form-control:disabled ~ label { // Required for `.form-control`s because of specificity
88
89
  color: $form-floating-label-disabled-color;
89
90
 
90
91
  &::after {