From 6ebe2d59dc25cc0531c42d6856d78571256daa7d Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Mon, 26 May 2025 13:30:42 -0700
Subject: [PATCH] Adds footer

---
 src/lib/components/Footer.svelte | 74 ++++++++++++++++++++++++++++++++
 src/routes/+layout.svelte        |  3 ++
 src/routes/about/+page.svelte    | 10 -----
 3 files changed, 77 insertions(+), 10 deletions(-)
 create mode 100644 src/lib/components/Footer.svelte

diff --git a/src/lib/components/Footer.svelte b/src/lib/components/Footer.svelte
new file mode 100644
index 0000000..686b27b
--- /dev/null
+++ b/src/lib/components/Footer.svelte
@@ -0,0 +1,74 @@
+<script lang="ts">
+	const currentYear = new Date().getFullYear()
+	
+	const socialLinks = [
+		{ name: 'Bluesky', url: 'https://bsky.app/profile/jedmund.com' },
+		{ name: 'Mastodon', url: 'https://fireplace.cafe/@jedmund' },
+		{ name: 'Github', url: 'https://github.com/jedmund' },
+		{ name: 'Glass', url: 'https://glass.photo/jedmund' }
+	]
+</script>
+
+<footer class="site-footer">
+	<div class="footer-content">
+		<p class="copyright">&copy; {currentYear} Justin Edmund</p>
+		<nav class="social-links">
+			{#each socialLinks as link, index}
+				<a href={link.url} target="_blank" rel="noopener noreferrer">{link.name}</a>
+				{#if index < socialLinks.length - 1}
+					<span class="separator">/</span>
+				{/if}
+			{/each}
+		</nav>
+	</div>
+</footer>
+
+<style lang="scss">
+	.site-footer {
+		width: 100%;
+		padding: $unit-5x 0;
+		margin-top: $unit-6x;
+	}
+
+	.footer-content {
+		max-width: 700px;
+		margin: 0 auto;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 0 $unit-3x;
+
+		@include breakpoint('phone') {
+			flex-direction: column;
+			gap: $unit-2x;
+			text-align: center;
+		}
+	}
+
+	.copyright {
+		margin: 0;
+		font-size: 0.875rem; // 14px
+		color: $grey-40; // #999
+	}
+
+	.social-links {
+		display: flex;
+		align-items: center;
+		gap: $unit;
+		font-size: 0.875rem; // 14px
+
+		a {
+			color: $grey-40;
+			text-decoration: none;
+			transition: color 0.2s ease;
+
+			&:hover {
+				color: $red-60;
+			}
+		}
+
+		.separator {
+			color: $grey-40;
+		}
+	}
+</style>
\ No newline at end of file
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index c644b23..263789c 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -1,5 +1,6 @@
 <script lang="ts">
 	import Header from '$components/Header.svelte'
+	import Footer from '$components/Footer.svelte'
 </script>
 
 <svelte:head>
@@ -18,6 +19,8 @@ user-scalable=no"
 	<slot />
 </main>
 
+<Footer />
+
 <style lang="scss">
 	@import '../assets/styles/reset.css';
 	@import '../assets/styles/globals.scss';
diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte
index b5b1f5b..05da347 100644
--- a/src/routes/about/+page.svelte
+++ b/src/routes/about/+page.svelte
@@ -68,10 +68,6 @@
 	</section> -->
 </Page>
 
-<footer>
-	<p>&copy; 2024 Justin Edmund</p>
-</footer>
-
 <style lang="scss">
 	a,
 	em {
@@ -106,10 +102,4 @@
 			margin-bottom: 0;
 		}
 	}
-
-	footer {
-		font-size: 0.85rem;
-		color: $grey-40;
-		text-align: center;
-	}
 </style>
\ No newline at end of file