I just updated my site to use the Hugo Pipeline. It all worked great, so I also wanted to build some more customization in it. The theme is using Materialize CSS, so I thought it would be great to have a variable primary color.
So here’s what I did. In my params I have a color set:
[params]
color = "indigo"
This is what I use to produce the css:
{{ $style := resources.Get "sass/style.scss" | resources.ExecuteAsTemplate "main.scss" . | toCSS }}
{{ $sheet := $style | minify | fingerprint }}
<link type="text/css" rel="stylesheet" href="{{ $sheet.RelPermalink }}" integrity="{{ $sheet.Data.Integrity }}" media="screen,projection"/>
The materialize scss then imports from the variables files located at components/_variables.scss
:
// Variables;
@import "components/variables";
In the file called _variables.scss
the colors I have then defined like that:
// 1. Colors
// ==========================================================================
$primary-color: color("{{ .Param "color" }}", "base") !default;
$primary-color-light: lighten($primary-color, 15%) !default;
$primary-color-dark: darken($primary-color, 15%) !default;
$secondary-color: color("{{ .Param "color" }}", "darken-4") !default;
$success-color: color("green", "base") !default;
$error-color: color("red", "base") !default;
$link-color: color("light-blue", "darken-1") !default;
I then get the following error when building the site:
Building sites … WARNING: Unknown `{{ .Params color }}` - `base` in $colors.
on line 409 of themes/material-blog/assets/sass/components/_color.scss, in function `color`
from line 38 of themes/material-blog/assets/sass/components/_variables.scss
from line 7 of themes/material-blog/assets/sass/materialize.scss
from line 1 of stdin
ERROR 2018/08/17 16:52:55 error: failed to transform resource: SCSS processing failed: file "/home/oli/Documents/Web-Stuff/Web/oli.fyi/themes/material-blog/assets/sass/components/_variables.scss", line 39, col 23: argument `$color` of `lighten($color, $amount)` must be a color
Total in 543 ms
Error: Error building site: logged 1 error(s)
What am I doing wrong? Do I need to specify the specific file which is to be executed?
Thanks for helping.