Refactor Footer component and add Analytics and Footer components to BaseLayout

src/components/Footer.astro

@@ -0,0 +1,49 @@
+---
+import dayjs from "dayjs";
+---
+
+<style lang="scss">
+	@import "../scss/_variables.scss";
+
+	footer {
+		bottom: 0;
+		display: flex;
+		font-size: $fontSizeBase * 0.85;
+		height: 4em;
+		justify-content: space-between;
+		left: 0;
+		padding: 1em 4em;
+		position: absolute;
+		right: 0;
+	}
+
+	@media (width <=684px) {
+		footer {
+			padding: 4em 1em 2em;
+		}
+	}
+	ul {
+		display: flex;
+		justify-content: space-between;
+		list-style: none;
+	}
+
+	li {
+		margin-left: 2em;
+	}
+
+	a {
+		color: $colorText;
+		&:visited {
+			color: $colorText;
+		}
+	}
+</style>
+
+<footer>
+	<div>&copy; {dayjs().year()} <a href="mailto:valentin@popov.link">Valentin Popov</a></div>
+	<ul>
+		<li><a href="https://analytics.popov.link" target="_blank">Analytics</a></li>
+		<li><a href="https://code.popov.link/valentineus/valentineus.github.io" target="_blank">Source Code</a></li>
+	</ul>
+</footer>

src/layouts/BaseLayout.astro

@@ -1,5 +1,6 @@
 ---
 import Analytics from "../components/Analytics.astro";
+import Footer from "../components/Footer.astro";
 import Head from "../components/Head.astro";
 import Header from "../components/Header.astro";
 import "../scss/global.scss";
@@ -23,6 +24,7 @@ const { description, title } = Astro.props;
 		<main>
 			<slot />
 		</main>
+		<Footer />
 		<Analytics title={title ?? import.meta.env.DEFAULT_TITLE} />
 	</body>
 </html>

src/scss/_framework.scss

@@ -36,6 +36,7 @@ body {
 	max-width: 52em;
 	min-height: 100vh;
 	padding: 4em;
+	position: relative;
 	text-rendering: optimizelegibility;
 }