Refined Committee Portraits

- Changed the aspect ratio for the committee frame to be 1:1, it was weird and gave too many decimals before. Each frame's height and width is now 11.25rem
- Adjusted height and width of the committee profile pictures insides the frames, removing unnecessary left padding so the pictures appear to fit basically pixel-perfect

Author: Games4Doritos

client/src/pages/about.tsx

@@ -122,17 +122,17 @@ export default function AboutPage() {
                 key={`top-${idx}`}
                 className="flex flex-col items-start gap-0"
               >
-                <div className="relative flex h-[11.5625rem] w-[11.25rem] items-center justify-center bg-[url('/frame.svg')] bg-contain bg-center bg-no-repeat">
+                <div className="relative flex h-[11.25rem] w-[11.25rem] items-center justify-center bg-[url('/frame.svg')] bg-contain bg-center bg-no-repeat">
                   <Image
                     src={
                       member.profile_picture === null
                         ? "/landing_placeholder.png"
                         : member.profile_picture
                     }
                     alt="/landing_placeholder.png"
-                    width={106}
-                    height={106}
-                    className="mb-3 h-[6.625rem] w-[6.625rem]"
+                    width={108}
+                    height={108}
+                    className="mb-2 h-[6.75rem] w-[6.75rem]"
                   />
                 </div>
                 <div className="w-[11.25rem] pl-3 text-left font-firaCode text-[0.5rem] leading-tight">
@@ -154,17 +154,17 @@ export default function AboutPage() {
                 key={`bottom-${idx}`}
                 className="flex flex-col items-start gap-0"
               >
-                <div className="relative flex h-[11.5625rem] w-[11.25rem] items-center justify-center bg-[url('/frame.svg')] bg-contain bg-center bg-no-repeat">
+                <div className="relative flex h-[11.25rem] w-[11.25rem] items-center justify-center bg-[url('/frame.svg')] bg-contain bg-center bg-no-repeat">
                   <Image
                     src={
                       member.profile_picture === null
                         ? "/landing_placeholder.png"
                         : member.profile_picture
                     }
                     alt="/landing_placeholder.png"
-                    width={106}
-                    height={106}
-                    className="mb-3 h-[6.625rem] w-[6.625rem] pl-[0.03125rem]"
+                    width={108}
+                    height={108}
+                    className="mb-2 h-[6.75rem] w-[6.75rem]"
                   />
                 </div>
                 <div className="w-[11.25rem] pl-3 text-left font-firaCode text-[0.5rem] leading-tight">