From 2fd78acccdbf924b5d6e2f261232b7873d456a7b Mon Sep 17 00:00:00 2001
From: Rainnny7 <braydonrainnny@gmail.com>
Date: Wed, 4 Sep 2024 15:23:49 -0400
Subject: [PATCH] Make the navigation content height static

---
 src/components/landing/discord-status.tsx | 4 ++--
 src/components/landing/navigation.tsx     | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/landing/discord-status.tsx b/src/components/landing/discord-status.tsx
index 4c284b1..6d2d916 100644
--- a/src/components/landing/discord-status.tsx
+++ b/src/components/landing/discord-status.tsx
@@ -86,7 +86,7 @@ const DiscordStatus = (): ReactElement | undefined => {
                     dcdnUser={dcdnUser}
                 />
 
-                <div className="px-3.5 pt-1.5 py-2.5 flex flex-col">
+                <div className="px-3 pt-1.5 py-2.5 flex flex-col">
                     <div className="ml-[5.65rem] flex items-start">
                         {dcdnUser.bio && <Bio dcdnUser={dcdnUser} />}
                         <Badges dcdnUser={dcdnUser} />
@@ -226,7 +226,7 @@ const SpotifyActivity = ({ spotify }: { spotify: Spotify }): ReactElement => {
                 <div className="flex flex-col text-sm">
                     <Link href={trackUrl} target="_blank">
                         <h1 className="font-bold leading-none">
-                            {truncateText(spotify.song, 24)}
+                            {truncateText(spotify.song, 22)}
                         </h1>
                         <h2 className="font-light opacity-70">
                             {truncateText(spotify.artist.replace(";", ","), 26)}
diff --git a/src/components/landing/navigation.tsx b/src/components/landing/navigation.tsx
index bc9c791..3110866 100644
--- a/src/components/landing/navigation.tsx
+++ b/src/components/landing/navigation.tsx
@@ -38,7 +38,7 @@ const Navigation = (): ReactElement => {
         undefined
     );
     return (
-        <div className="flex flex-col">
+        <div className="h-[20rem] flex flex-col">
             {/* Selection Buttons */}
             <div className="flex gap-3 sm:gap-6 justify-center transition-all transform-gpu">
                 {items.map((item, index) => {
@@ -64,7 +64,7 @@ const Navigation = (): ReactElement => {
             </div>
 
             {/* Selected Content */}
-            <BlurFade className="mt-5" delay={1.85} inView>
+            <BlurFade className="mt-6" delay={1.95} inView>
                 {selected ? (
                     <BlurFade
                         key={selected.name}