@import './color-map.scss';
// @mixin popbg($bg: #FFF, $fontColor: #666) {
//   background-color: $bg;
//   color: $fontColor;
// }

@mixin bgColor {
  @for $i from 1 through length($colorsMap) {
    $item: nth($colorsMap, $i);
    
    &.#{map-get($item, name)} {
      $color: map-get($item, color);
      background-color: $color;
      color: #FFF;
    }
  }
}
@mixin popbg($bg: #FFF, $fontColor: #666) {
  @for $i from 1 through length($colorsMap) {
    $item: nth($colorsMap, $i);
    
    &.#{map-get($item, name)} {
      $color: map-get($item, color);
      background-color: $color;
      color: #FFF;
      .caret {
        color: $color;
      }
    }
  }
}
@mixin borderColor {
  @for $i from 1 through length($colorsMap) {
    $item: nth($colorsMap, $i);
    
    &.#{map-get($item, name)} {
      $color: map-get($item, color);
      border-color: $color;
    }
  }
}
@mixin bgColorAndTextColor {
  @for $i from 1 through length($bgColorsWithTextColor) {
    $item: nth($bgColorsWithTextColor, $i);
    
    &.#{map-get($item, name)} {
      $textColor: map-get($item, text);
      background-color: map-get($item, color);
      color: $textColor;
    }
  }
}