From 2221ca164244cf5c0527a12b11eb21e7acad201f Mon Sep 17 00:00:00 2001 From: Gabriel Arazas Date: Wed, 4 Sep 2024 14:57:32 +0800 Subject: [PATCH] users/foo-dogsquared/homepage: update theme SCSS and package definition Also, Hugo doesn't resolve symlinks unfortunately(?) so we have to go with making it a real file for now. Either way, this is only for development purposes and the real version is generated within the HM config. --- .../homepage/assets/templates/theme.scss | 81 +++++++++---------- .../foodogsquared-homepage/themes/_dark.yaml | 40 ++++----- .../foodogsquared-homepage/themes/_light.yaml | 40 ++++----- .../foo-dogsquared/files/homepage/package.nix | 2 +- 4 files changed, 82 insertions(+), 81 deletions(-) diff --git a/configs/home-manager/foo-dogsquared/files/homepage/assets/templates/theme.scss b/configs/home-manager/foo-dogsquared/files/homepage/assets/templates/theme.scss index 724fbd7e..643e1c83 100644 --- a/configs/home-manager/foo-dogsquared/files/homepage/assets/templates/theme.scss +++ b/configs/home-manager/foo-dogsquared/files/homepage/assets/templates/theme.scss @@ -19,60 +19,57 @@ */}} {{ if (and $hasLight (not $hasDark)) }} {{- warnf "No given dark theme. Generating one from the light theme..." }} + {{ $palette := $hasLight.palette }} {{ $darkTheme := dict "scheme" (printf "%s (light)" $hasLight.scheme) - "base00" $hasLight.base07 - "base01" $hasLight.base06 - "base02" $hasLight.base05 - "base03" $hasLight.base04 - "base04" $hasLight.base03 - "base05" $hasLight.base02 - "base06" $hasLight.base01 - "base07" $hasLight.base00 - "base08" (print "{lighten(saturate(#" $hasLight.base08 ", 10%), 15%)}") - "base09" (print "{lighten(saturate(#" $hasLight.base09 ", 10%), 15%)}") - "base0A" (print "{lighten(saturate(#" $hasLight.base0A ", 10%), 15%)}") - "base0B" (print "{lighten(saturate(#" $hasLight.base0B ", 10%), 15%)}") - "base0C" (print "{lighten(saturate(#" $hasLight.base0C ", 10%), 15%)}") - "base0D" (print "{lighten(saturate(#" $hasLight.base0D ", 10%), 15%)}") - "base0E" (print "{lighten(saturate(#" $hasLight.base0E ", 10%), 15%)}") - "base0F" (print "{lighten(saturate(#" $hasLight.base0F ", 10%), 15%)}") + "base00" $palette.base07 + "base01" $palette.base06 + "base02" $palette.base05 + "base03" $palette.base04 + "base04" $palette.base03 + "base05" $palette.base02 + "base06" $palette.base01 + "base07" $palette.base00 + "base08" (print "{lighten(saturate(#" $palette.base08 ", 10%), 15%)}") + "base09" (print "{lighten(saturate(#" $palette.base09 ", 10%), 15%)}") + "base0A" (print "{lighten(saturate(#" $palette.base0A ", 10%), 15%)}") + "base0B" (print "{lighten(saturate(#" $palette.base0B ", 10%), 15%)}") + "base0C" (print "{lighten(saturate(#" $palette.base0C ", 10%), 15%)}") + "base0D" (print "{lighten(saturate(#" $palette.base0D ", 10%), 15%)}") + "base0E" (print "{lighten(saturate(#" $palette.base0E ", 10%), 15%)}") + "base0F" (print "{lighten(saturate(#" $palette.base0F ", 10%), 15%)}") }} {{ $themes = merge $themes (dict "_dark" $darkTheme) }} {{ else if (and $hasDark (not $hasLight)) }} {{- warnf "No given light theme. Generating one from the dark theme..." }} + {{ $palette := $hasDark.palette }} {{ $lightTheme := dict "scheme" (printf "%s (light)" $hasDark.scheme) - "base00" $hasDark.base07 - "base01" $hasDark.base06 - "base02" $hasDark.base05 - "base03" $hasDark.base04 - "base04" $hasDark.base03 - "base05" $hasDark.base02 - "base06" $hasDark.base01 - "base07" $hasDark.base00 - "base08" (print "{darken(saturate(#" $hasDark.base08 ", 10%), 15%)}") - "base09" (print "{darken(saturate(#" $hasDark.base09 ", 10%), 15%)}") - "base0A" (print "{darken(saturate(#" $hasDark.base0A ", 10%), 15%)}") - "base0B" (print "{darken(saturate(#" $hasDark.base0B ", 10%), 15%)}") - "base0C" (print "{darken(saturate(#" $hasDark.base0C ", 10%), 15%)}") - "base0D" (print "{darken(saturate(#" $hasDark.base0D ", 10%), 15%)}") - "base0E" (print "{darken(saturate(#" $hasDark.base0E ", 10%), 15%)}") - "base0F" (print "{darken(saturate(#" $hasDark.base0F ", 10%), 15%)}") + "base00" $palette.base07 + "base01" $palette.base06 + "base02" $palette.base05 + "base03" $palette.base04 + "base04" $palette.base03 + "base05" $palette.base02 + "base06" $palette.base01 + "base07" $palette.base00 + "base08" (print "{darken(saturate(#" $palette.base08 ", 10%), 15%)}") + "base09" (print "{darken(saturate(#" $palette.base09 ", 10%), 15%)}") + "base0A" (print "{darken(saturate(#" $palette.base0A ", 10%), 15%)}") + "base0B" (print "{darken(saturate(#" $palette.base0B ", 10%), 15%)}") + "base0C" (print "{darken(saturate(#" $palette.base0C ", 10%), 15%)}") + "base0D" (print "{darken(saturate(#" $palette.base0D ", 10%), 15%)}") + "base0E" (print "{darken(saturate(#" $palette.base0E ", 10%), 15%)}") + "base0F" (print "{darken(saturate(#" $palette.base0F ", 10%), 15%)}") }} {{ $themes = merge $themes (dict "_light" $lightTheme) }} -{{ else if not $hasSystemTheme }} - {{ $systemThemes := dict - "_dark" $themes._dark_fallback - "_light" $themes._light_fallback - }} - {{ $themes = merge $systemThemes $themes }} {{ end }} {{- range $name, $scheme := $themes }} // This is a template for a colorscheme based from a Base16 data file from // https://github.com/chriskempson/base16. @mixin createColorScheme { + {{ $palette := $scheme.palette }} {{- range $i := seq 0 15 }} {{- $hex := upper (printf "%02x" $i) }} {{- $key := printf "base%s" $hex }} @@ -80,15 +77,11 @@ // TODO: Make a better way to interpolate the color strings. {{/* We're just taking advantage the fact that the SASS color functions returns the colors in the same format we needed. */}} - {{- $color := printf "#%s" (index $scheme $key) }} + {{- $color := printf "#%s" (index $palette $key) }} --{{ $key }}: {{ $color }}; {{- end }} } - {{- if (or (eq $name "_light_fallback") (eq $name "_dark_fallback")) }} - {{ continue }} - {{- end }} - {{- if eq $name "_light" }} :root { @include createColorScheme @@ -107,7 +100,7 @@ } {{- end }} - [data-theme="{{ .scheme }}"]:root, [data-theme="{{ .scheme }}"]::backdrop { + [data-theme="{{ .name }}"]:root, [data-theme="{{ .name }}"]::backdrop { @include createColorScheme; } {{- end }} diff --git a/configs/home-manager/foo-dogsquared/files/homepage/data/foodogsquared-homepage/themes/_dark.yaml b/configs/home-manager/foo-dogsquared/files/homepage/data/foodogsquared-homepage/themes/_dark.yaml index 752ec1ea..69d7bbcf 100644 --- a/configs/home-manager/foo-dogsquared/files/homepage/data/foodogsquared-homepage/themes/_dark.yaml +++ b/configs/home-manager/foo-dogsquared/files/homepage/data/foodogsquared-homepage/themes/_dark.yaml @@ -1,18 +1,22 @@ -scheme: "Bark on a tree" -author: "Gabriel Arazas (https://foo-dogsquared.github.io)" -base00: "2b221f" -base01: "412c26" -base02: "5c362c" -base03: "a45b43" -base04: "e1bcb2" -base05: "f5ecea" -base06: "fefefe" -base07: "eb8a65" -base08: "d03e68" -base09: "df937a" -base0A: "afa644" -base0B: "85b26e" -base0C: "eb914a" -base0D: "c67f62" -base0E: "8b7ab9" -base0F: "7f3F83" +system: "base16" +name: "Bark on a tree" +author: "Gabriel Arazas (https://foodogsquared.one)" +description: "Rusty theme resembling forestry inspired from Nord theme." +variant: "dark" +palette: + base00: "2b221f" + base01: "412c26" + base02: "5c362c" + base03: "a45b43" + base04: "e1bcb2" + base05: "f5ecea" + base06: "fefefe" + base07: "eb8a65" + base08: "d03e68" + base09: "df937a" + base0A: "afa644" + base0B: "85b26e" + base0C: "eb914a" + base0D: "c67f62" + base0E: "8b7ab9" + base0F: "7f3F83" diff --git a/configs/home-manager/foo-dogsquared/files/homepage/data/foodogsquared-homepage/themes/_light.yaml b/configs/home-manager/foo-dogsquared/files/homepage/data/foodogsquared-homepage/themes/_light.yaml index 4cc61cd6..6f1e31f1 100644 --- a/configs/home-manager/foo-dogsquared/files/homepage/data/foodogsquared-homepage/themes/_light.yaml +++ b/configs/home-manager/foo-dogsquared/files/homepage/data/foodogsquared-homepage/themes/_light.yaml @@ -1,18 +1,22 @@ -scheme: "Albino bark on a tree" -author: "Gabriel Arazas (https://foo-dogsquared.github.io)" -base00: "f0f0f0" -base01: "e1e3e2" -base02: "dacec7" -base03: "9d5c4c" -base04: "54352c" -base05: "392c26" -base06: "2b220f" -base07: "cb6d48" -base08: "b52b52" -base09: "d56f17" -base0A: "b0a52e" -base0B: "5c963e" -base0C: "e46403" -base0D: "954c2f" -base0E: "6751a5" -base0F: "55195a" +system: "base16" +name: "Albino bark on a tree" +author: "Gabriel Arazas (https://foodogsquared.one)" +description: "Bright rusty theme resembling forestry inspired from Nord theme." +variant: "light" +palette: + base00: "f0f0f0" + base01: "e1e3e2" + base02: "dacec7" + base03: "9d5c4c" + base04: "54352c" + base05: "392c26" + base06: "2b220f" + base07: "cb6d48" + base08: "b52b52" + base09: "d56f17" + base0A: "b0a52e" + base0B: "5c963e" + base0C: "e46403" + base0D: "954c2f" + base0E: "6751a5" + base0F: "55195a" diff --git a/configs/home-manager/foo-dogsquared/files/homepage/package.nix b/configs/home-manager/foo-dogsquared/files/homepage/package.nix index c94325f1..89109eeb 100644 --- a/configs/home-manager/foo-dogsquared/files/homepage/package.nix +++ b/configs/home-manager/foo-dogsquared/files/homepage/package.nix @@ -12,7 +12,7 @@ buildHugoSite { preBuild = '' install -Dm0644 ${../tinted-theming/base16/bark-on-a-tree.yaml} ./data/foodogsquared-homepage/themes/_dark.yaml - install -Dm0644 ${../tinted-theming/base16/albino-bark-on-a-tree.yaml} ./data/foodogsquared-homepage/themes/_dark.yaml + install -Dm0644 ${../tinted-theming/base16/albino-bark-on-a-tree.yaml} ./data/foodogsquared-homepage/themes/_light.yaml ''; meta = with lib; {