From 59bea1e518ef17d1c80099e0e89665afe6a9d57e Mon Sep 17 00:00:00 2001 From: Cell <1024@lruihao.cn> Date: Wed, 13 Aug 2025 12:48:22 +0800 Subject: [PATCH] :recycle: Refactor: update CSS variable prefixes to use rootPrefix for consistency --- assets/css/_core/_media.scss | 2 +- assets/css/_core/_root.scss | 36 +++++++++---------- .../_partials/_single/_fixit-decryptor.scss | 6 ++-- assets/css/_variables.scss | 2 +- assets/css/config.template.scss | 11 ++++++ layouts/_partials/footer.html | 2 +- layouts/_partials/head/link.html | 6 ++++ layouts/_partials/header.html | 6 ++-- layouts/_partials/init/global.html | 6 ---- layouts/_partials/init/index.html | 2 +- layouts/_partials/single/footer.html | 10 ++++-- layouts/baseof.html | 6 ++-- 12 files changed, 55 insertions(+), 40 deletions(-) create mode 100644 assets/css/config.template.scss diff --git a/assets/css/_core/_media.scss b/assets/css/_core/_media.scss index 1be96977..669d551b 100644 --- a/assets/css/_core/_media.scss +++ b/assets/css/_core/_media.scss @@ -131,7 +131,7 @@ // 确保打印时没有 scrollbar :root { - --fi-scrollbar-width: none !important; + #{$rootPrefix}scrollbar-width: none !important; } *::-webkit-scrollbar { diff --git a/assets/css/_core/_root.scss b/assets/css/_core/_root.scss index b5677359..976cd812 100644 --- a/assets/css/_core/_root.scss +++ b/assets/css/_core/_root.scss @@ -2,42 +2,42 @@ // Note: Custom variable values only support SassScript inside `#{}`. // TODO migrate SCSS variables to CSS variables - --#{$prefix}global-font-color: #{$global-font-color}; - --#{$prefix}global-border-color: #{$global-border-color}; + #{$rootPrefix}global-font-color: #{$global-font-color}; + #{$rootPrefix}global-border-color: #{$global-border-color}; // Theme colors variables @each $color, $value in $theme-colors { - --#{$prefix}#{$color}: #{$value}; + #{$rootPrefix}#{$color}: #{$value}; } // Scroll margin top and Stack sticky top related - --#{$prefix}scroll-mt: calc(#{$header-height} + #{$global-scroll-margin-top}); + #{$rootPrefix}scroll-mt: calc(#{$header-height} + #{$global-scroll-margin-top}); // Set breadcrumb height to 0px if breadcrumb is disabled - --#{$prefix}breadcrumb-height: 0px; + #{$rootPrefix}breadcrumb-height: 0px; // hr / divider style - --#{$prefix}hr-background-color: #{darken($global-border-color, 5%)}; - --#{$prefix}hr-before-color: #{lighten($single-link-hover-color, 4%)}; - --#{$prefix}divider-edge-weak: linear-gradient(to right, transparent, var(--#{$prefix}divider-bg, #d0d0d5), transparent); + #{$rootPrefix}hr-background-color: #{darken($global-border-color, 5%)}; + #{$rootPrefix}hr-before-color: #{lighten($single-link-hover-color, 4%)}; + #{$rootPrefix}divider-edge-weak: linear-gradient(to right, transparent, var(#{$rootPrefix}divider-bg, #d0d0d5), transparent); // Scrollbar related variables - --#{$prefix}scrollbar-thumb-color: #{$scrollbar-color}; - --#{$prefix}scrollbar-thumb-hover-color: #{$scrollbar-hover-color}; - --#{$prefix}scrollbar-track-color: transparent; - --#{$prefix}scrollbar-width: thin; - --#{$prefix}scrollbar-width-legacy: 12px; + #{$rootPrefix}scrollbar-thumb-color: #{$scrollbar-color}; + #{$rootPrefix}scrollbar-thumb-hover-color: #{$scrollbar-hover-color}; + #{$rootPrefix}scrollbar-track-color: transparent; + #{$rootPrefix}scrollbar-width: thin; + #{$rootPrefix}scrollbar-width-legacy: 12px; } // Dark theme [data-theme=dark] { - --#{$prefix}global-font-color: #{$global-font-color-dark}; - --#{$prefix}global-border-color: #{$global-border-color-dark}; + #{$rootPrefix}global-font-color: #{$global-font-color-dark}; + #{$rootPrefix}global-border-color: #{$global-border-color-dark}; @each $color, $value in $theme-colors { - --#{$prefix}#{$color}: #{darken($value, 5%)}; + #{$rootPrefix}#{$color}: #{darken($value, 5%)}; } - --#{$prefix}hr-background-color: #{lighten($global-border-color-dark, 5%)}; - --#{$prefix}hr-before-color: #{darken($global-link-hover-color-dark, 4%)}; + #{$rootPrefix}hr-background-color: #{lighten($global-border-color-dark, 5%)}; + #{$rootPrefix}hr-before-color: #{darken($global-link-hover-color-dark, 4%)}; } diff --git a/assets/css/_partials/_single/_fixit-decryptor.scss b/assets/css/_partials/_single/_fixit-decryptor.scss index 87a290e5..e0caadb6 100644 --- a/assets/css/_partials/_single/_fixit-decryptor.scss +++ b/assets/css/_partials/_single/_fixit-decryptor.scss @@ -1,7 +1,7 @@ .fixit-decryptor-container { font-family: $global-font-family; text-align: center; - margin-block: var(--fixit-decryptor-margin-block); + margin-block: var(#{$rootPrefix}decryptor-margin-block); .fixit-decryptor-loading { vertical-align: middle; @@ -90,7 +90,7 @@ fixit-encryptor { // fixit-encryptor for for the encrypted pages article fixit-encryptor { .fixit-decryptor-container { - --fixit-decryptor-margin-block: 2rem; + #{$rootPrefix}decryptor-margin-block: 2rem; } &.decrypted > .fixit-decryptor-container { .fixit-decryptor-loading, @@ -108,7 +108,7 @@ article fixit-encryptor { // fixit-encryptor shortcodes #content fixit-encryptor { .fixit-decryptor-container { - --fixit-decryptor-margin-block: 1rem; + #{$rootPrefix}decryptor-margin-block: 1rem; } &.decrypted > .fixit-decryptor-container { display: none; diff --git a/assets/css/_variables.scss b/assets/css/_variables.scss index ee35340b..4bb7ec1e 100644 --- a/assets/css/_variables.scss +++ b/assets/css/_variables.scss @@ -3,8 +3,8 @@ // ============================== // ========== Global ========== // -// Prefix for :root CSS variables. $prefix: fi- !default; +$rootPrefix: --fi- !default; // Font and Line Height $global-font-family: system-ui, -apple-system, BlinkMacSystemFont, PingFang SC, Microsoft YaHei UI, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, Helvetica, Arial, sans-serif !default; diff --git a/assets/css/config.template.scss b/assets/css/config.template.scss new file mode 100644 index 00000000..a357515e --- /dev/null +++ b/assets/css/config.template.scss @@ -0,0 +1,11 @@ +{{- $loading := resources.Get "images/loading.svg" | minify -}} + +@charset "utf-8"; + +@import "_variables"; +$base: "{{ relURL "" }}" !default; + +:root { + #{$rootPrefix}base: "#{$base}"; + #{$rootPrefix}loading-img: url("{{ $loading.RelPermalink }}"); +} diff --git a/layouts/_partials/footer.html b/layouts/_partials/footer.html index 507fbbbb..8d0aecd6 100644 --- a/layouts/_partials/footer.html +++ b/layouts/_partials/footer.html @@ -42,7 +42,7 @@ {{- /* Author */ -}} {{- if ne $footerConfig.author false -}} - {{ partial "plugin/link.html" (dict "Destination" ($.Site.Params.author.link | default (.Site.Store.Get "homeRelPermalink")) "Content" .Site.Params.author.name) -}} + {{ partial "plugin/link.html" (dict "Destination" ($.Site.Params.author.link | default (relURL "")) "Content" .Site.Params.author.name) -}} {{- end -}} diff --git a/layouts/_partials/head/link.html b/layouts/_partials/head/link.html index c71f199f..f9e1d0f6 100644 --- a/layouts/_partials/head/link.html +++ b/layouts/_partials/head/link.html @@ -37,6 +37,12 @@ {{- end -}} +{{- /* config.min.css */ -}} +{{- $options := dict "Source" "css/config.template.scss" "Template" "css/config.scss" "Fingerprint" $fingerprint -}} +{{- $toCSS := dict "targetPath" "css/config.min.css" "enableSourceMap" true -}} +{{- $options = dict "Context" . "ToCSS" $toCSS | merge $options -}} +{{- partial "plugin/style.html" $options -}} + {{- /* style.min.css */ -}} {{- $options := dict "Source" "css/style.scss" "Fingerprint" $fingerprint -}} {{- $toCSS := dict "targetPath" "css/style.min.css" "enableSourceMap" true -}} diff --git a/layouts/_partials/header.html b/layouts/_partials/header.html index 59c1a34c..691f700e 100644 --- a/layouts/_partials/header.html +++ b/layouts/_partials/header.html @@ -1,11 +1,11 @@ {{- $buildDrafts := .Site.BuildDrafts -}} -{{- $homeRelPermalink := .Site.Store.Get "homeRelPermalink" -}} +{{- $relURL := relURL "" -}} {{- /* Desktop header */ -}}
- + {{- with .Site.Params.header.title -}} {{- with .logo -}} {{- dict "Src" . "Class" "logo" "Alt" $.Site.Title "Width" 32 "Height" 32 | partial "plugin/image.html" -}} @@ -157,7 +157,7 @@
- + {{- with .Site.Params.header.title -}} {{- with .logo -}} {{- dict "Src" . "Class" "logo" "Alt" $.Site.Title "Width" 26 "Height" 26 | partial "plugin/image.html" -}} diff --git a/layouts/_partials/init/global.html b/layouts/_partials/init/global.html index 3a5a9ddd..1cc1c05e 100644 --- a/layouts/_partials/init/global.html +++ b/layouts/_partials/init/global.html @@ -1,9 +1,3 @@ -{{- /* Set site home relative permalink */ -}} -{{- $homeRelPermalink := .Site.Home.RelPermalink -}} -{{- $homeRelPermalink = strings.TrimSuffix "archives/" $homeRelPermalink -}} -{{- $homeRelPermalink = strings.TrimSuffix "offline/" $homeRelPermalink -}} -{{- .Site.Store.Set "homeRelPermalink" $homeRelPermalink -}} - {{- /* Set pages of main sections */ -}} {{- $pages := where .Site.RegularPages "Section" "in" .Site.MainSections -}} {{- $pages = $pages | union (where .Site.RegularPages "Type" "in" .Site.MainSections) -}} diff --git a/layouts/_partials/init/index.html b/layouts/_partials/init/index.html index 23395b6f..6faa92f5 100644 --- a/layouts/_partials/init/index.html +++ b/layouts/_partials/init/index.html @@ -1,4 +1,4 @@ -{{- hugo.Store.Set "version" "v0.4.0-alpha-20250813022026-bf3fe683" -}} +{{- hugo.Store.Set "version" "v0.4.0-alpha-20250813045859-deae5256" -}} {{- .Store.Set "this" dict -}} {{- partial "init/detection-env.html" . -}} diff --git a/layouts/_partials/single/footer.html b/layouts/_partials/single/footer.html index 6a3d30c5..f927c965 100644 --- a/layouts/_partials/single/footer.html +++ b/layouts/_partials/single/footer.html @@ -19,7 +19,8 @@
- + {{- $updateTitle := dict "Date" ("2006-01-02 15:04:05" | .Lastmod.Format) | T "single.updatedOnDate" -}} + {{- with .Lastmod | dateFormat (.Site.Params.dateformat | default "2006-01-02") -}} {{- dict "Date" . | T "single.updatedOnDate" -}}  {{- if $gitRepo -}} @@ -98,12 +99,15 @@ {{- if $tagTerms -}} {{- dict "Class" "fa-solid fa-tags fa-fw me-1" | partial "plugin/icon.html" -}} {{- range $tagTerms -}} - {{ .LinkTitle }} + {{- $href := partial "function/escapeurl.html" .RelPermalink -}} + {{- $title := printf "%v - %v" (T "tags") .LinkTitle -}} + {{ .LinkTitle }} {{- end -}} {{- end -}}
- {{ T "single.back" }} | {{ T "single.home" }} + {{- $relURL := relURL "" -}} + {{ T "single.back" }} | {{ T "single.home" }}
diff --git a/layouts/baseof.html b/layouts/baseof.html index 56fa3ac2..f634bfeb 100644 --- a/layouts/baseof.html +++ b/layouts/baseof.html @@ -3,9 +3,9 @@ - {{ if .IsHome | and (ne .Site.Params.disableThemeInject true) }} - - {{ end }} + {{- if .IsHome | and (ne .Site.Params.disableThemeInject true) }} + + {{- end }}