eyeglass-restyle/test/fixtures/restyle-extends.scss

@import "restyle";

@include restyle-define(alias-me, (
  aliased: true
));

@include restyle-define(test, (
  color: green,
  height: 100%,

  // modifiers...
  "@restyle.modifiers": (
    modified: (
      color: red
    ),
    alt: (
      width: 100%
    ),
    aliased: (
      '@restyle.alias': alias-me
    ),
    extended: (
      '@restyle.extends': modified
    ),
    extended-alt: (
      '@restyle.extends': alt modified
    ),
    extended-alias: (
      '@restyle.extends': aliased
    )
  )
));

.test {
  @include restyle(test);
}

.test2a {
  @include restyle(modified test);
}

.test2b {
  @include restyle(extended test);
}

.test3a {
  @include restyle(alias-me);
}

.test3b {
  @include restyle(aliased test);
}

.test3c {
  @include restyle(extended-alias test);
}

.test4 {
  @include restyle(extended-alt test);
}



// TODO - move to separate test
@function bg-color($color) {
  @return (
    background-color: $color
  );
}

@include restyle-define(test-special-props, (
  '@restyle.var foo': red,
  color: '@var.foo',

  // modifiers...
  "@restyle.modifiers": (
    modified: (
      '@restyle.function bg-color': (orange, ),
      '@restyle.var foo': green
    ),
    extended: (
      '@restyle.extends': modified
    )
  )
));

.test-special-props {
  @include restyle(test-special-props);
  &.modified {
    @include restyle(modified test-special-props);
  }
  &.extended {
    @include restyle(extended test-special-props);
  }
}