syntaxerrormmm/hugo-theme-anubis2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #185 from SandaruKasa/style-culling

Browse Source 
Cull excessive JS/CSS for `{dark,light}-without-swticher` styles
This commit is contained in:
Dmitry Kolosov 2023-07-06 13:26:32 +03:00 committed by GitHub
commit 598b5686a9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
assets/css/main.css
View File

@ -1,24 +1,34 @@
{{ $light := resources.Get "css/light.css" }} {{ $light := resources.Get "css/light.css" }}
{{ $dark := resources.Get "css/dark.css" }} {{ $dark := resources.Get "css/dark.css" }}
{{ $light.Content }} {{ $style := "light-without-switcher" }}
{{ if and (isset site.Params "style") (ne site.Params.style "") }}
{{ $style = site.Params.style | lower }}
{{ end }}
{{ if eq site.Params.style "dark-without-switcher" }} {{ if eq $style "dark-without-switcher" }}
:root { :root {
{{ $dark.Content }} {{ $dark.Content }}
} }
{{ else if eq site.Params.style "auto-without-switcher" }}
{{ else }}
{{ $light.Content }}
{{ if eq $style "auto-without-switcher" }}
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
:root { :root {
{{ $dark.Content }} {{ $dark.Content }}
} }
} }
{{else }} {{ else if ne $style "light-without-switcher" }}
[data-theme="dark"] { [data-theme="dark"] {
{{ $dark.Content }} {{ $dark.Content }}
} }
{{ end }} {{ end }}
{{ end }}
/* Basic */ /* Basic */
html { html {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";

7
layouts/partials/head.html
View File

@ -21,6 +21,12 @@
{{ partial "favicons.html" . }} {{ partial "favicons.html" . }}
{{ $style := "light-without-switcher" }}
{{ if and (isset site.Params "style") (ne site.Params.style "") }}
{{ $style = site.Params.style | lower }}
{{ end }}
{{ if not (in (slice "light-without-switcher" "dark-without-switcher") $style) }}
<style> <style>
body { body {
visibility: hidden; visibility: hidden;
@ -36,6 +42,7 @@
} }
</style> </style>
</noscript> </noscript>
{{end}}
{{ partial "resource.html" (dict "context" . "type" "css" "filename" "css/main.css") }} {{ partial "resource.html" (dict "context" . "type" "css" "filename" "css/main.css") }}

6
layouts/partials/theme-switcher.html
View File

@ -3,7 +3,8 @@
{{ $style = site.Params.style | lower }} {{ $style = site.Params.style | lower }}
{{ end }} {{ end }}
{{ if not (in (slice "light-without-switcher" "dark-without-switcher" "auto-without-switcher") $style) }} {{ if not (in (slice "light-without-switcher" "dark-without-switcher") $style) }}
{{ if ne "auto-without-switcher" $style }}
<button class="theme-switcher"> <button class="theme-switcher">
{{ i18n "darkTheme" }} {{ i18n "darkTheme" }}
</button> </button>
@ -84,4 +85,5 @@ function showContent() {
document.body.style.visibility = 'visible'; document.body.style.visibility = 'visible';
document.body.style.opacity = 1; document.body.style.opacity = 1;
} }
</script> </script>
{{ end }}