From 4ea5ad411979886c32b89785092eefd8778f488f Mon Sep 17 00:00:00 2001
From: michaelschal <35957947-michaelschal@users.noreply.replit.com>
Date: Wed, 8 Oct 2025 17:28:53 +0000
Subject: [PATCH] Improve responsiveness and adjust button sizes for better
 mobile experience

Update padding and button sizes across various components to enhance mobile view and optimize user interaction.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: ae4037a0-2a6f-4530-9bac-79b543286bda
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/397bca8c-984f-43ff-841a-10897aeb8140/ae4037a0-2a6f-4530-9bac-79b543286bda/pCkJ6mk
---
 .replit                             | 4 ----
 client/src/components/ui/button.tsx | 8 ++++----
 client/src/pages/ai.tsx             | 2 +-
 client/src/pages/calendar.tsx       | 2 +-
 client/src/pages/dashboard.tsx      | 2 +-
 client/src/pages/history.tsx        | 2 +-
 client/src/pages/media.tsx          | 2 +-
 client/src/pages/new-post.tsx       | 4 ++--
 client/src/pages/pages.tsx          | 2 +-
 client/src/pages/settings.tsx       | 2 +-
 client/src/pages/sql.tsx            | 4 ++--
 client/src/pages/users-admin.tsx    | 4 ++--
 12 files changed, 17 insertions(+), 21 deletions(-)

diff --git a/.replit b/.replit
index 192bb32..b1b492e 100644
--- a/.replit
+++ b/.replit
@@ -30,10 +30,6 @@ externalPort = 4200
 localPort = 40537
 externalPort = 3000
 
-[[ports]]
-localPort = 42011
-externalPort = 5000
-
 [[ports]]
 localPort = 43245
 externalPort = 3001
diff --git a/client/src/components/ui/button.tsx b/client/src/components/ui/button.tsx
index 36496a2..c8cbf29 100644
--- a/client/src/components/ui/button.tsx
+++ b/client/src/components/ui/button.tsx
@@ -20,10 +20,10 @@ const buttonVariants = cva(
         link: "text-primary underline-offset-4 hover:underline",
       },
       size: {
-        default: "h-10 px-4 py-2",
-        sm: "h-9 rounded-md px-3",
-        lg: "h-11 rounded-md px-8",
-        icon: "h-10 w-10",
+        default: "h-11 px-4 py-2",
+        sm: "h-11 rounded-md px-3",
+        lg: "h-12 rounded-md px-8",
+        icon: "h-11 w-11",
       },
     },
     defaultVariants: {
diff --git a/client/src/pages/ai.tsx b/client/src/pages/ai.tsx
index 3f25ac1..a3860cb 100644
--- a/client/src/pages/ai.tsx
+++ b/client/src/pages/ai.tsx
@@ -25,7 +25,7 @@ export default function AI() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 max-w-5xl mx-auto">
+        <div className="p-4 sm:p-6 lg:p-8 max-w-5xl mx-auto">
           <div className="mb-8">
             <h1 className="text-3xl font-bold text-foreground">Assistant IA</h1>
             <p className="text-muted-foreground mt-2">
diff --git a/client/src/pages/calendar.tsx b/client/src/pages/calendar.tsx
index aa758db..b6cb235 100644
--- a/client/src/pages/calendar.tsx
+++ b/client/src/pages/calendar.tsx
@@ -25,7 +25,7 @@ export default function Calendar() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 max-w-[1600px] mx-auto">
+        <div className="p-4 sm:p-6 lg:p-8 max-w-[1600px] mx-auto">
           <div className="mb-8">
             <h1 className="text-3xl font-bold text-foreground">Calendrier</h1>
             <p className="text-muted-foreground mt-2">
diff --git a/client/src/pages/dashboard.tsx b/client/src/pages/dashboard.tsx
index c019d3e..d097e43 100644
--- a/client/src/pages/dashboard.tsx
+++ b/client/src/pages/dashboard.tsx
@@ -27,7 +27,7 @@ export default function Dashboard() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 space-y-8 max-w-[1600px] mx-auto">
+        <div className="p-4 sm:p-6 lg:p-8 space-y-6 sm:space-y-8 max-w-[1600px] mx-auto">
           <StatsCards />
           
           <RecentPublications />
diff --git a/client/src/pages/history.tsx b/client/src/pages/history.tsx
index f50fb36..37154a2 100644
--- a/client/src/pages/history.tsx
+++ b/client/src/pages/history.tsx
@@ -37,7 +37,7 @@ export default function History() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 max-w-5xl mx-auto">
+        <div className="p-4 sm:p-6 lg:p-8 max-w-5xl mx-auto">
           <div className="mb-8">
             <h1 className="text-3xl font-bold text-foreground">Historique</h1>
             <p className="text-muted-foreground mt-2">
diff --git a/client/src/pages/media.tsx b/client/src/pages/media.tsx
index 86b530e..67264a3 100644
--- a/client/src/pages/media.tsx
+++ b/client/src/pages/media.tsx
@@ -25,7 +25,7 @@ export default function Media() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 max-w-[1600px] mx-auto">
+        <div className="p-4 sm:p-6 lg:p-8 max-w-[1600px] mx-auto">
           <div className="mb-8">
             <h1 className="text-3xl font-bold text-foreground">Médiathèque</h1>
             <p className="text-muted-foreground mt-2">
diff --git a/client/src/pages/new-post.tsx b/client/src/pages/new-post.tsx
index 6b6b44f..c759abe 100644
--- a/client/src/pages/new-post.tsx
+++ b/client/src/pages/new-post.tsx
@@ -208,7 +208,7 @@ export default function NewPost() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 max-w-6xl mx-auto">
+        <div className="p-4 sm:p-6 lg:p-8 max-w-6xl mx-auto">
           <div className="mb-8">
             <h1 className="text-3xl font-bold text-foreground">Nouvelle publication</h1>
             <p className="text-muted-foreground mt-2">
@@ -216,7 +216,7 @@ export default function NewPost() {
             </p>
           </div>
 
-          <div className="grid grid-cols-1 lg:grid-cols-2 gap-8">
+          <div className="grid grid-cols-1 lg:grid-cols-2 gap-4 sm:gap-6 lg:gap-8">
             <div className="space-y-8">
               <Card className="rounded-2xl border-border/50 shadow-lg">
                 <CardHeader className="p-6">
diff --git a/client/src/pages/pages.tsx b/client/src/pages/pages.tsx
index bbda1e7..cb4ef7a 100644
--- a/client/src/pages/pages.tsx
+++ b/client/src/pages/pages.tsx
@@ -61,7 +61,7 @@ export default function PagesManagement() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 max-w-[1600px] mx-auto">
+        <div className="p-4 sm:p-6 lg:p-8 max-w-[1600px] mx-auto">
           <div className="flex justify-between items-center mb-8">
             <div>
               <h1 className="text-3xl font-bold text-foreground">Pages gérées</h1>
diff --git a/client/src/pages/settings.tsx b/client/src/pages/settings.tsx
index 9e7fd43..788aabb 100644
--- a/client/src/pages/settings.tsx
+++ b/client/src/pages/settings.tsx
@@ -138,7 +138,7 @@ export default function Settings() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 max-w-4xl mx-auto">
+        <div className="p-4 sm:p-6 lg:p-8 max-w-4xl mx-auto">
           <div className="mb-8">
             <h1 className="text-3xl font-bold text-foreground">Paramètres</h1>
             <p className="text-muted-foreground mt-2">
diff --git a/client/src/pages/sql.tsx b/client/src/pages/sql.tsx
index d7fd7e0..11037b2 100644
--- a/client/src/pages/sql.tsx
+++ b/client/src/pages/sql.tsx
@@ -93,7 +93,7 @@ export default function SqlAdmin() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 max-w-[1600px] mx-auto space-y-8">
+        <div className="p-4 sm:p-6 lg:p-8 max-w-[1600px] mx-auto space-y-6 sm:space-y-8">
           <div>
             <h1 className="text-3xl font-bold flex items-center gap-2">
               <Database className="w-8 h-8" />
@@ -104,7 +104,7 @@ export default function SqlAdmin() {
             </p>
           </div>
 
-          <div className="grid grid-cols-1 lg:grid-cols-4 gap-8">
+          <div className="grid grid-cols-1 lg:grid-cols-4 gap-4 sm:gap-6 lg:gap-8">
             {/* Liste des tables */}
             <Card className="rounded-2xl border-border/50 shadow-lg">
               <CardHeader className="p-6">
diff --git a/client/src/pages/users-admin.tsx b/client/src/pages/users-admin.tsx
index 3901a3f..a9ba7d4 100644
--- a/client/src/pages/users-admin.tsx
+++ b/client/src/pages/users-admin.tsx
@@ -296,7 +296,7 @@ export default function UsersAdmin() {
       <main className="flex-1 overflow-y-auto">
         <TopBar onMenuClick={() => setSidebarOpen(!sidebarOpen)} />
         
-        <div className="p-8 max-w-[1600px] mx-auto space-y-8">
+        <div className="p-4 sm:p-6 lg:p-8 max-w-[1600px] mx-auto space-y-6 sm:space-y-8">
           <div>
             <h1 className="text-3xl font-bold flex items-center gap-2">
               <Users className="w-8 h-8" />
@@ -307,7 +307,7 @@ export default function UsersAdmin() {
             </p>
           </div>
 
-          <div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
+          <div className="grid grid-cols-1 lg:grid-cols-3 gap-4 sm:gap-6 lg:gap-8">
             {/* Liste des utilisateurs */}
             <div className="lg:col-span-2">
               <Card className="rounded-2xl border-border/50 shadow-lg">