betajs/betajs-media-components

@each $color, $value in $colors {
  @if $color != default {
    .#{$cssrecorder}-#{$color}-color {

      .#{$csstheme}-dashboard {

        .#{$css}-button-selected, .#{$css}-button-inner, .#{$css}-button-inner:hover,
        .#{$css}-stop-button-container .#{$css}-button, .#{$csscommon}-accent-color {
          color: $value;
        }
        .#{$css}-button-selected, .#{$csscommon}-accent-color-border {
          border-color:  $value;
        }
        .#{$css}-button-primary, .#{$csscommon}-accent-color-bg {
          background-color: $value;
        }

        .#{$css}-settings input[type=radio]:checked + span {
          background-color: $value;
          border-color:  $value;
        }

      }

      &.#{$csstheme} {

        .#{$css}-chooser-button-0, .#{$css}-chooser-button-2 {
          color: #ffffff;
        }
        .#{$css}-chooser-button-1, .#{$css}-chooser-button-3 {
          background-color: #ffffff;
        }
      }


      .#{$cssrecorder}-loader-label {
        color: $value;
      }

      .#{$css}-imagegallery-rightbutton, .#{$css}-imagegallery-leftbutton,
      .#{$css}-chooser-button-0, .#{$css}-chooser-button-2 {
        background-color: $value;
      }

      .#{$css}-imagegallery-image:hover, .#{$css}-chooser-button-0, .#{$css}-chooser-button-2 {
        border-color: $value;
      }


      .#{$css}-message-message a {
        color: $value;
      }
    }
  }
}