Merge branch 'master' into css-variables-with-fallback

sass/elements/button.sass

@@ -33,6 +33,8 @@ $button-static-color: $text-light !default
 $button-static-background-color: $scheme-main-ter !default
 $button-static-border-color: $border !default
 
+$button-colors: $colors !default
+
 // The button sizes use mixins so they can be used at different breakpoints
 =button-small
   border-radius: $radius-small
@@ -115,7 +117,7 @@ $button-static-border-color: $border !default
       background-color: transparent
       border-color: transparent
       box-shadow: none
-  @each $name, $pair in $colors
+  @each $name, $pair in $button-colors
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}

sass/elements/notification.sass

@@ -5,6 +5,8 @@ $notification-padding: 1.25rem 2.5rem 1.25rem 1.5rem !default
 $notification-padding-ltr: 1.25rem 2.5rem 1.25rem 1.5rem !default
 $notification-padding-rtl: 1.25rem 1.5rem 1.25rem 2.5rem !default
 
+$notification-colors: $colors !default
+
 .notification
   --notification-background-color: #{$notification-background-color}
   --notification-radius: #{$notification-radius}
@@ -40,7 +42,7 @@ $notification-padding-rtl: 1.25rem 1.5rem 1.25rem 2.5rem !default
   .content
     color: currentColor
   // Colors
-  @each $name, $pair in $colors
+  @each $name, $pair in $notification-colors
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}

sass/elements/progress.sass

@@ -6,6 +6,8 @@ $progress-border-radius: var(--radius-rounded, #{$radius-rounded}) !default
 
 $progress-indeterminate-duration: 1.5s !default
 
+$progress-colors: $colors !default
+
 .progress
   --progress-border-radius: #{$progress-border-radius}
   --progress-bar-background-color: #{$progress-bar-background-color}
@@ -33,7 +35,7 @@ $progress-indeterminate-duration: 1.5s !default
     background-color: var(--progress-value-background-color)
     border: none
   // Colors
-  @each $name, $pair in $colors
+  @each $name, $pair in $progress-colors
     $color: nth($pair, 1)
     &.is-#{$name}
       &::-webkit-progress-value

sass/elements/table.sass

@@ -23,6 +23,8 @@ $table-row-active-color: var(--primary-invert, #{$primary-invert}) !default
 $table-striped-row-even-background-color: var(--scheme-main-bis, #{$scheme-main-bis}) !default
 $table-striped-row-even-hover-background-color: var(--scheme-main-ter, #{$scheme-main-ter}) !default
 
+$table-colors: $colors !default
+
 .table
   --table-body-background-color: #{$table-body-background-color}
   --table-color: #{$table-color}
@@ -53,7 +55,7 @@ $table-striped-row-even-hover-background-color: var(--scheme-main-ter, #{$scheme
     padding: var(--table-cell-padding)
     vertical-align: top
     // Colors
-    @each $name, $pair in $colors
+    @each $name, $pair in $table-colors
       $color: nth($pair, 1)
       $color-invert: nth($pair, 2)
       &.is-#{$name}

sass/elements/tag.sass

@@ -3,6 +3,8 @@ $tag-color: var(--text, #{$text}) !default
 $tag-radius: var(--radius, #{$radius}) !default
 $tag-delete-margin: 1px !default
 
+$tag-colors: $colors !default
+
 .tags
   align-items: center
   display: flex
@@ -76,7 +78,7 @@ $tag-delete-margin: 1px !default
     +ltr-property("margin", 0.25rem, false)
     +ltr-property("margin", -0.375rem)
   // Colors
-  @each $name, $pair in $colors
+  @each $name, $pair in $tag-colors
     $color: nth($pair, 1)
     $color-invert: nth($pair, 2)
     &.is-#{$name}