From 30b08102b2fd097c1eb6117611ef881ed4345627 Mon Sep 17 00:00:00 2001
From: laraproto <laraproto@proton.me>
Date: Sat, 25 Jan 2025 18:17:27 +0200
Subject: [PATCH] improve styling

---
 src/lib/components/Footer.svelte |  2 +-
 src/routes/+error.svelte         |  4 ++--
 src/routes/+layout.svelte        |  2 +-
 src/routes/+page.svelte          | 27 +++++++++++++++++++++------
 4 files changed, 25 insertions(+), 10 deletions(-)
diff --git a/src/lib/components/Footer.svelte b/src/lib/components/Footer.svelte
index a41c6cc..69865d3 100644
--- a/src/lib/components/Footer.svelte
+++ b/src/lib/components/Footer.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 </script>
 
-<footer class="footer">
+<footer class="footer text-center">
 	<p>Logo art by <a href="https://bsky.app/profile/did:plc:sqwkomf6gkzbhnctiqexepzx">Aegiscarr</a></p>
 	<p>&copy; {new Date().getFullYear()} <a href="https://laratheprotogen.dev">Lara The Protogen</a>. All rights reserved.</p>
 </footer>
diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index 7aded0d..9654d6c 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -5,8 +5,8 @@
 
 <Head title="Error {page.status} | protogen.social"/>
 
-<h1 class="text-4xl font-bold">No secrets here</h1>
-<p>{page.status} {page.error?.message}</p>
+<h1 class="text-4xl font-bold text-center">No secrets here</h1>
+<p class="text-center">{page.status} {page.error?.message}</p>
 
 <style lang="scss">
 
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index d141749..ba34e4b 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -33,6 +33,6 @@
   }
 
   .content {
-    @apply absolute inset-0 flex flex-col justify-center p-72 items-center backdrop-blur-lg text-center;
+    @apply absolute inset-0 flex flex-col justify-center items-center backdrop-blur-lg text-center;
   }
 </style>
\ No newline at end of file
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index b373028..24f3f4d 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -3,17 +3,32 @@
 	import Head from '$lib/components/Head.svelte';
 
 	const prevDate = new Date(2023, 7, 5)
-
 </script>
 
 <Head title="protogen.social" />
 
-<h1 class="text-4xl font-bold">protogen.social</h1>
-<p>I intend to make protogen.social return sometime in the future, if i'm ever able to recover it's data</p>
-<p>The server used to host it is currently down and frankly, I don't know when it might be coming back, I do hope it will tho as i've been damn proud of the mastodon instance i've been running for <span class="font-bold">{formatDistanceToNow(prevDate)}</span> now</p>
-<p>I did have a local backup of it that was a few months old at the time of writing this (that being 1/25/2025 @ 17:34) but my linux ssd died, but hey, at least it got a replacement approved, but i'm never getting that data on it back</p>
-<p>That's all I like really had to say</p>
+<h1 class="text-4xl font-bold text-center">protogen.social</h1>
+<div class="text-container">
+	<p class="text-center">I intend to make protogen.social return sometime in the future, if I'm ever able to recover its data.</p>
+	<p class="text-center">The server used to host it is currently down and frankly, I don't know when it might be coming back. I do hope it will, though, as I've been damn proud of the Mastodon instance I've been running for <span class="font-bold">{formatDistanceToNow(prevDate)}</span> now.</p>
+	<p class="text-center">I did have a local backup of it that was a few months old at the time of writing this (that being 1/25/2025 @ 17:34), but my Linux SSD died. But hey, at least it got a replacement approved, but I'm never getting that data on it back.</p>
+	<p class="text-center">That's all I really had to say.</p>
+</div>
 
 <style lang="scss">
+  .text-container {
+    padding: 1rem;
+    max-width: 100%;
+    margin: 0 auto;
 
+    @media (min-width: 768px) {
+      padding: 2rem;
+      max-width: 80%;
+    }
+
+    @media (min-width: 1024px) {
+      padding: 3rem;
+      max-width: 60%;
+    }
+  }
 </style>
\ No newline at end of file
