Merge branch 'v4-dev' of https://github.com/coreui/coreui into v4-dev-sync

Author: mrholek

docs/assets/js/application.js

@@ -122,7 +122,7 @@
     })
 
   // Insert copy to clipboard button before .highlight
-  var btnHtml = '<div class="docs-clipboard"><button type="button" class="btn-clipboard btn-ghost-primary" title="Copy to clipboard"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><polygon fill="var(--ci-primary-color, currentColor)" points="408 432 376 432 376 464 112 464 112 136 144 136 144 104 80 104 80 496 408 496 408 432" class="ci-primary"/><path fill="var(--ci-primary-color, currentColor)" d="M176,16V400H496V153.373L358.627,16ZM464,368H208V48H312V200H464Zm0-200H344V48h1.372L464,166.627Z" class="ci-primary"/></svg></button></div>'
+  var btnHtml = '<div class="docs-clipboard"><button type="button" class="btn-clipboard btn btn-ghost-primary" title="Copy to clipboard"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><polygon fill="var(--ci-primary-color, currentColor)" points="408 432 376 432 376 464 112 464 112 136 144 136 144 104 80 104 80 496 408 496 408 432" class="ci-primary"/><path fill="var(--ci-primary-color, currentColor)" d="M176,16V400H496V153.373L358.627,16ZM464,368H208V48H312V200H464Zm0-200H344V48h1.372L464,166.627Z" class="ci-primary"/></svg></button></div>'
   document.querySelectorAll('div.highlight')
     .forEach(function (element) {
       element.insertAdjacentHTML('beforebegin', btnHtml)

docs/assets/scss/_layout.scss

@@ -1,6 +1,6 @@
 .wrapper {
   width: 100%;
-  padding-left: var(--cui-sidebar-occupy, 0);
+  padding-left: var(--cui-sidebar-occupy-start, 0);
   transform: translateZ(0);
   will-change: auto;
   @include transition(padding .15s);

scss/_functions.scss

@@ -241,7 +241,6 @@ $_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003
 
 // scss-docs-start table-color-functions
 @function table-color-map($background) {
-  $table-bg: $background;
   $color: color-contrast(opaque($body-bg, $background));
   $striped-bg: mix($color, $background, percentage($table-striped-bg-factor));
   $active-bg: mix($color, $background, percentage($table-active-bg-factor));

scss/_tables.scss

@@ -28,8 +28,8 @@
     padding: $table-cell-padding-y $table-cell-padding-x;
     color: var(--#{$variable-prefix}table-color);
     background-color: var(--#{$variable-prefix}table-bg);
-    border-bottom: $table-border-width;
     border-bottom-color: var(--#{$variable-prefix}table-border-color);
+    border-bottom-width: $table-border-width;
     box-shadow: inset 0 0 0 9999px var(--#{$variable-prefix}table-accent-bg);
   }
 
@@ -144,17 +144,6 @@
   }
 }
 
-@each $state, $map in $alert-variants {
-  $background: map-get($map, "background");
-  $border-color: map-get($map, "border-color");
-  $color: contrast-ratio-correction(map-get($map, "color"), map-get($map, "background"), abs($alert-color-scale), $state);
-  $link-color: map-get($map, "link-color");
-
-  .alert-#{$state} {
-    @include alert-variant($background, $border-color, $color, $link-color);
-  }
-}
-
 // @each $state, $map in $list-group-variants {
 
 // }

scss/mixins/_table-variants.scss

@@ -1,14 +1,14 @@
 // scss-docs-start table-variant
 @mixin table-variant($map) {
-  --#{$variable-prefix}table-bg: #{map-get($map, "table-bg")};
-  --#{$variable-prefix}table-color: #{map-get($map, "table-color")};
-  --#{$variable-prefix}table-border-color: #{map-get($map, "table-border-color")};
-  --#{$variable-prefix}table-striped-bg: #{map-get($map, "table-striped-bg")};
-  --#{$variable-prefix}table-striped-color: #{map-get($map, "table-striped-color")};
-  --#{$variable-prefix}table-active-bg: #{map-get($map, "table-active-bg")};
-  --#{$variable-prefix}table-active-color: #{map-get($map, "table-active-color")};
-  --#{$variable-prefix}table-hover-bg: #{map-get($map, "table-hover-bg")};
-  --#{$variable-prefix}table-hover-color: #{map-get($map, "table-hover-color")};
+  --#{$variable-prefix}table-bg: #{map-get($map, "bg")};
+  --#{$variable-prefix}table-color: #{map-get($map, "color")};
+  --#{$variable-prefix}table-border-color: #{map-get($map, "border-color")};
+  --#{$variable-prefix}table-striped-bg: #{map-get($map, "striped-bg")};
+  --#{$variable-prefix}table-striped-color: #{map-get($map, "striped-color")};
+  --#{$variable-prefix}table-active-bg: #{map-get($map, "active-bg")};
+  --#{$variable-prefix}table-active-color: #{map-get($map, "active-color")};
+  --#{$variable-prefix}table-hover-bg: #{map-get($map, "hover-bg")};
+  --#{$variable-prefix}table-hover-color: #{map-get($map, "hover-color")};
 
   color: var(--#{$variable-prefix}table-color);
   border-color: var(--#{$variable-prefix}table-border-color);