diff options
| author | Darshan Baral <darshanbaral@gmail.com> | 2020-05-04 20:04:40 +0300 |
|---|---|---|
| committer | Darshan Baral <darshanbaral@gmail.com> | 2020-05-04 20:04:40 +0300 |
| commit | 5caeb63fc2224b46d938a633f4365ea0a9b33c42 (patch) | |
| tree | eda2dda875b70d866f55805b0fed1896f57a71d0 | |
| parent | 64a5766979272f2c6fb1e6c85699249721df4b6c (diff) | |
Implementing Modal
| -rw-r--r-- | layouts/_default/baseof.html | 1 | ||||
| -rw-r--r-- | layouts/_default/list.html | 4 | ||||
| -rw-r--r-- | layouts/_default/single.html | 4 | ||||
| -rw-r--r-- | layouts/partials/hamburgerCross.html | 15 | ||||
| -rw-r--r-- | layouts/partials/header.html | 28 | ||||
| -rw-r--r-- | layouts/partials/menu.html | 5 | ||||
| -rw-r--r-- | static/css/main.css | 11 |
7 files changed, 44 insertions, 24 deletions
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 0210d94..1890230 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -3,7 +3,6 @@ {{- partial "head.html" . -}} <body style="padding: 0 8px;"> {{- partial "header.html" . -}} - {{- partial "menu.html" . -}} <main id="content" {{if not .IsHome }} style="margin-top: 80px;" {{ end }}> {{- block "main" . }}{{- end }} </main> diff --git a/layouts/_default/list.html b/layouts/_default/list.html index d71d14e..bf96aa9 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -1,13 +1,13 @@ {{ define "main" }}
-<h1 style="margin: 0; text-decoration: underline;">
+<h1 style="margin: 0 0 0.5em 0;">
{{- .Title -}}
</h1>
{{ range (.Paginator .Site.Params.theme.paginateNum).Pages }}
<div
class="list-sections"
- style="border-bottom: dashed 1px; margin: 0; padding: 12px 0;"
+ style="border-top: dashed 1px; margin: 0; padding: 12px 0;"
>
<span style="font-size: 0.65em; font-style: italic;"
><time>{{- dateFormat .Site.Params.theme.dateFormat .Date }}</time> ·
diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 5bf7364..e61397a 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -1,8 +1,8 @@ {{ define "main" }}
<div
- style="display: flex; flex-direction: column; margin-bottom: 0.5em;"
+ style="display: flex; flex-direction: column;"
>
- <h1 style="margin: 0 0 0.25em 0; text-decoration: underline; font-size: 2em;">
+ <h1 style="margin: 0 0 0.25em 0; font-size: 2em;">
{{- .Title -}}
</h1>
<div class="sharing-icons">
diff --git a/layouts/partials/hamburgerCross.html b/layouts/partials/hamburgerCross.html index 62b62b5..e616687 100644 --- a/layouts/partials/hamburgerCross.html +++ b/layouts/partials/hamburgerCross.html @@ -1,8 +1,8 @@ <div
class="hamburger-cross"
style="
- position: fixed;
- top: 15px;
+ position: absolute;
+ top: 5px;
z-index: 50;
width: 50px;
height: 50px;
@@ -20,6 +20,7 @@ </div>
<script>
let currentX, currentY;
+ let initialHeaderShadow = document.querySelector("header").style.boxShadow;
const showMenu = (menu, hamBurger, cross, main, footer) => {
hamBurger.style.visibility = "hidden";
@@ -58,6 +59,14 @@ const footer = document.body.querySelector("footer");
menu.classList.contains("collapsed")
? showMenu(menu, hamBurger, cross, main, footer)
- : hideMenu(menu, hamBurger, cross, main, footer, currentX, currentY);
+ : hideMenu(
+ menu,
+ hamBurger,
+ cross,
+ main,
+ footer,
+ currentX,
+ currentY
+ );
};
</script>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html index a202352..3d9c89f 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -1,11 +1,31 @@ -{{ if not .IsHome}}
<header
- style="background-color: inherit; display: block; width: 100%; height: 70px; max-width: 960px; position: fixed; z-index: 20; margin: 0; top: 0;"
+ style="
+ background-color: {{ if not .IsHome}} var(--bgDarker) {{ else }} inherit {{ end }};
+ display: block;
+ width: 100%;
+ height: 50px;
+ padding-bottom: 10px;
+ margin-bottom: 10px;
+ max-width: 960px;
+ position: fixed;
+ margin: 0;
+ top: 0;
+ box-shadow: {{ if not .IsHome}} 0px 0px 2px 2px black {{ else }} none {{ end }};
+ "
>
+ {{ partial "hamburgerCross.html" . }}{{ if not .IsHome}}
<div
- style="display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-end; align-items: flex-end; padding: 0 1em 0 2em; height: 100%;"
+ style="
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ justify-content: flex-end;
+ align-items: flex-end;
+ padding: 0 1em 0 2em;
+ height: 100%;
+ "
>
{{ partial "breadcrumb.html" . }}
</div>
+ {{ end }} {{- partial "menu.html" . -}}
</header>
-{{ end }} {{ partial "hamburgerCross.html" . }}
diff --git a/layouts/partials/menu.html b/layouts/partials/menu.html index 09807cd..cad505a 100644 --- a/layouts/partials/menu.html +++ b/layouts/partials/menu.html @@ -1,4 +1,7 @@ -<div class="slide-menu collapsed" style="width: 0; overflow: hidden;">
+<div
+ class="slide-menu collapsed"
+ style="width: 0; overflow: hidden; 0px 0px 2px 2px black;"
+>
<h1>
<a href="/" style="white-space: nowrap;">Home</a>
</h1>
diff --git a/static/css/main.css b/static/css/main.css index c909a70..f23c550 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -45,16 +45,6 @@ footer { flex: none;
}
-header {
- padding-bottom: 15px;
-}
-
-header:after {
- content: "";
- display: block;
- border-bottom: 1px solid var(--textColor);
-}
-
main {
flex: 1 1 0%;
}
@@ -188,7 +178,6 @@ tbody { .slide-menu > h1 {
font-size: 1.5em;
}
-
ul.pagination {
display: flex;
flex-direction: row;
|