@import “variables”;
$grays: (
"100": $gray-100, "200": $gray-200, "300": $gray-300, "400": $gray-400, "500": $gray-500, "600": $gray-600, "700": $gray-700, "800": $gray-800, "900": $gray-900
) !default;
$colors: (
"base": $color-base, "primary-light": $color-primary-light, "primary": $color-primary, "primary-dark": $color-primary-dark, "secondary-light": $color-secondary-light, "secondary": $color-secondary, "secondary-dark": $color-secondary-dark, "link-light": $color-link-light, "link": $color-link, "link-dark": $color-link-dark, "rang1": $color-rang1, "rang2": $color-rang2, "logo": $color-logo
) !default;
// .color-gray- // .bg-gray- @each $key, $value in $grays {
.color-gray-#{$key} {color: $value} .bg-gray-#{$key} {background-color: $value}
}
@each $key, $value in $colors {
.color-#{$key} {color: $value} .bg-#{$key} {background-color: $value}
}