From 0f56496291b7c9a6827654cdef72f5c094ed39af Mon Sep 17 00:00:00 2001 From: George Cushen Date: Sun, 29 Oct 2023 09:18:33 +0000 Subject: [PATCH] feat: add Button block & page background option --- .github/workflows/split-packages.yaml | 2 +- .../assets/css/components/page.css | 10 ++ .../assets/js/wowchemy-theme.js | 55 +++++++++ modules/wowchemy-tailwind/data/icons.yaml | 7 +- .../layouts/_default/baseof.html | 11 +- .../layouts/partials/blocks/about.avatar.html | 2 +- .../layouts/partials/blocks/buttons.html | 26 ++++ .../partials/components/footers/minimal.html | 30 +++++ .../layouts/partials/site_footer.html | 29 ++--- .../layouts/partials/site_footer_license.html | 53 +++++++++ .../layouts/partials/site_head.html | 111 +++++++----------- 11 files changed, 241 insertions(+), 95 deletions(-) create mode 100644 modules/wowchemy-tailwind/assets/js/wowchemy-theme.js create mode 100644 modules/wowchemy-tailwind/layouts/partials/blocks/buttons.html create mode 100644 modules/wowchemy-tailwind/layouts/partials/components/footers/minimal.html create mode 100644 modules/wowchemy-tailwind/layouts/partials/site_footer_license.html diff --git a/.github/workflows/split-packages.yaml b/.github/workflows/split-packages.yaml index 2c2fc531..ee3b4d06 100644 --- a/.github/workflows/split-packages.yaml +++ b/.github/workflows/split-packages.yaml @@ -30,7 +30,7 @@ jobs: - local_path: 'course' split_repository: 'starter-hugo-online-course' - local_path: 'minimal' - split_repository: 'hugo-minimal-theme' + split_repository: 'hugo-link-in-bio-theme' - local_path: 'research-group' split_repository: 'starter-hugo-research-group' - local_path: 'second-brain' diff --git a/modules/wowchemy-tailwind/assets/css/components/page.css b/modules/wowchemy-tailwind/assets/css/components/page.css index 1acc03d1..5af406ee 100644 --- a/modules/wowchemy-tailwind/assets/css/components/page.css +++ b/modules/wowchemy-tailwind/assets/css/components/page.css @@ -70,3 +70,13 @@ color: #fff; text-decoration: none; } + +#page-bg { + position: fixed; + left: 0; + right: 0; + height: 100%; + width: 100%; + z-index: -1; + display: block; +} diff --git a/modules/wowchemy-tailwind/assets/js/wowchemy-theme.js b/modules/wowchemy-tailwind/assets/js/wowchemy-theme.js new file mode 100644 index 00000000..3e96c39b --- /dev/null +++ b/modules/wowchemy-tailwind/assets/js/wowchemy-theme.js @@ -0,0 +1,55 @@ +// Wowchemy Light / Dark theme toggle +document.addEventListener('DOMContentLoaded', function () { + addThemeToggleListener(); +}); + +function addThemeToggleListener() { + const defaultTheme = window.wowchemy.defaultTheme; + const themeToggleButtons = document.querySelectorAll(".theme-toggle"); + + // Change the icons of the buttons based on previous settings or system theme + if ( + localStorage.getItem("wc-color-theme") === "dark" || + (!("wc-color-theme" in localStorage) && + ((window.matchMedia("(prefers-color-scheme: dark)").matches && defaultTheme === "system") || defaultTheme === "dark")) + ) { + themeToggleButtons.forEach((el) => el.dataset.theme = "dark"); + } else { + themeToggleButtons.forEach((el) => el.dataset.theme = "light"); + } + + // Add click event handler to the light/dark buttons + themeToggleButtons.forEach((el) => { + el.addEventListener("click", function () { + console.debug('Theme toggled'); + if (localStorage.getItem("wc-color-theme")) { + if (localStorage.getItem("wc-color-theme") === "light") { + window.wowchemy.setDarkTheme(); + localStorage.setItem("wc-color-theme", "dark"); + } else { + window.wowchemy.setLightTheme(); + localStorage.setItem("wc-color-theme", "light"); + } + } else { + if (document.documentElement.classList.contains("dark")) { + window.wowchemy.setLightTheme(); + localStorage.setItem("wc-color-theme", "light"); + } else { + window.wowchemy.setDarkTheme(); + localStorage.setItem("wc-color-theme", "dark"); + } + } + el.dataset.theme = document.documentElement.classList.contains("dark") ? "dark" : "light"; + }); + }); + + // Listen for dark mode toggling in OS + window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", (event) => { + if (defaultTheme === "system" && !("wc-color-theme" in localStorage)) { + event.matches ? window.wowchemy.setDarkTheme() : window.wowchemy.setLightTheme(); + themeToggleButtons.forEach((el) => + el.dataset.theme = document.documentElement.classList.contains("dark") ? "dark" : "light" + ); + } + }); +} diff --git a/modules/wowchemy-tailwind/data/icons.yaml b/modules/wowchemy-tailwind/data/icons.yaml index 8a7cb4ec..bc2c0860 100644 --- a/modules/wowchemy-tailwind/data/icons.yaml +++ b/modules/wowchemy-tailwind/data/icons.yaml @@ -16,6 +16,9 @@ cv: +arxiv: +google-scholar: +orcid: # Email send: @@ -32,5 +35,7 @@ information-circle: # Skills - python: + +# Wowchemy/Hugo +hugo: diff --git a/modules/wowchemy-tailwind/layouts/_default/baseof.html b/modules/wowchemy-tailwind/layouts/_default/baseof.html index eec644de..bf608a9d 100644 --- a/modules/wowchemy-tailwind/layouts/_default/baseof.html +++ b/modules/wowchemy-tailwind/layouts/_default/baseof.html @@ -2,11 +2,15 @@ {{ "" | safeHTML }} {{ printf "" (now | time.Format ":date_long") | safeHTML }} {{- $language_code := site.LanguageCode | default "en-us" -}} - + {{ partial "site_head" . }} +
- {{ partial "navbar" . }} + {{ if (site.Params.header.navbar.enable | default true) }} + {{ partial "navbar" . }} + {{ end }}
{{ block "main" . }}{{ end }} @@ -14,5 +18,8 @@
{{ partial "site_footer" . }}
+ + {{/* EXTENSIBILITY HOOK: BODY-END */}} + {{ partial "functions/get_hook" (dict "hook" "body-end" "context" .) }} diff --git a/modules/wowchemy-tailwind/layouts/partials/blocks/about.avatar.html b/modules/wowchemy-tailwind/layouts/partials/blocks/about.avatar.html index b217d204..2e20265a 100644 --- a/modules/wowchemy-tailwind/layouts/partials/blocks/about.avatar.html +++ b/modules/wowchemy-tailwind/layouts/partials/blocks/about.avatar.html @@ -71,7 +71,7 @@
  • - {{ partial "functions/get_icon" (dict "name" .icon "attributes" "height=1.5rem") }} + {{ partial "functions/get_icon" (dict "name" .icon "attributes" "style=\"height: 1.5rem;\"") }}
    • {{ end }} diff --git a/modules/wowchemy-tailwind/layouts/partials/blocks/buttons.html b/modules/wowchemy-tailwind/layouts/partials/blocks/buttons.html new file mode 100644 index 00000000..36c4637a --- /dev/null +++ b/modules/wowchemy-tailwind/layouts/partials/blocks/buttons.html @@ -0,0 +1,26 @@ +{{/* Wowchemy Blocks: Buttons */}} +{{/* Documentation: https://wowchemy.com/blocks/ */}} +{{/* License: https://github.com/wowchemy/wowchemy-hugo-themes/blob/main/LICENSE.md */}} + +{{/* Initialise */}} +{{ $page := .wcPage }} +{{ $block := .wcBlock }} + +
    + +{{ range $index, $item := $block.content.buttons }} + +
    +
    + {{ with .icon }} + {{ partial "functions/get_icon" (dict "name" . "attributes" "height=\"40\" width=\"40\" class=\"rounded-sm\"") }} + {{ end }} +
    +
    + {{ .title | markdownify | emojify }} +
    +
    +     +{{end}} + +
    diff --git a/modules/wowchemy-tailwind/layouts/partials/components/footers/minimal.html b/modules/wowchemy-tailwind/layouts/partials/components/footers/minimal.html new file mode 100644 index 00000000..a0da5e32 --- /dev/null +++ b/modules/wowchemy-tailwind/layouts/partials/components/footers/minimal.html @@ -0,0 +1,30 @@ +{{ if .IsTranslated | and site.Params.footer.show_translations }} +
    +
    {{ i18n "languages" }}:
    +
    {{ index site.Data.i18n.languages .Lang }}
    + {{ range .Translations }} +
    {{ index site.Data.i18n.languages .Lang }}
    + {{ end }} +
    +{{ end }} + +{{ if or (site.GetPage "/terms.md") (site.GetPage "/privacy.md") }} +

    + {{ with site.GetPage "/privacy.md" }} + {{ printf "%s" .RelPermalink .Title | safeHTML }} + {{ end }} + {{ with site.GetPage "/terms.md" }} + {{ if site.GetPage "/privacy.md" }} · {{ end }} + {{ printf "%s" .RelPermalink .Title | safeHTML }} + {{ end }} +

    +{{ end }} + +{{ with site.Params.footer.text }} +

    + {{ . | markdownify | emojify }} +

    +{{ end }} + +{{/* Display copyright license. */}} +{{ partial "site_footer_license" . }} diff --git a/modules/wowchemy-tailwind/layouts/partials/site_footer.html b/modules/wowchemy-tailwind/layouts/partials/site_footer.html index 8ed28482..30c0c4b7 100644 --- a/modules/wowchemy-tailwind/layouts/partials/site_footer.html +++ b/modules/wowchemy-tailwind/layouts/partials/site_footer.html @@ -1,26 +1,16 @@ -