Cacher is the code snippet organizer for pro developers

.cs-a .component-block {
  color: #7c868c;
}

.cs-b .component-block {
  color: #296480;
}

.cs-c .component-block {
  color: #3b8990;
}

.cs-d .component-block {
  color: #5b4344;
}

.cs-e .component-block {
  color: #7b7354;
}

.cs-f .component-block {
  color: #453460;
}

.cs-g .component-block {
  color: #84264b;
}

.cs-h .component-block {
  color: #597661;
}

// ----
// Sass (v3.4.12)
// Compass (v1.0.3)
// ----

// Color themes
$themes: (
  cs-a: rgb(124,134,140),
  cs-b: rgb(41,100,128),
  cs-c: rgb(59,137,144),
  cs-d: rgb(91,67,68),
  cs-e: rgb(123,115,84),
  cs-f: rgb(69,52,96),
  cs-g: rgb(132,38,75),
  cs-h: rgb(89,118,97)
);


// Helper theme mixin
// @param $name: name of the theme (HTML class)
// @param $color: color of the theme
@mixin theme($name, $color) {
  .#{$name} {
    .component-block{
      color: $color;
    }
  }
}

@each $key, $value in $themes {
  @include theme($key, $value);
}