fix: ensure footer width conforms to design

Author: timothyylim

apps/comps/components/footer-section/index.tsx

@@ -45,41 +45,45 @@ export const FooterSection: React.FC<FooterSectionProps> = ({ className }) => {
 
   return (
     <footer className={cn("mt-10", className)}>
-      <div className="xs:grid-cols-5 grid grid-cols-3 content-center gap-8 border-y py-10 font-normal">
-        <Image
-          src="/logo_white.svg"
-          alt="recallnet"
-          height={72}
-          width={63}
-          className="h-[72px] w-[63px]"
-        />
-        <div className="flex flex-col">
-          {linkBlock1.map(({ text, link }, i) => (
-            <a
-              key={i}
-              href={link}
-              target="_blank"
-              rel="noopener noreferrer"
-              className="text-secondary-foreground mb-0 flex items-center gap-2 font-mono text-xs hover:text-white"
-            >
-              <span className="text-md">¬</span>
-              <span>{text}</span>
-            </a>
-          ))}
-        </div>
-        <div className="flex flex-col">
-          {linkBlock2.map(({ text, link }, i) => (
-            <a
-              key={i}
-              href={link}
-              target="_blank"
-              rel="noopener noreferrer"
-              className="text-secondary-foreground mb-0 flex items-center gap-2 font-mono text-xs hover:text-white"
-            >
-              <span className="text-md">¬</span>
-              <span>{text}</span>
-            </a>
-          ))}
+      <div className="border-y py-10">
+        <div className="max-w-5xl">
+          <div className="xs:grid-cols-5 grid grid-cols-3 content-center gap-8 font-normal">
+            <Image
+              src="/logo_white.svg"
+              alt="recallnet"
+              height={72}
+              width={63}
+              className="h-[72px] w-[63px]"
+            />
+            <div className="flex flex-col">
+              {linkBlock1.map(({ text, link }, i) => (
+                <a
+                  key={i}
+                  href={link}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-secondary-foreground mb-0 flex items-center gap-2 font-mono text-xs hover:text-white"
+                >
+                  <span className="text-md">¬</span>
+                  <span>{text}</span>
+                </a>
+              ))}
+            </div>
+            <div className="flex flex-col">
+              {linkBlock2.map(({ text, link }, i) => (
+                <a
+                  key={i}
+                  href={link}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="text-secondary-foreground mb-0 flex items-center gap-2 font-mono text-xs hover:text-white"
+                >
+                  <span className="text-md">¬</span>
+                  <span>{text}</span>
+                </a>
+              ))}
+            </div>
+          </div>
         </div>
       </div>
       <span className="text-secondary-foreground block py-4 text-center text-xs">