diff options
| author | Olivier Roques <oroques@cisco.com> | 2021-01-31 14:09:54 +0300 |
|---|---|---|
| committer | Olivier Roques <oroques@cisco.com> | 2021-01-31 14:09:54 +0300 |
| commit | c2f450737bac30512c82b89df3742c361c899eba (patch) | |
| tree | 6da00440f4382915881b510ab5c47f1f569b1559 | |
| parent | e151483039fb60958683184594288151876ad709 (diff) | |
Support appearance customization in site config
Closes #7
Closes #13
| -rw-r--r-- | assets/sass/researcher.scss | 15 | ||||
| -rw-r--r-- | assets/sass/variables.scss | 7 | ||||
| -rw-r--r-- | exampleSite/config.toml | 6 | ||||
| -rw-r--r-- | layouts/partials/head.html | 2 |
4 files changed, 19 insertions, 11 deletions
diff --git a/assets/sass/researcher.scss b/assets/sass/researcher.scss index df6c643..d75810f 100644 --- a/assets/sass/researcher.scss +++ b/assets/sass/researcher.scss @@ -1,6 +1,15 @@ -@import "variables"; +// Sizes +$max-width: {{ .Param "style.pageWidth" }}; +$avatar-size: {{ .Param "style.avatarSize" }}; -// Internal variables +// Colors +$black: {{ .Param "style.colorBlack" }}; +$red: {{ .Param "style.colorRed" }}; + +// Font +$font-family: {{ .Param "style.fontFamily" }}; + +// Margins $y-small: 0.6rem; $y-medium: 1.0rem; @@ -36,7 +45,7 @@ $y-medium: 1.0rem; // Style * { color: $black; - font-family: "Inconsolata"; + font-family: $font-family; line-height: 1.2; } .container { diff --git a/assets/sass/variables.scss b/assets/sass/variables.scss deleted file mode 100644 index 637e37a..0000000 --- a/assets/sass/variables.scss +++ /dev/null @@ -1,7 +0,0 @@ -// Sizes -$max-width: 750px; -$avatar-size: 90px; - -// Colors -$black: #222222; -$red: #dc3545; diff --git a/exampleSite/config.toml b/exampleSite/config.toml index 3592e04..308df72 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -14,6 +14,12 @@ googleAnalytics = "" # add your tracking id [params.footer] text = "By Olivier Roques" url = "https://github.com/ojroques/hugo-researcher" + [params.style] # appearance options (can be modified but not removed) + fontFamily = "Inconsolata" + pageWidth = "750px" + avatarSize = "90px" + colorBlack = "#222222" + colorRed = "#dc3545" [permalinks] "/" = "/:filename" diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 6c35dd1..6a9d119 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -9,7 +9,7 @@ <link href="https://fonts.googleapis.com/css2?family=Inconsolata:wght@400;700&display=swap" rel="stylesheet"> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css" integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" crossorigin="anonymous"> - {{ $style := resources.Get "sass/researcher.scss" | toCSS | minify }} + {{ $style := resources.Get "sass/researcher.scss" | resources.ExecuteAsTemplate "sass/researcher.scss" . | toCSS | minify }} <link rel="stylesheet" href="{{ $style.RelPermalink }}"> {{ with .Site.Params.favicon }} |