Modular SCSS theming

themes.scss

// modified version of http://www.sitepoint.com/sass-theming-neverending-story/
// allows to write themified code without breaking modular project structure
// only one global variable

// Theme definitions
$themes: (
  unicorn: (primary: hotpink, secondary: pink),
  dragon: (primary: firebrick, secondary: red)
);

// Engine
$th: null;
@function th($key) {
  @return map-get($th, $key);
}
@mixin th {
  @each $theme, $data in $themes {
    .th-#{$theme} & {
      $th: $data !global;
      @content;
      $th: null !global;
    }
  }
}

// Example
@mixin default-border {
  @include th { border: 1px solid th(primary); }
}
@function default-border-style {
  @return 1px solid th(primary);
}

.media {
  @include th { border-color: th(secondary); }
  @include default-border;
  &__title {
    @include th {
      color: darken(th(primary), .5);
      border: default-border-style();
    }
  }
}