From a7655c457f3956923551420b6fc9e3fa5da73b56 Mon Sep 17 00:00:00 2001
From: Adam French <adam.a.french@outlook.com>
Date: Wed, 7 Jan 2026 13:08:54 +0000
Subject: [PATCH] Filler if no API response + look maxing

---
 nginx/vue/src/components/home/Feed.vue      | 29 +++++++++++++++++----
 nginx/vue/src/components/home/Listening.vue |  5 +++-
 2 files changed, 28 insertions(+), 6 deletions(-)

diff --git a/nginx/vue/src/components/home/Feed.vue b/nginx/vue/src/components/home/Feed.vue
index 6fed539..7b74b9f 100644
--- a/nginx/vue/src/components/home/Feed.vue
+++ b/nginx/vue/src/components/home/Feed.vue
@@ -66,19 +66,38 @@ onMounted(() => {
 </script>
 
 <template>
-    <div v-if="fetched" class="flex-col">
+    <div v-if="fetched" class="flex-col pad scroll-y left-content">
         <h2>{{ post.title }}</h2>
-        <div>{{ post.content }}</div>
+        <div class="fill wrap">{{ post.content }}</div>
         <p>by: {{ post.author.username }}</p>
         <small
             >Created at: {{ new Date(post.createdAt).toLocaleString() }}</small
         >
-        <button v-if="!leftCap" @click="prevPost">Prev</button>
-        <button v-if="!rightCap" @click="nextPost">Next</button>
+        <div class="flex-row fill-width">
+            <button class="fill" v-if="!leftCap" @click="prevPost">Prev</button>
+            <button class="fill" v-if="!rightCap" @click="nextPost">
+                Next
+            </button>
+        </div>
         <button v-if="userOwnsPost" @click="deletePost">Delete</button>
     </div>
-    <div class="flex-col pad" v-else>
+    <div class="flex-col pad scroll-y left-content" v-else>
         <h2>Can't fetch from the db yo</h2>
+        <div class="fill wrap">
+            This is meant to be pulling from a database, but for some reason
+            that isn't working and this is filler text that should hopefully
+            never see the light of day. If you are reading this, something has
+            gone horribly, horribly wrong. Please start crying and prepare for
+            the incoming wrath of hell. Furthermore, this is very, very long
+            because I am trying to test the scroll feature so thank you ^_^.
+        </div>
+        <p>by: stp</p>
+        <small>Created at: 0/0/0</small>
+        <div class="flex-row fill-width">
+            <button class="fill">Prev</button>
+            <button class="fill">Next</button>
+        </div>
+        <button>Delete</button>
     </div>
 </template>
 
diff --git a/nginx/vue/src/components/home/Listening.vue b/nginx/vue/src/components/home/Listening.vue
index a590b31..41ddc65 100644
--- a/nginx/vue/src/components/home/Listening.vue
+++ b/nginx/vue/src/components/home/Listening.vue
@@ -39,13 +39,16 @@ onMounted(() => {
             v-on:click="nextSong"
             class="flex-col center-content"
         >
+            <h2>Listening To</h2>
             <img :src="song.track.album.images[0].url" />
             <p><strong>Song:</strong> {{ song.track.name }}</p>
             <p><strong>Artist:</strong> {{ song.track.artists[0].name }}</p>
         </div>
         <div v-else class="flex-col center-content">
+            <h2>Listening To</h2>
             <img src="/img/Untitled.png" />
-            <p>I ain't listenin to nofin rn :/</p>
+            <p><strong>Song:</strong> >_<</p>
+            <p><strong>Artist:</strong> ^_^</p>
         </div>
     </Transition>
 </template>