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

Merge pull request #12 from Junyi-99/feature-main-2

Browse Source 
update icons
This commit is contained in:
Junyi 2024-03-06 14:22:44 +08:00 committed by GitHub
commit a50af6c785
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 114 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
exampleSiteMultilingual/hugo.toml
View File

@ -17,7 +17,7 @@ description = "Anubis2 is another simple minimalist theme for Hugo blog engine."
dateFormat = "2006-01-02" dateFormat = "2006-01-02"
paginationSinglePost = true paginationSinglePost = true
style = "auto" style = "auto"
readMore = true readMore = false
readNextPosts = 2 readNextPosts = 2
copyCodeButton = true copyCodeButton = true
rssAsSocialIcon = true rssAsSocialIcon = true

45
layouts/partials/font-awesome.html
View File

@ -2,12 +2,49 @@
{{ $dict := newScratch }} {{ $dict := newScratch }}
{{ if (eq .custom true) }} {{ if (eq .iconName "github") }}
{{ $dict.Set "svg" (readFile (print "static/fa-icons/" .iconName ".svg")) }} <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 }} {{ 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 }} {{ end }}
{{- $path:="<path" -}} {{- $path:="<path" -}}
{{- $fill:="<path fill=\"currentColor\"" -}} {{- $fill:="<path fill=\"currentColor\"" -}}
{{ replace ($dict.Get "svg") $path $fill | safeHTML }} {{ replace ($dict.Get "svg") $path $fill | safeHTML }}

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

@ -4,76 +4,76 @@
{{ end }} {{ end }}
{{ if not (in (slice "light-without-switcher" "dark-without-switcher") $style) }} {{ if not (in (slice "light-without-switcher" "dark-without-switcher") $style) }}
{{ if ne "auto-without-switcher" $style }} {{ if ne "auto-without-switcher" $style }}
<div class="theme-switcher"> <div class="theme-switcher">
{{ partial "font-awesome.html" (dict "iconName" "halfcircle" "custom" false) }} {{ partial "font-awesome.html" (dict "iconName" "theme-light" "custom" false) }}
</div> </div>
{{ end }} {{ end }}
<script> <script>
const STORAGE_KEY = 'user-color-scheme' const STORAGE_KEY = 'user-color-scheme'
const defaultTheme = {{ $style }} const defaultTheme = {{ $style }}
let currentTheme let currentTheme
let switchButton let switchButton
let autoDefinedScheme = window.matchMedia('(prefers-color-scheme: dark)') let autoDefinedScheme = window.matchMedia('(prefers-color-scheme: dark)')
const autoChangeScheme = e => { const autoChangeScheme = e => {
currentTheme = e.matches ? 'dark' : 'light' currentTheme = e.matches ? 'dark' : 'light'
document.documentElement.setAttribute('data-theme', currentTheme) document.documentElement.setAttribute('data-theme', currentTheme)
} }
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
switchButton = document.querySelector('.theme-switcher') switchButton = document.querySelector('.theme-switcher')
currentTheme = detectCurrentScheme() currentTheme = detectCurrentScheme()
if (currentTheme == 'dark') { if (currentTheme == 'dark') {
document.documentElement.setAttribute('data-theme', 'dark') document.documentElement.setAttribute('data-theme', 'dark')
} }
if (currentTheme == 'auto') { if (currentTheme == 'auto') {
autoChangeScheme(autoDefinedScheme); autoChangeScheme(autoDefinedScheme);
autoDefinedScheme.addListener(autoChangeScheme); autoDefinedScheme.addListener(autoChangeScheme);
} }
if (switchButton) { if (switchButton) {
switchButton.addEventListener('click', switchTheme, false) switchButton.addEventListener('click', switchTheme, false)
} }
showContent() showContent()
}) })
function detectCurrentScheme() { function detectCurrentScheme() {
if (localStorage !== null && localStorage.getItem(STORAGE_KEY)) { if (localStorage !== null && localStorage.getItem(STORAGE_KEY)) {
return localStorage.getItem(STORAGE_KEY) return localStorage.getItem(STORAGE_KEY)
} }
if (defaultTheme) { if (defaultTheme) {
return defaultTheme return defaultTheme
} }
if (!window.matchMedia) { if (!window.matchMedia) {
return 'light' return 'light'
} }
if (window.matchMedia('(prefers-color-scheme: dark)').matches) { if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
return 'dark' return 'dark'
} }
return 'light' return 'light'
} }
function switchTheme(e) { function switchTheme(e) {
if (currentTheme == 'dark') { if (currentTheme == 'dark') {
if (localStorage !== null) if (localStorage !== null)
localStorage.setItem(STORAGE_KEY, 'light') localStorage.setItem(STORAGE_KEY, 'light')
document.documentElement.setAttribute('data-theme', 'light') document.documentElement.setAttribute('data-theme', 'light')
currentTheme = 'light' currentTheme = 'light'
} else { } else {
if (localStorage !== null) if (localStorage !== null)
localStorage.setItem(STORAGE_KEY, 'dark') localStorage.setItem(STORAGE_KEY, 'dark')
document.documentElement.setAttribute('data-theme', 'dark') document.documentElement.setAttribute('data-theme', 'dark')
currentTheme = 'dark' currentTheme = 'dark'
} }
} }
function showContent() { 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 }} {{ end }}