diff options
| -rw-r--r-- | README.md | 2 | ||||
| -rw-r--r-- | assets/css/base/base.scss | 28 | ||||
| -rw-r--r-- | layouts/pages/contact.html | 4 | ||||
| -rw-r--r-- | layouts/partials/footer.html | 3 | ||||
| -rw-r--r-- | layouts/partials/head.html | 4 | ||||
| -rw-r--r-- | static/js/bulma.js | 2 |
6 files changed, 18 insertions, 25 deletions
@@ -202,6 +202,6 @@ Font Awesome is not stored within the theme, so network access to the Font Aweso ## Theme Customization -If you want to change the colors that Huey uses, the best location is `assets/css/base/base.scss`. Huey uses Bulma, which itself uses Sass for generating CSS. This file will apply changes to Bulma CSS and generate what is ultimately created in your `public` folder. +If you want to change the colors that Huey uses, the best location is `assets/css/base/base.scss`. Huey uses Bulma, which itself uses Sass for generating CSS. This file will apply changes to Bulma CSS and generate what is ultimately created in your `public` folder. However, there are a number of Bulma variables already configurable in the `[Params]` table, which means you don't need to edit this file directly. Only edit it directly if you need to make changes. If you want to add new CSS definitions that don't exist in Bulma, add them to `assets/css/extra/extra.css` or copy CSS files to the `assets/css/extra` folder. Huey will read any CSS files in that folder.
\ No newline at end of file diff --git a/assets/css/base/base.scss b/assets/css/base/base.scss index 6629b46..1d087cf 100644 --- a/assets/css/base/base.scss +++ b/assets/css/base/base.scss @@ -1,25 +1,17 @@ -// modified Bulma default variables + +// modified Bulma default variables @import "../bulma/sass/utilities/initial-variables"; @import "../bulma/sass/utilities/functions"; -// fonts -$family-san-serif: "Helvetica", "Arial", san-serif; -$family-primary: $family-san-serif; - - - -// colors -$scheme-main: #fff; // set background color -$link: #000; // main link color -$link-hover: #444; -$footer-background-color: false; // removes background color in footer - - -// navigation -// $navbar-link-color: #ffff00; -$navbar-item-hover-color: #444; -$navbar-item-color: #888; +// override colors using Hugo parameters for Huey theme +$scheme-main: {{ .Site.Params.schemeMain | default "#ffffff" }}; +$link: {{ .Site.Params.link | default "$blue" }}; +$link-hover: {{ .Site.Params.linkHover | default "$grey-darker"}}; +$footer-color: {{ .Site.Params.footerBackground | default "true"}}; // removes background color in footer +$footer-background-color: {{ .Site.Params.footerBackgroundColor | default "#fafafa;"}}; // specifies a footer color +$navbar-item-hover-color: {{ .Site.Params.navbarItemHoverColor | default "$link;"}}; +$navbar-item-color: {{ .Site.Params.navbarItemColor | default "$text"}}; @import "../bulma/";
\ No newline at end of file diff --git a/layouts/pages/contact.html b/layouts/pages/contact.html index 91d7886..7c327f3 100644 --- a/layouts/pages/contact.html +++ b/layouts/pages/contact.html @@ -9,6 +9,4 @@ </p> </div> </main> -{{ end }} - - +{{ end }}
\ No newline at end of file diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 80ff82c..f3971e0 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -15,10 +15,11 @@ </layer> <layer> <p> + <!-- I'd love for you to keep my name, but at least the link to the theme would be nice. Thanks! - Whitlock --> Website theme is <a class="has-text-weight-semibold" href="http://github.com/alloydwhitlock/huey">Huey</a> by <a class="has-text-weight-semibold" href="https://adamwhitlock.com">Adam Whitlock</a>. </p> <p> - © {{ now.Format "2006"}} Adam Whitlock + © {{ now.Format "2006"}} {{ .Site.Params.author}} </p> </layer> </div> diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 6813def..9920599 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -7,8 +7,8 @@ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> {{- /* css */}} - {{ $sass := resources.Get "css/base/base.scss" }} - {{ $sass_bulma := $sass | resources.ToCSS | resources.Fingerprint }} + {{ $sass := resources.Get "css/base/base.scss" | resources.ExecuteAsTemplate "style.scss" . }} + {{ $sass_bulma := $sass | resources.ToCSS | minify | resources.Fingerprint }} <link rel="stylesheet" href="{{ $sass_bulma.Permalink }}" integrity="{{ $sass_bulma.Data.Integrity }}"> {{ if resources.Match "css/extra/*.css" }} diff --git a/static/js/bulma.js b/static/js/bulma.js index 9b18a3e..0c9ffc6 100644 --- a/static/js/bulma.js +++ b/static/js/bulma.js @@ -1,3 +1,5 @@ +// This javascript was used, without modification, from the Bulma CSS framework documentation. + document.addEventListener('DOMContentLoaded', () => { // Get all "navbar-burger" elements |