From 9ee81aa487bf6f54c67af6c6fa4f2577b07d8b95 Mon Sep 17 00:00:00 2001
From: Nicholas Pease <me@nicholaspease.com>
Date: Thu, 18 Apr 2024 12:59:12 -0400
Subject: [PATCH 1/2] Profile Picture Sizing Corrected on Sidebar

---
 frontend-next/src/components/app/friends/dm.js      | 10 ++++++----
 frontend-next/src/components/app/friends/friends.js | 10 ++++++----
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/frontend-next/src/components/app/friends/dm.js b/frontend-next/src/components/app/friends/dm.js
index 6e2e92d..44071c1 100644
--- a/frontend-next/src/components/app/friends/dm.js
+++ b/frontend-next/src/components/app/friends/dm.js
@@ -44,10 +44,12 @@ export function DM({user,friendObj}) {
                     </div>
                     <div className='col-span-3 cursor-pointer'>
                         <div onClick={() => {openDM(user,friendObj.uid)}}>
-                            <div className='inline-block mr-8'><img src={friendObj.pfp} className='w-[38px] h-[50px]'/></div>
-                            <div className='inline-block relative top-[-6px]'>
-                                <div className="font-bold">{friendObj.firstName} {friendObj.lastName}</div>
-                                <div className="">@{friendObj.username}</div>
+                            <div className='grid grid-cols-2 justify-items-center'>
+                                <div className='mr-8'><img src={friendObj.pfp} className= 'w-[50px] h-[50px]'/></div>
+                                <div className=''>
+                                    <div className="font-bold">{friendObj.lastOnline == true && <CircleIcon className="text-lime-600 mr-1 relative top-[-2px]" fontSize="20px"/>}{friendObj.firstName} {friendObj.lastName}</div>
+                                    <div className="">@{friendObj.username}</div>
+                                </div>
                             </div>
                         </div>
                     </div>
diff --git a/frontend-next/src/components/app/friends/friends.js b/frontend-next/src/components/app/friends/friends.js
index 30493b9..1d1f774 100644
--- a/frontend-next/src/components/app/friends/friends.js
+++ b/frontend-next/src/components/app/friends/friends.js
@@ -40,10 +40,12 @@ export function Friend({user,friendObj}) {
                     </div>
                     <div className='col-span-3 cursor-pointer'>
                         <Link href={`/user?uid=${friendObj.uid}`}>
-                            <div className='inline-block mr-8'><img src={friendObj.pfp} className= 'w-[38px] h-[50px]'/></div>
-                            <div className='inline-block relative top-[-6px]'>
-                                <div className="font-bold">{friendObj.lastOnline == true && <CircleIcon className="text-lime-600 mr-1 relative top-[-2px]" fontSize="20px"/>}{friendObj.firstName} {friendObj.lastName}</div>
-                                <div className="">@{friendObj.username}</div>
+                            <div className='grid grid-cols-2 justify-items-center'>
+                                <div className='mr-8'><img src={friendObj.pfp} className= 'w-[50px] h-[50px]'/></div>
+                                <div className=''>
+                                    <div className="font-bold">{friendObj.lastOnline == true && <CircleIcon className="text-lime-600 mr-1 relative top-[-2px]" fontSize="20px"/>}{friendObj.firstName} {friendObj.lastName}</div>
+                                    <div className="">@{friendObj.username}</div>
+                                </div>
                             </div>
                         </Link>
                     </div>
-- 
2.52.0


From d1a9116b34e9c2d5cfa77913b78b70d20329cb87 Mon Sep 17 00:00:00 2001
From: Nicholas Pease <me@nicholaspease.com>
Date: Thu, 18 Apr 2024 13:01:41 -0400
Subject: [PATCH 2/2] Fix Profile Picture Scaling on Different Screen Sizes

---
 frontend-next/src/app/user/page.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/frontend-next/src/app/user/page.js b/frontend-next/src/app/user/page.js
index 3f724f8..eb84533 100644
--- a/frontend-next/src/app/user/page.js
+++ b/frontend-next/src/app/user/page.js
@@ -127,8 +127,7 @@ function UserProfile() {
                   <div>
                     <img
                       src={profileData.pfp}
-                      style={{maxWidth: "350px", maxHeight: "450px"}} 
-                      className="relative mx-auto rounded-2xl overflow-hidden"
+                      className="relative mx-auto rounded-2xl overflow-hidden w-[90%]"
                     />
                     <div className="font-bold text-[30px] flex justify-center items-center">
                       {profileData.lastOnline == true && <CircleIcon className="text-lime-600 mr-3"/>}{profileData.firstName} {profileData.lastName}
-- 
2.52.0