refactor(mixins/label): ! remove getting the $color parameter type …

…cause of it's moved to the `color()` function, indicate `label-class-variant()` and `label--variant()` mixins as deprecated and warn, replace the styles with the `background()` and `color()` mixins.

src/mixins/_label.scss

@@ -1,6 +1,10 @@
+// Functions.
 @use '../functions/color' as *;
 @use '../functions/get-var' as *;
-@use 'sass:list';
+
+// Mixins.
+@use '../mixins/color/background.mixin' as *;
+@use '../mixins/color/color.mixin' as *;
 
 // Label base style
 @mixin label-base() {
@@ -15,42 +19,31 @@
 // For example `$color: ('primary', -10%)` when font color `primary` should be darker by 10%, and `$bg-color: ('primary-dark', +10%)` when label background color is `primary-dark` lighter by 10%
 // @mixin label-variant($color: $light-color, $bg-color: $primary-color) { // old spectre.css
 @mixin label-variant(
-  $color: 'light-color',
-  $bg-color: 'primary-color',
-  $color-lightness: 0%,
-  $bg-lightness: 0%
+  $name: 'light',
+  $bg-color: 'primary',
+  $color: 'light',
 ) {
-  $alpha: 1;
-  @if list.length($color) > 1 {
-    $color-lightness: list.nth($color, 2);
-    $color: list.nth($color, 1);
-  }
-
-  @if list.length($bg-color) > 1 {
-    @if list.length($bg-color) == 3 {
-      $alpha: list.nth($bg-color, 3);
-    }
-
-    $bg-lightness: list.nth($bg-color, 2);
-    $bg-color: list.nth($bg-color, 1);
+  &.label-#{$name} {
+    // background: $bg-color; // old spectre.css
+    // background: color($bg-color);
+    @include background($bg-color);
+    // color: $color; // old spectre.css
+    // color: color($color);
+    @include color($color);
   }
-
-  // background: $bg-color; // old spectre.css
-  background: color($bg-color, $lightness: $bg-lightness, $alpha: $alpha);
-  // color: $color; // old spectre.css
-  color: color($color, $lightness: $color-lightness);
 }
 
 // The mixin contains `color` and `background` color of the given respectively `$color` and `$bg-color` sass variables.
 // It is created to pass color by using the `color()` function, to have the ability to customize all color parameters.
-@mixin label--variant(
-  $color: color('light-color'),
-  $bg-color: color('primary-color')
-) {
-  color: $color;
-  background: $bg-color;
-}
+// @mixin label--variant(
+//   $color: color('light-color'),
+//   $bg-color: color('primary-color')
+// ) {
+//   color: $color;
+//   background: $bg-color;
+// }
 
+// @deprecated
 // The mixin contains an extending class of the name prefixed with `label-` with the given color `$name` that includes a label variant of the given CSS variable names `$color` and `$bg-color`.
 // Both `$color` and `$bg-color` parameters can be passed as two-index list where the second item in the list refers to the lightness.
 // For example `$color: ('primary', -10%)` when primary color should be darker by 10%.
@@ -61,18 +54,21 @@
   $color-lightness: 0%,
   $bg-lightness: 0%
 ) {
+  @warn 'label-class-variant() mixin is deprecated to simplify spectre.css';
   &.label-#{$name} {
     @include label-variant($color, $bg-color, $color-lightness, $bg-lightness);
   }
 }
 
+// @deprecated
 // The mixin contains an extending class of the name prefixed with `label-` with the given color `$name` that includes a label variant of the given sass variable names `$color` and `$bg-color`.
 // It is created to pass color by using the `color()` function, to have the ability to customize its parameters like lightness.
 @mixin label-class--variant(
   $name: 'light',
   $color: color('light-color'),
   $bg-color: color('primary-color')
 ) {
+  @warn 'label-class--variant() mixin is deprecated to simplify spectre.css';
   &.label-#{$name} {
     @include label--variant($color, $bg-color);
   }