sass - Is it possible to make multiple css sheets from single layout-scss page, and multiple variable-scss sheets? -
i'm attempting integrate scss .net theming functionality.
ideally scss in dedicated directory, each theme have own scss page containing exclusively variable values particular theme.
the problem i'm encountering need pass placeholder variables _layout.scss sheet, , have values updated theme scss sheets. original null values outputted.
scss files
resources/scss/_variables.scss
$theme_color: null;
resources/scss/_layout.scss
@import "variables"; div { color: $theme_color; }
themes/blue/blue.scss
$theme_color: #0000ff !default; @import '../../resources/scss/layout';
themes/red/red.scss
$theme_color: #ff0000 !default; @import '../../resources/scss/layout';
desired css output files
blue.css
div { color: #0000ff; }
red.css
div { color: #ff0000; }
you have backwards. !default
flag tells sass value use if doesn't previous declaration doesn't exist.
$foo: red; $foo: blue !default; @debug $foo; // red $bar: red !default; $bar: blue; @debug $bar; // blue
you need place !default
flag on default null values, not theme values.
Comments
Post a Comment