From 3f68d449be17989de981f93d5920f0ac4a218866 Mon Sep 17 00:00:00 2001
From: DanielEmmanuel1 <oluwadamilare_daniel@outlook.com>
Date: Fri, 29 Aug 2025 20:10:35 +0100
Subject: [PATCH 1/2] refactor: remove unnecessary max-width from profile
 settings form

---
 components/settings/profile-settings-form.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/components/settings/profile-settings-form.tsx b/components/settings/profile-settings-form.tsx
index 0cc0594..af3db65 100644
--- a/components/settings/profile-settings-form.tsx
+++ b/components/settings/profile-settings-form.tsx
@@ -209,7 +209,7 @@ export function ProfileSettingsForm() {
   };
 
   return (
-    <div className="space-y-8 max-w-4xl mx-auto p-4">
+    <div className="space-y-8">
       {/* Cover Photo Section */}
       <Card className="bg-gray-900 border-gray-800 mb-20">
         <div className="relative">

From 8761a03b9f7f05183226f4a5aee0b4aac18b70f7 Mon Sep 17 00:00:00 2001
From: DanielEmmanuel1 <oluwadamilare_daniel@outlook.com>
Date: Fri, 29 Aug 2025 20:11:18 +0100
Subject: [PATCH 2/2] refactor: remove unnecessary max-width from various
 settings pages and improve layout consistency

---
 app/(main)/settings/developers/page.tsx   | 12 ++++++------
 app/(main)/settings/profile/page.tsx      |  2 +-
 app/(main)/settings/verification/page.tsx |  2 +-
 app/(main)/settings/wallet/page.tsx       |  6 +++---
 components/settings/settings-layout.tsx   |  6 +++---
 5 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/app/(main)/settings/developers/page.tsx b/app/(main)/settings/developers/page.tsx
index ffd5550..3a0c2af 100644
--- a/app/(main)/settings/developers/page.tsx
+++ b/app/(main)/settings/developers/page.tsx
@@ -20,10 +20,10 @@ export default function DevelopersPage() {
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault();
     setIsSubmitting(true);
-    
+
     // Simulate API call
     await new Promise(resolve => setTimeout(resolve, 2000));
-    
+
     setUserEmail(email);
     setVerificationStatus("pending");
     setIsSubmitting(false);
@@ -34,7 +34,7 @@ export default function DevelopersPage() {
     switch (status) {
       case "pending":
         return (
-          <Badge 
+          <Badge
             className={cn(
               "bg-yellow-500/20 text-yellow-400 border-yellow-500/30",
               "hover:bg-yellow-500/30"
@@ -46,7 +46,7 @@ export default function DevelopersPage() {
         );
       case "accepted":
         return (
-          <Badge 
+          <Badge
             className={cn(
               "bg-green-500/20 text-green-400 border-green-500/30",
               "hover:bg-green-500/30"
@@ -73,7 +73,7 @@ export default function DevelopersPage() {
   };
 
   return (
-    <div className="max-w-4xl mx-auto space-y-8">
+    <div className="space-y-8">
       {/* Header */}
       <div className="space-y-4">
         <h1 className="text-3xl font-bold text-white">Developers</h1>
@@ -113,7 +113,7 @@ export default function DevelopersPage() {
                     <span className="text-ash">{userEmail}</span>
                   </div>
                   <p className="text-sm text-ash mt-1">
-                    {verificationStatus === "pending" 
+                    {verificationStatus === "pending"
                       ? "We've sent a verification email. Please check your inbox and follow the instructions."
                       : "Your email has been verified and you have access to the developer API."
                     }
diff --git a/app/(main)/settings/profile/page.tsx b/app/(main)/settings/profile/page.tsx
index faa67aa..3e7b093 100644
--- a/app/(main)/settings/profile/page.tsx
+++ b/app/(main)/settings/profile/page.tsx
@@ -4,7 +4,7 @@ import { ProfileSettingsForm } from "@/components/settings/profile-settings-form
 
 export default function ProfileSettingsPage() {
   return (
-    <div className="max-w-4xl mx-auto space-y-8">
+    <div className="space-y-8">
       <div className="space-y-4">
         <h1 className="text-3xl font-bold text-white">Edit Profile</h1>
         <p className="text-ash text-lg">
diff --git a/app/(main)/settings/verification/page.tsx b/app/(main)/settings/verification/page.tsx
index 9bc1acf..59da98d 100644
--- a/app/(main)/settings/verification/page.tsx
+++ b/app/(main)/settings/verification/page.tsx
@@ -3,7 +3,7 @@ import { Shield } from "lucide-react";
 
 export default function VerificationPage() {
   return (
-    <div className="max-w-4xl mx-auto space-y-8">
+    <div className="space-y-8">
       <div className="space-y-4">
         <h1 className="text-3xl font-bold text-white">Verification</h1>
         <p className="text-ash text-lg">
diff --git a/app/(main)/settings/wallet/page.tsx b/app/(main)/settings/wallet/page.tsx
index d97b2f1..0321852 100644
--- a/app/(main)/settings/wallet/page.tsx
+++ b/app/(main)/settings/wallet/page.tsx
@@ -28,13 +28,13 @@ export default function WalletPage() {
   };
 
   return (
-    <div className="px-8 py-4">
+    <div>
       <div className="flex flex-col gap-[10px]">
         <div className="font-bold text-[20px] text-white font-sans">Wallet</div>
-        <div className="text-[14px] text-[#8E9BAE] font-sans">
+        <p className="text-[14px] text-[#8E9BAE] font-sans">
           Select and manage your notification preferences to control how and
           when you receive updates to your email and in-app.
-        </div>
+        </p>
       </div>
       <div className="flex flex-col gap-[30px] pt-[30px]">
         <div>
diff --git a/components/settings/settings-layout.tsx b/components/settings/settings-layout.tsx
index 5581309..eba5ec0 100644
--- a/components/settings/settings-layout.tsx
+++ b/components/settings/settings-layout.tsx
@@ -32,15 +32,15 @@ export function SettingsLayout({ children }: { children: React.ReactNode }) {
   }, [toggleSidebar]);
 
   return (
-    <div className="min-h-screen bg-true_black flex flex-col">
+    <div className="min-h-screen max-w-[1440px] mx-auto bg-true_black flex flex-col">
       <div className="flex flex-1">
         {/* Sidebar Component */}
         <SettingsSidebar isOpen={sidebarOpen} onClose={closeSidebar} />
 
         {/* Main Content */}
         <main className="flex-1 flex flex-col">
-          <div className="flex-1">
-            <div className="max-w-full mx-auto">{children}</div>
+          <div className="flex-1 py-4">
+            <div className="max-w-7xl mx-auto px-4 md:px-8">{children}</div>
           </div>
         </main>
       </div>