13hannes11/hugo-coder-timeline
1
0
Fork 0
mirror of https://github.com/13hannes11/hugo-coder-timeline.git synced 2024-09-04 00:50:58 +02:00
Code Issues Projects Releases Wiki Activity

Add theme toggle button feature (#358)

Browse Source 
* Add theme toggle button feature

* Add theme toggle button feature

* Replaced svg icon with FA icon + fixed indentation + refactored css

* Added back colorsheme configurations + script moved to be process by hugo pipe

* Make release

* Fix toggle button not working when loading new page + setTheme() refactor

* Make release

* Update exampleSite/config.toml

Co-authored-by: Luiz F. A. de Prá <luizdepra@users.noreply.github.com>
This commit is contained in:
Clément Pannetier
2020-08-11 20:51:13 +02:00
committed by GitHub
parent b3237d1ead
commit be7b79af62
12 changed files with 103 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
layouts/_default/baseof.html
View File

@@ -89,7 +89,7 @@
{{ hugo.Generator }}
</head>
{{ $csClass := "colorscheme-light" }}
{{ if eq .Site.Params.colorscheme "dark" }}
{{ $csClass = "colorscheme-dark" }}
@@ -109,6 +109,14 @@
{{ partial "footer.html" . }}
</main>
{{ if .Site.IsServer }}
{{ $script := resources.Get "js/dark-mode.js" }}
<script src="{{ $script.RelPermalink }}"></script>
{{ else }}
{{ $script := resources.Get "js/dark-mode.js" | minify | fingerprint }}
<script src="{{ $script.RelPermalink }}"></script>
{{ end }}
{{ range .Site.Params.custom_js }}
<script src="{{ . | relURL }}"></script>
{{ end }}

56
layouts/partials/header.html
View File

@@ -4,34 +4,42 @@
{{ .Site.Title }}
</a>
{{ if or .Site.Menus.main .Site.IsMultiLingual }}
<input type="checkbox" id="menu-toggle" />
<label class="menu-button float-right" for="menu-toggle"><i class="fas fa-bars"></i></label>
<ul class="navigation-list">
{{ with .Site.Menus.main}}
{{ range sort . }}
<li class="navigation-item">
<a class="navigation-link" href="{{ .URL | absLangURL }}">{{ .Name }}</a>
</li>
{{ end }}
{{ end }}
{{ if .Site.IsMultiLingual }}
{{ $node := . }}
{{ .Scratch.Set "separator" true }}
{{ range (default .Site.Home.AllTranslations .Translations) }}
{{ if ne $.Site.Language .Language }}
{{ if $node.Scratch.Get "separator" }}
<li class="navigation-item menu-separator">
<span>|</span>
</li>
{{ $node.Scratch.Set "separator" false }}
{{ end }}
<span id="dark-mode-toggle" class="float-right">
<i class="fas fa-adjust fa-fw"></i>
</span>
<input type="checkbox" id="menu-toggle" />
<label class="menu-button float-right" for="menu-toggle">
<i class="fas fa-bars fa-fw"></i>
</label>
<ul class="navigation-list">
{{ with .Site.Menus.main}}
{{ range sort . }}
<li class="navigation-item">
<a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>
<a class="navigation-link" href="{{ .URL | absLangURL }}">{{ .Name }}</a>
</li>
{{ end }}
{{ end }}
{{ end }}
</ul>
{{ if .Site.IsMultiLingual }}
{{ $node := . }}
{{ .Scratch.Set "separator" true }}
{{ range (default .Site.Home.AllTranslations .Translations) }}
{{ if ne $.Site.Language .Language }}
{{ if $node.Scratch.Get "separator" }}
<li class="navigation-item menu-separator">
<span>|</span>
</li>
{{ $node.Scratch.Set "separator" false }}
{{ end }}
<li class="navigation-item">
<a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>
</li>
{{ end }}
{{ end }}
{{ end }}
<li class="navigation-item separator">
<span>|</span>
</li>
</ul>
{{ end }}
</section>
</nav>