From 9ff6f2cd0eb93f294e0a03226daaf5000f1b5f44 Mon Sep 17 00:00:00 2001
From: Valentin Popov <valentin@popov.link>
Date: Tue, 17 Sep 2024 23:24:24 +0000
Subject: Added footer component

---
 src/components/Footer.astro | 61 +++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 61 insertions(+)
 create mode 100644 src/components/Footer.astro

(limited to 'src/components/Footer.astro')

diff --git a/src/components/Footer.astro b/src/components/Footer.astro
new file mode 100644
index 0000000..ea53b25
--- /dev/null
+++ b/src/components/Footer.astro
@@ -0,0 +1,61 @@
+---
+import { Icon } from "astro-icon/components";
+import dayjs from "dayjs";
+---
+
+<style lang="scss">
+	@import "../scss/_variables.scss";
+
+	footer {
+		bottom: 0;
+		height: 4em;
+		left: 0;
+		padding: 1em 4em;
+		position: absolute;
+		right: 0;
+	}
+
+	.left-nav,
+	.right-nav {
+		display: inline-block;
+		vertical-align: top;
+		width: 49%;
+	}
+
+	.left-nav {
+		float: left;
+		font-size: $fontSizeBase * 0.75;
+		text-align: left;
+	}
+
+	.right-nav {
+		float: right;
+		text-align: right;
+	}
+
+	@media (width <=684px) {
+		footer {
+			padding: 4em 1em 2em;
+		}
+	}
+
+	a {
+		color: $colorText;
+
+		&:visited {
+			color: $colorText;
+		}
+	}
+</style>
+
+<footer>
+	<div class="left-nav">
+		<span>&copy; {dayjs().year()} <a href="mailto:valentin@popov.link">Valentin Popov</a></span>
+	</div>
+	<div class="right-nav">
+		<a href="https://github.com/valentineus" target="_blank"><Icon name="hugeicons:github-01" /></a>
+		<a href="https://www.linkedin.com/in/valentineus/" target="_blank"><Icon name="hugeicons:linkedin-01" /></a>
+		<a href="https://analytics.popov.link" target="_blank"><Icon name="hugeicons:analytics-up" /></a>
+		<a href="/feed.xml" target="_blank"><Icon name="hugeicons:rss" /></a>
+	</div>
+</footer>
-- 
cgit v1.2.3