@import “../utilities/derived-variables”

@each $name, $pair in $colors

$color: nth($pair, 1)
.has-text-#{$name}
  color: $color !important
a.has-text-#{$name}
  &:hover,
  &:focus
    color: bulmaDarken($color, 10%) !important
.has-background-#{$name}
  background-color: $color !important
@if length($pair) >= 4
  $color-light: nth($pair, 3)
  $color-dark: nth($pair, 4)
  // Light
  .has-text-#{$name}-light
    color: $color-light !important
  a.has-text-#{$name}-light
    &:hover,
    &:focus
      color: bulmaDarken($color-light, 10%) !important
  .has-background-#{$name}-light
    background-color: $color-light !important
  // Dark
  .has-text-#{$name}-dark
    color: $color-dark !important
  a.has-text-#{$name}-dark
    &:hover,
    &:focus
      color: bulmaLighten($color-dark, 10%) !important
  .has-background-#{$name}-dark
    background-color: $color-dark !important

@each $name, $shade in $shades

.has-text-#{$name}
  color: $shade !important
.has-background-#{$name}
  background-color: $shade !important