Css 用SASS制作GUI皮肤

我正在构建一个需要用户应用不同皮肤的应用程序。我很想听听用SASS来解决这个问题的最佳方法。我是SASS新手，这个解决方案很有效，但一定有更好的方法。该方法适用，我确信不需要额外的类

我的想法是编译并发布两个css文件，然后让用户选择一个select标记

有什么建议吗

这是我现在使用的一些示例代码：

“混合”\u skin.scss

$skin: default-skin; // Default skin
//$skin: dark-skin; //  Dark skin

.default-skin { // Default Skin
    @import 'skins/_default-skin';
}

.dark-skin { // Dark Skin
    @import 'skins/dark-skin';
}

// Applying the Skins

html {
  @if $skin == default-skin {
    @extend .default-skin;
  } @else if $skin == dark-skin {
    @extend .dark-skin;
  } @else {
    @extend .default-skin;
  }
}

默认蒙皮是局部的

.nav{
  background: $gray-light;
  button{
    color: $white;
    &:active{
      color: $gray-lighter;
    }
  }
}

.nav{
  background: $gray-darker;
  button{
    color: $black;
    &:active{
      color: $gray-dark;
    }
  }
}

皮肤偏黑

.nav{
  background: $gray-light;
  button{
    color: $white;
    &:active{
      color: $gray-lighter;
    }
  }
}

.nav{
  background: $gray-darker;
  button{
    color: $black;
    &:active{
      color: $gray-dark;
    }
  }
}

可能重复的