För att kunna använda variablarna i SASS så behöver man generera upp filen och det gör man genom att lägga till 'config/config.html' i standard.html i funktionen build() som nedan:
{% if request.get["csseditor"] == "active" %}
{% set scss_build_params = scss_build_params|merge(["force"]) %}
<link rel="stylesheet" id="global-style" href="{{ build('temp/.build_temp.css',
[ 'temp/style_temp.scss'], scss_build_params) }}?rand={{ random() }}">
{% else %}
<link rel="stylesheet" id="global-style" href="{{ build('temp/.build.css',
['config/config.html','scss/style.scss'], scss_build_params) }}">
{% endif %}
Sen måste man även lägga till filen i scss/style.scss såhär:
// 1. SETTINGS
// ---------
@import 'scss/settings/variables-primary';
@import 'scss/settings/foundation-settings';
@import 'scss/settings/config';
Sen kan du använda variablarna i scss/config.scss såhär:
.test {
font-size: 18px;
@if map-get($google_data_types, "active") {
color: green;
} @else {
color: blue;
}
}