diff --git a/assets/css/baseof.css b/assets/css/baseof.css
index 1a142a1..4731d66 100644
--- a/assets/css/baseof.css
+++ b/assets/css/baseof.css
@@ -53,6 +53,21 @@ body {
isolation: isolate;
}
+#links .linkedin,
+#links .github,
+#links .cv-paper-flip,
+#links .mail,
+#nav-toggler svg path {
+ stroke: var(--text);
+}
+
+#links .twitter,
+#links .rss,
+#links .cv,
+#links .moon > path {
+ fill: var(--text);
+}
+
main {
width: 85%;
min-height: 70vh;
diff --git a/assets/css/partials/footer.css b/assets/css/partials/footer.css
index 8c909a4..d05c4d3 100644
--- a/assets/css/partials/footer.css
+++ b/assets/css/partials/footer.css
@@ -1,22 +1,34 @@
:root {
- --footer-light-background: #ECECEC;
- --footer-dark-background: #131212;
+ --footer-light-background: #ececec;
+ --footer-dark-background: #131212;
}
footer {
- width: 100%;
- min-height: 25rem;
- padding: 3rem 5rem;
- margin-top: 2.5rem;
+ width: 100%;
+ padding: 3rem 8rem;
+ margin-top: 2.5rem;
- display: flex;
- align-items: start;
- column-gap: 6rem;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ row-gap: 5rem;
- background-color: var(--footer-background);
- color: var(--text);
+ background-color: var(--footer-background);
+ color: var(--text);
}
-footer div {
- width: 20rem;
-}
\ No newline at end of file
+footer #footer-face {
+ display: flex;
+ align-items: center;
+ column-gap: 0.625rem;
+}
+
+footer #links {
+ display: flex;
+ align-items: center;
+ column-gap: 1.5rem;
+}
+
+footer #copyright {
+ font-size: 0.875rem;
+}
diff --git a/assets/css/partials/header.css b/assets/css/partials/header.css
index 8b2e02d..0b1a6d0 100644
--- a/assets/css/partials/header.css
+++ b/assets/css/partials/header.css
@@ -81,20 +81,6 @@ nav #links .theme-toggler {
margin-right: auto;
}
-#links .linkedin,
-#links .github,
-#links .cv-paper-flip,
-#nav-toggler svg path {
- stroke: var(--text);
-}
-
-#links .twitter,
-#links .rss,
-#links .cv,
-#links .moon > path {
- fill: var(--text);
-}
-
header #nav-toggler {
display: none;
}
diff --git a/assets/icons/mail.svg b/assets/icons/mail.svg
index 641501c..022b1a8 100644
--- a/assets/icons/mail.svg
+++ b/assets/icons/mail.svg
@@ -1,4 +1,4 @@
diff --git a/assets/images/header-face.png b/assets/images/small-face.png
similarity index 100%
rename from assets/images/header-face.png
rename to assets/images/small-face.png
diff --git a/assets/js/partials/header.js b/assets/js/partials/header.js
index 533e92f..7848225 100644
--- a/assets/js/partials/header.js
+++ b/assets/js/partials/header.js
@@ -1,10 +1,13 @@
function loadBurger() {
- navToggler.querySelector(
- burgerOpen ? '#burger' : '#close'
- ).style.display = 'none';
- navToggler.querySelector(
- burgerOpen ? '#close' : '#burger'
- ).style.display = 'block';
+ const headerInitialLeftPosition = header.getBoundingClientRect().x;
+
+ navToggler.querySelector(burgerOpen ? '#burger' : '#close').style.display =
+ 'none';
+ navToggler.querySelector(burgerOpen ? '#close' : '#burger').style.display =
+ 'block';
+ header.style.position = burgerOpen ? 'fixed' : 'initial';
+ header.style.top = burgerOpen ? '0px' : 'initial';
+ header.style.left = burgerOpen ? `${headerInitialLeftPosition}px` : 'initial';
mobileNavigation.style.display = burgerOpen ? 'flex' : 'none';
mobileNavigation.style.top = burgerOpen
? `calc(${header.getBoundingClientRect().y}px + ${
@@ -12,8 +15,11 @@ function loadBurger() {
}px + 0.625rem)`
: 'initial';
mobileNavigation.style.left = burgerOpen
- ? `${header.getBoundingClientRect().x}px`
+ ? `${headerInitialLeftPosition}px`
: 'initial';
+ document.querySelector('main').style.marginTop = burgerOpen
+ ? `calc(${header.getBoundingClientRect().height}px + 5rem)`
+ : '0px';
}
function updateBurger() {
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index ed28a0e..601a3f0 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,18 +1,39 @@
{{ $styles := resources.Get "css/partials/footer.css" | toCSS | minify }}
-
+
+
+{{ $faceImage := resources.Get "images/small-face.png" }}
+{{ $cv :=resources.Get "cv.pdf" }}
\ No newline at end of file
+
+
+
+
+
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 7777613..e16fecb 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -1,21 +1,15 @@
-{{ define "styles" }}
- {{ $styles := resources.Get "css/partials/header.css" | toCSS | minify }}
-
-
-{{ end }}
+{{ $styles := resources.Get "css/partials/header.css" | toCSS | minify }}
+{{ $scripts := resources.Get "js/partials/header.js" | js.Build | minify }}
-{{ define "scripts" }}
- {{ $scripts := resources.Get "js/partials/header.js" | js.Build | minify }}
+
+
-
-{{ end }}
-
-{{ $headerFaceImage := resources.Get "images/header-face.png" }}
+{{ $faceImage := resources.Get "images/small-face.png" }}
{{ $cv := resources.Get "cv.pdf" }}