Welcome to mirror list, hosted at ThFree Co, Russian Federation.

github.com/wangchucheng/hugo-eureka.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorWang Chucheng <wangchucheng@outlook.com>2020-12-09 18:58:44 +0300
committerWang Chucheng <wangchucheng@outlook.com>2020-12-09 18:58:44 +0300
commit6638e3a102cb8e678dfed77c926f2498cc05d583 (patch)
treee810d93754476291deaacef3df19d32201d1cccf /layouts
parente943060162dc4a3e91be78a060b0af185476ad7d (diff)
fix: jumping scrollbar
Closes #14
Diffstat (limited to 'layouts')
-rw-r--r--layouts/_default/baseof.html30
-rw-r--r--layouts/index.html55
-rw-r--r--layouts/partials/footer.html6
-rw-r--r--layouts/partials/header.html40
4 files changed, 61 insertions, 70 deletions
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 003c52f..0b11f59 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -1,33 +1,27 @@
<!DOCTYPE html>
-<html lang='{{ .Site.LanguageCode }}' {{ if eq .Site.Params.colorScheme "dark" }}class="dark"{{ end }}>
-{{- partial "head.html" . -}}
+<html lang='{{ .Site.LanguageCode }}' {{ if eq .Site.Params.colorScheme "dark" }}class="dark" {{ end }}>
+{{- partial "head.html" . }}
<body class="flex flex-col min-h-screen">
- <header class="flex items-center fixed w-full min-h-16 z-50 bg-secondary-bg shadow-sm">
- <div class="container mx-auto">
- <div class="max-w-screen-xl">
- {{- partial "header.html" . -}}
- </div>
+ <header class="fixed flex items-center w-full min-h-16 pl-scrollbar z-50 bg-secondary-bg shadow-sm">
+ <div class="w-full max-w-screen-xl mx-auto">
+ {{- partial "header.html" . -}}
</div>
</header>
-
<main class="flex-grow pt-16">
- {{ if .IsHome }}
+ {{- if .IsHome }}
{{- block "main" . }}{{- end }}
- {{ else }}
- <div class="container mx-auto ">
- <div class="max-w-screen-xl lg:px-4 xl:px-8">
+ {{- else }}
+ <div class="pl-scrollbar">
+ <div class="w-full max-w-screen-xl lg:px-4 xl:px-8 mx-auto">
{{- block "main" . }}{{- end }}
</div>
</div>
{{ end }}
</main>
-
- <footer>
- <div class="container mx-auto">
- <div class="max-w-screen-xl">
- {{- partial "footer.html" . -}}
- </div>
+ <footer class="pl-scrollbar">
+ <div class="w-full max-w-screen-xl mx-auto">
+ {{- partial "footer.html" . -}}
</div>
</footer>
</body>
diff --git a/layouts/index.html b/layouts/index.html
index e1e7a79..9935dc8 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,37 +1,34 @@
-{{ define "main" }}
-<div class="w-full bg-secondary-bg">
- <div class="container mx-auto">
- <div class="max-w-screen-xl">
- <div class="grid grid-cols-9 grid-rows-5 h-screen -mt-16">
- {{ $imgLeft := partial "get_image.html" (dict "context" . "url" .Site.Params.hero.imgLeft)}}
- {{ with $imgLeft }}
- <div class="col-start-2 col-span-4 row-start-3 row-span-2 bg-local bg-cover z-10 shadow-2xl"
- style="background-image: url({{ . }});"></div>
- {{ end }}
-
- <div class="col-start-3 col-span-5 row-start-2 row-span-3 z-20">
- <div class="flex flex-col items-center justify-center min-h-full">
- <div class="bg-white bg-opacity-75 shadow-2xl -m-12 p-12">
- <span
- class="font-bold text-black text-opacity-75 text-2xl md:text-3xl">{{ .Site.Params.hero.slogan }}</span>
- </div>
+{{- define "main" }}
+<div class="bg-secondary-bg pl-scrollbar">
+ <div class="max-w-screen-xl mx-auto">
+ <div class="grid grid-cols-9 grid-rows-5 h-screen -mt-16">
+ {{- $imgLeft := partial "get_image.html" (dict "context" . "url" .Site.Params.hero.imgLeft)}}
+ {{- with $imgLeft }}
+ <div class="col-start-2 col-span-4 row-start-3 row-span-2 bg-local bg-cover z-10 shadow-2xl"
+ style="background-image: url({{ . }});"></div>
+ {{- end }}
+
+ <div class="col-start-3 col-span-5 row-start-2 row-span-3 z-20">
+ <div class="flex flex-col items-center justify-center min-h-full">
+ <div class="bg-white bg-opacity-75 shadow-2xl -m-12 p-12">
+ <span
+ class="font-bold text-black text-opacity-75 text-2xl md:text-3xl">{{ .Site.Params.hero.slogan }}</span>
</div>
</div>
- {{ $imgRight := partial "get_image.html" (dict "context" . "url" .Site.Params.hero.imgRight)}}
- {{ with $imgRight }}
- <div class="col-start-5 col-span-4 row-start-2 row-span-2 bg-local bg-cover shadow-2xl"
- style="background-image: url({{ . }});">
- </div>
- {{ end }}
-
</div>
+ {{- $imgRight := partial "get_image.html" (dict "context" . "url" .Site.Params.hero.imgRight)}}
+ {{- with $imgRight }}
+ <div class="col-start-5 col-span-4 row-start-2 row-span-2 bg-local bg-cover shadow-2xl"
+ style="background-image: url({{ . }});">
+ </div>
+ {{- end }}
</div>
</div>
</div>
-<div class="container mx-auto ">
- <div class="max-w-screen-xl pt-12 md:px-4 xl:px-8">
- {{ $pages := where site.RegularPages "Type" "in" site.Params.mainSections }}
- {{ partial "masonry" $pages }}
+<div class="max-w-screen-xl mx-auto">
+ <div class="pt-12 md:px-4 xl:px-8">
+ {{- $pages := where site.RegularPages "Type" "in" site.Params.mainSections }}
+ {{- partial "masonry" $pages }}
</div>
</div>
-{{ end }} \ No newline at end of file
+{{- end }} \ No newline at end of file
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index aad195e..c56f81e 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,3 +1,3 @@
-<footer class="w-full text-center p-6 pin-b text-sm text-tertiary-text">
- <p>{{ with .Site.Copyright }}{{ replace . "{year}" now.Year | safeHTML }} &middot; {{ end }} Powered by the <a href="https://github.com/wangchucheng/hugo-eureka" class="hover:text-eureka">Eureka</a> theme for <a href="https://gohugo.io" class="hover:text-eureka">Hugo</a></p>
-</footer> \ No newline at end of file
+<div class="text-center p-6 pin-b">
+ <p class="text-sm text-tertiary-text">{{ with .Site.Copyright }}{{ replace . "{year}" now.Year | safeHTML }} &middot; {{ end }} Powered by the <a href="https://github.com/wangchucheng/hugo-eureka" class="hover:text-eureka">Eureka</a> theme for <a href="https://gohugo.io" class="hover:text-eureka">Hugo</a></p>
+</div> \ No newline at end of file
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 6183e16..3865b47 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -1,24 +1,24 @@
<script>
let storageColorScheme = localStorage.getItem("lightDarkMode")
- {{ if eq .Site.Params.colorScheme "light" }}
+ {{- if eq .Site.Params.colorScheme "light" }}
if (storageColorScheme == 'Auto' && window.matchMedia("(prefers-color-scheme: dark)").matches) {
document.getElementsByTagName('html')[0].classList.add('dark')
} else if (storageColorScheme == "Dark") {
document.getElementsByTagName('html')[0].classList.add('dark')
}
- {{ else if eq .Site.Params.colorScheme "dark" }}
+ {{- else if eq .Site.Params.colorScheme "dark" }}
if (storageColorScheme == 'Auto' && window.matchMedia("(prefers-color-scheme: light)").matches) {
document.getElementsByTagName('html')[0].classList.remove('dark')
} else if (storageColorScheme == "Light") {
document.getElementsByTagName('html')[0].classList.remove('dark')
}
- {{ else }}
+ {{- else }}
if ((storageColorScheme == 'Auto' || storageColorScheme == null) && window.matchMedia("(prefers-color-scheme: dark)").matches) {
document.getElementsByTagName('html')[0].classList.add('dark')
} else if (storageColorScheme == "Dark") {
document.getElementsByTagName('html')[0].classList.add('dark')
}
- {{ end }}
+ {{- end }}
</script>
<nav class="flex items-center justify-between flex-wrap p-4">
<a href="{{ "/" | relLangURL }}" class="mr-6 text-primary-text text-xl font-bold">{{ .Site.Title }}</a>
@@ -30,22 +30,22 @@
class="hidden block md:flex md:flex-grow md:justify-between md:items-center w-full md:w-auto text-primary-text z-20">
<div class="text-sm md:flex-grow pb-4 md:pb-0 border-b md:border-b-0" id="current-url"
currenturl="{{ .Permalink }}">
- {{ range .Site.Menus.main }}
+ {{- range .Site.Menus.main }}
<a href="{{ .URL | relLangURL }}"
class="block mt-4 md:inline-block md:mt-0 hover:text-eureka mr-4 main-a">{{ .Name }}</a>
- {{ end }}
+ {{- end }}
</div>
<div class="flex">
<div class="relative pt-4 md:pt-0">
<div class="cursor-pointer hover:text-eureka" id="lightDarkMode">
- {{ if eq .Site.Params.colorScheme "dark" }}
+ {{- if eq .Site.Params.colorScheme "dark" }}
<i class="fas fa-moon"></i>
- {{ else if eq .Site.Params.colorScheme "light" }}
+ {{- else if eq .Site.Params.colorScheme "light" }}
<i class="fas fa-sun"></i>
- {{ else }}
+ {{- else }}
<i class="fas fa-adjust"></i>
- {{ end }}
+ {{- end }}
</div>
<div class="fixed hidden inset-0 opacity-0 h-full w-full cursor-default z-30" id="is-open">
</div>
@@ -57,7 +57,7 @@
</div>
</div>
- {{ if .IsTranslated }}
+ {{- if .IsTranslated }}
<div class="relative pt-4 pl-4 md:pt-0">
<div class="cursor-pointer hover:text-eureka" id="languageMode">
<i class="fas fa-globe"></i>
@@ -68,12 +68,12 @@
<div class="absolute flex flex-col left-0 md:left-auto right-auto md:right-0 hidden bg-secondary-bg w-48 rounded py-2 border border-tertiary-bg cursor-pointer z-40"
id='languageOptions'>
<a class="px-4 py-1 hover:text-eureka" href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>
- {{ range .Translations }}
+ {{- range .Translations }}
<a class="px-4 py-1 hover:text-eureka" href="{{ .Permalink }}">{{ .Language.LanguageName }}</a>
- {{ end }}
+ {{- end }}
</div>
</div>
- {{ end }}
+ {{- end }}
</div>
</div>
@@ -83,7 +83,7 @@
</nav>
<script>
let element = document.getElementById('lightDarkMode')
- {{ if eq .Site.Params.colorScheme "light" }}
+ {{- if eq .Site.Params.colorScheme "light" }}
if (storageColorScheme == 'Auto') {
element.firstElementChild.classList.remove('fa-sun')
element.firstElementChild.setAttribute("data-icon", 'adjust')
@@ -96,7 +96,7 @@
element.firstElementChild.setAttribute("data-icon", 'moon')
element.firstElementChild.classList.add('fa-moon')
}
- {{ else if eq .Site.Params.colorScheme "dark" }}
+ {{- else if eq .Site.Params.colorScheme "dark" }}
if (storageColorScheme == 'Auto') {
element.firstElementChild.classList.remove('fa-moon')
element.firstElementChild.setAttribute("data-icon", 'adjust')
@@ -109,7 +109,7 @@
element.firstElementChild.setAttribute("data-icon", 'sun')
element.firstElementChild.classList.add('fa-sun')
}
- {{ else }}
+ {{- else }}
if (storageColorScheme == null || storageColorScheme == 'Auto') {
document.addEventListener('DOMContentLoaded', () => {
switchMode('Auto')
@@ -123,14 +123,14 @@
element.firstElementChild.setAttribute("data-icon", 'moon')
element.firstElementChild.classList.add('fa-moon')
}
- {{ end }}
+ {{- end }}
document.addEventListener('DOMContentLoaded', () => {
getcolorscheme();
switchBurger();
- {{ if .IsTranslated }}
+ {{- if .IsTranslated }}
switchLanguage()
- {{ end }}
+ {{- end }}
});
let currenturl = document.getElementById('current-url').getAttribute('currenturl')