elli-website/themes/elli/layouts/partials/footer.html

82 lines
2.6 KiB
HTML

<footer class="container p-6 mx-auto flex justify-between items-center">
<span class="text-sm font-light">
{{ if (isset .Site.Params "copyright") }}
{{ .Site.Params.copyright | safeHTML }}
{{ else }}
{{ dateFormat "2006" now }} © {{ .Site.Title }}
{{ end }}
</span>
<span onclick="window.scrollTo({top: 0, behavior: 'smooth'})" class="p-1 cursor-pointer">
<svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M18 15l-6 -6l-6 6h12" />
</svg>
</span>
</footer>
{{ if .Site.Params.enableSearch }}
{{- partial "search-ui.html" . -}}
{{ end }}
{{ template "_internal/google_analytics.html" . }}
{{ if ge (len .Site.Languages) 3 }}
<script>
const languageMenuButton = document.querySelector('.language-switcher');
const languageDropdown = document.querySelector('.language-dropdown');
languageMenuButton.addEventListener('click', (evt) => {
evt.preventDefault()
if (languageDropdown.classList.contains('hidden')) {
languageDropdown.classList.remove('hidden')
languageDropdown.classList.add('flex')
} else {
languageDropdown.classList.add('hidden');
languageDropdown.classList.remove('flex');
}
})
</script>
{{ end }}
{{ if .Site.Params.darkModeToggle }}
<script>
// On page load or when changing themes
const darkmode = document.querySelector('.toggle-dark-mode');
function toggleDarkMode() {
if (document.documentElement.classList.contains('dark')) {
document.documentElement.classList.remove('dark')
localStorage.setItem('darkmode', 'light')
} else {
document.documentElement.classList.add('dark')
localStorage.setItem('darkmode', 'dark')
}
}
if (darkmode) {
darkmode.addEventListener('click', toggleDarkMode);
}
const darkStorage = localStorage.getItem('darkmode');
const isBrowserDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
if (!darkStorage && isBrowserDark) {
document.documentElement.classList.add('dark');
}
if (darkStorage && darkStorage === 'dark') {
toggleDarkMode();
}
</script>
{{ end }}
<script>
const mobileMenuButton = document.querySelector('.mobile-menu-button')
const mobileMenu = document.querySelector('.mobile-menu')
function toggleMenu() {
mobileMenu.classList.toggle('hidden');
mobileMenu.classList.toggle('flex');
}
if(mobileMenu && mobileMenuButton){
mobileMenuButton.addEventListener('click', toggleMenu)
}
</script>