From 6eabf271ce198baacd4f71a1e0d6b48b05c7edb3 Mon Sep 17 00:00:00 2001
From: Junyi Hou <hji200914@gmail.com>
Date: Wed, 6 Mar 2024 14:22:23 +0800
Subject: [PATCH] update icons

---
 exampleSiteMultilingual/hugo.toml    |   2 +-
 layouts/partials/font-awesome.html   |  45 ++++++++-
 layouts/partials/theme-switcher.html | 144 +++++++++++++--------------
 3 files changed, 114 insertions(+), 77 deletions(-)

diff --git a/exampleSiteMultilingual/hugo.toml b/exampleSiteMultilingual/hugo.toml
index 7a5facf..bcc2ce6 100644
--- a/exampleSiteMultilingual/hugo.toml
+++ b/exampleSiteMultilingual/hugo.toml
@@ -17,7 +17,7 @@ description = "Anubis2 is another simple minimalist theme for Hugo blog engine."
 dateFormat = "2006-01-02"
 paginationSinglePost = true
 style = "auto"
-readMore = true
+readMore = false
 readNextPosts = 2
 copyCodeButton = true
 rssAsSocialIcon = true
diff --git a/layouts/partials/font-awesome.html b/layouts/partials/font-awesome.html
index 646aa22..3ee0f18 100644
--- a/layouts/partials/font-awesome.html
+++ b/layouts/partials/font-awesome.html
@@ -2,12 +2,49 @@
 
 {{ $dict := newScratch }}
 
-{{ if (eq .custom true) }}
-    {{ $dict.Set "svg" (readFile (print "static/fa-icons/" .iconName ".svg")) }}
+{{ if (eq .iconName "github") }}
+    <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-brand-github" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+        <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+        <path d="M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5" />
+    </svg>
+{{ else if (eq .iconName "theme-dark" )}}
+<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-moon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none" /><path d="M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 1 -8.313 -12.454z" /></svg>
+{{ else if (eq .iconName "theme-light")}}
+<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-sun-high" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+    <path d="M14.828 14.828a4 4 0 1 0 -5.656 -5.656a4 4 0 0 0 5.656 5.656z" />
+    <path d="M6.343 17.657l-1.414 1.414" />
+    <path d="M6.343 6.343l-1.414 -1.414" />
+    <path d="M17.657 6.343l1.414 -1.414" />
+    <path d="M17.657 17.657l1.414 1.414" />
+    <path d="M4 12h-2" />
+    <path d="M12 4v-2" />
+    <path d="M20 12h2" />
+    <path d="M12 20v2" />
+  </svg>
+{{ else if (eq .iconName "docs")}}
+<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-file-type-doc" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+    <path d="M14 3v4a1 1 0 0 0 1 1h4" />
+    <path d="M5 12v-7a2 2 0 0 1 2 -2h7l5 5v4" />
+    <path d="M5 15v6h1a2 2 0 0 0 2 -2v-2a2 2 0 0 0 -2 -2h-1z" />
+    <path d="M20 16.5a1.5 1.5 0 0 0 -3 0v3a1.5 1.5 0 0 0 3 0" />
+    <path d="M12.5 15a1.5 1.5 0 0 1 1.5 1.5v3a1.5 1.5 0 0 1 -3 0v-3a1.5 1.5 0 0 1 1.5 -1.5z" />
+  </svg>
+{{ else if (eq .iconName "rss")}}
+<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-rss" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+    <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+    <path d="M5 19m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" />
+    <path d="M4 4a16 16 0 0 1 16 16" />
+    <path d="M4 11a9 9 0 0 1 9 9" />
+  </svg>
 {{ else }}
-    {{ $dict.Set "svg" (partial (print "fa-icons/" .iconName ".svg")) }}
+    {{ if (eq .custom true) }}
+        {{ $dict.Set "svg" (readFile (print "static/fa-icons/" .iconName ".svg")) }}
+    {{ else }}
+        {{ $dict.Set "svg" (partial (print "fa-icons/" .iconName ".svg")) }}
+    {{ end }}
 {{ end }}
-
 {{- $path:="<path" -}}
 {{- $fill:="<path fill=\"currentColor\"" -}}
 {{ replace ($dict.Get "svg") $path $fill | safeHTML }}
diff --git a/layouts/partials/theme-switcher.html b/layouts/partials/theme-switcher.html
index 5917797..a2e22f9 100644
--- a/layouts/partials/theme-switcher.html
+++ b/layouts/partials/theme-switcher.html
@@ -4,76 +4,76 @@
 {{ end }}
 
 {{ if not (in (slice "light-without-switcher" "dark-without-switcher") $style) }}
-{{ if ne "auto-without-switcher" $style }}
-    <div class="theme-switcher">
-        {{ partial "font-awesome.html" (dict "iconName" "halfcircle" "custom" false) }}
-    </div>
-{{ end }}
-
-<script>
-const STORAGE_KEY = 'user-color-scheme'
-const defaultTheme = {{ $style }}
-
-let currentTheme
-let switchButton
-let autoDefinedScheme = window.matchMedia('(prefers-color-scheme: dark)')
-
-const autoChangeScheme = e => {
-    currentTheme = e.matches ? 'dark' : 'light'
-    document.documentElement.setAttribute('data-theme', currentTheme)
-}
-
-document.addEventListener('DOMContentLoaded', function() {
-    switchButton = document.querySelector('.theme-switcher')
-    currentTheme = detectCurrentScheme()
-    if (currentTheme == 'dark') {
-        document.documentElement.setAttribute('data-theme', 'dark')
-    }
-    if (currentTheme == 'auto') {
-        autoChangeScheme(autoDefinedScheme);
-        autoDefinedScheme.addListener(autoChangeScheme);
-    }
-
-    if (switchButton) {
-        switchButton.addEventListener('click', switchTheme, false)
-    }
-  
-    showContent()
-})
-
-function detectCurrentScheme() {
-    if (localStorage !== null && localStorage.getItem(STORAGE_KEY)) {
-        return localStorage.getItem(STORAGE_KEY)
-    } 
-    if (defaultTheme) {
-        return defaultTheme
-    } 
-    if (!window.matchMedia) {
-        return 'light'
-    } 
-    if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
-        return 'dark'
-    }
-    return 'light'
-}
-
-function switchTheme(e) {
-    if (currentTheme == 'dark') {
-        if (localStorage !== null)
-            localStorage.setItem(STORAGE_KEY, 'light')
-        document.documentElement.setAttribute('data-theme', 'light')
-        currentTheme = 'light'
-    } else {
-        if (localStorage !== null)
-            localStorage.setItem(STORAGE_KEY, 'dark')
-        document.documentElement.setAttribute('data-theme', 'dark')
-        currentTheme = 'dark'
-    }
-}
-
-function showContent() {
-    document.body.style.visibility = 'visible';
-    document.body.style.opacity = 1;
-}
-</script>
+    {{ if ne "auto-without-switcher" $style }}
+        <div class="theme-switcher">
+            {{ partial "font-awesome.html" (dict "iconName" "theme-light" "custom" false) }}
+        </div>
+    {{ end }}
+
+    <script>
+        const STORAGE_KEY = 'user-color-scheme'
+        const defaultTheme = {{ $style }}
+
+        let currentTheme
+        let switchButton
+        let autoDefinedScheme = window.matchMedia('(prefers-color-scheme: dark)')
+
+        const autoChangeScheme = e => {
+            currentTheme = e.matches ? 'dark' : 'light'
+            document.documentElement.setAttribute('data-theme', currentTheme)
+        }
+
+        document.addEventListener('DOMContentLoaded', function() {
+            switchButton = document.querySelector('.theme-switcher')
+            currentTheme = detectCurrentScheme()
+            if (currentTheme == 'dark') {
+                document.documentElement.setAttribute('data-theme', 'dark')
+            }
+            if (currentTheme == 'auto') {
+                autoChangeScheme(autoDefinedScheme);
+                autoDefinedScheme.addListener(autoChangeScheme);
+            }
+
+            if (switchButton) {
+                switchButton.addEventListener('click', switchTheme, false)
+            }
+        
+            showContent()
+        })
+
+        function detectCurrentScheme() {
+            if (localStorage !== null && localStorage.getItem(STORAGE_KEY)) {
+                return localStorage.getItem(STORAGE_KEY)
+            } 
+            if (defaultTheme) {
+                return defaultTheme
+            } 
+            if (!window.matchMedia) {
+                return 'light'
+            } 
+            if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+                return 'dark'
+            }
+            return 'light'
+        }
+
+        function switchTheme(e) {
+            if (currentTheme == 'dark') {
+                if (localStorage !== null)
+                    localStorage.setItem(STORAGE_KEY, 'light')
+                document.documentElement.setAttribute('data-theme', 'light')
+                currentTheme = 'light'
+            } else {
+                if (localStorage !== null)
+                    localStorage.setItem(STORAGE_KEY, 'dark')
+                document.documentElement.setAttribute('data-theme', 'dark')
+                currentTheme = 'dark'
+            }
+        }
+
+        function showContent() {
+            document.body.style.visibility = 'visible';
+            document.body.style.opacity = 1;
+        }
+    </script>
 {{ end }}