Added optimizations for mobile
This commit is contained in:
@@ -18,11 +18,11 @@ export default async function AdherentsPage() {
|
||||
|
||||
return (
|
||||
<DashboardLayout user={user}>
|
||||
<div className="p-6">
|
||||
<h1 className="text-3xl font-semibold text-cblack mb-1">
|
||||
<div className="p-4 md:p-6">
|
||||
<h1 className="text-2xl md:text-3xl font-semibold text-cblack mb-1">
|
||||
Adhérents
|
||||
</h1>
|
||||
<p className="text-sm text-cgray mb-6">
|
||||
<p className="text-xs md:text-sm text-cgray mb-4 md:mb-6">
|
||||
Base de données des adhérents
|
||||
</p>
|
||||
|
||||
|
||||
@@ -17,9 +17,9 @@ export default async function ArchivesPage() {
|
||||
|
||||
return (
|
||||
<DashboardLayout user={user}>
|
||||
<div className="p-8">
|
||||
<h1 className="text-3xl font-semibold text-cblack mb-2">Archives</h1>
|
||||
<p className="text-sm text-cgray mb-8">Trajets archivés</p>
|
||||
<div className="p-4 md:p-6 lg:p-8">
|
||||
<h1 className="text-2xl md:text-3xl font-semibold text-cblack mb-2">Archives</h1>
|
||||
<p className="text-xs md:text-sm text-cgray mb-6 md:mb-8">Trajets archivés</p>
|
||||
<ArchivesTrajets />
|
||||
</div>
|
||||
</DashboardLayout>
|
||||
|
||||
@@ -18,11 +18,11 @@ export default async function CalendrierPage() {
|
||||
|
||||
return (
|
||||
<DashboardLayout user={user}>
|
||||
<div className="p-8">
|
||||
<h1 className="text-3xl font-semibold text-cblack mb-2">
|
||||
<div className="p-4 sm:p-6 lg:p-8">
|
||||
<h1 className="text-2xl sm:text-3xl font-semibold text-cblack mb-2">
|
||||
Calendrier
|
||||
</h1>
|
||||
<p className="text-sm text-cgray mb-8">
|
||||
<p className="text-xs sm:text-sm text-cgray mb-6 sm:mb-8">
|
||||
Gestion des trajets et planning des chauffeurs
|
||||
</p>
|
||||
|
||||
|
||||
@@ -18,11 +18,11 @@ export default async function ChauffeursPage() {
|
||||
|
||||
return (
|
||||
<DashboardLayout user={user}>
|
||||
<div className="p-6">
|
||||
<h1 className="text-3xl font-semibold text-cblack mb-1">
|
||||
<div className="p-4 md:p-6">
|
||||
<h1 className="text-2xl md:text-3xl font-semibold text-cblack mb-1">
|
||||
Chauffeurs
|
||||
</h1>
|
||||
<p className="text-sm text-cgray mb-6">
|
||||
<p className="text-xs md:text-sm text-cgray mb-4 md:mb-6">
|
||||
Base de données des chauffeurs
|
||||
</p>
|
||||
|
||||
|
||||
@@ -18,11 +18,11 @@ export default async function UniversProPage() {
|
||||
|
||||
return (
|
||||
<DashboardLayout user={user}>
|
||||
<div className="p-6">
|
||||
<h1 className="text-3xl font-semibold text-cblack mb-1">
|
||||
<div className="p-4 md:p-6">
|
||||
<h1 className="text-2xl md:text-3xl font-semibold text-cblack mb-1">
|
||||
Univers Pro
|
||||
</h1>
|
||||
<p className="text-sm text-cgray mb-6">
|
||||
<p className="text-xs md:text-sm text-cgray mb-4 md:mb-6">
|
||||
Base de données des contacts professionnels
|
||||
</p>
|
||||
|
||||
|
||||
@@ -16,49 +16,50 @@ export default function Error({ error, reset }: ErrorProps) {
|
||||
}, [error]);
|
||||
|
||||
return (
|
||||
<div className="min-h-screen flex items-center justify-center bg-cwhite">
|
||||
<div className="text-center px-4">
|
||||
<div className="min-h-screen flex items-center justify-center bg-cwhite px-4 py-8">
|
||||
<div className="text-center w-full max-w-md mx-auto">
|
||||
{/* Logo */}
|
||||
<div className="flex justify-center mb-8">
|
||||
<div className="flex justify-center mb-6 md:mb-8">
|
||||
<Image
|
||||
src="/logo.svg"
|
||||
alt="MAD Logo"
|
||||
width={120}
|
||||
height={120}
|
||||
width={100}
|
||||
height={100}
|
||||
className="w-20 h-20 md:w-[120px] md:h-[120px]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 500 Content */}
|
||||
<div className="max-w-md mx-auto">
|
||||
<h1 className="text-9xl font-bold text-lorange mb-4">500</h1>
|
||||
<h2 className="text-3xl font-semibold text-gray-900 mb-4">
|
||||
<h1 className="text-7xl md:text-9xl font-bold text-lorange mb-3 md:mb-4">500</h1>
|
||||
<h2 className="text-2xl md:text-3xl font-semibold text-gray-900 mb-3 md:mb-4">
|
||||
Erreur serveur
|
||||
</h2>
|
||||
<p className="text-gray-600 mb-2">
|
||||
<p className="text-sm md:text-base text-gray-600 mb-2 px-2">
|
||||
Une erreur inattendue s'est produite sur le serveur.
|
||||
</p>
|
||||
{error.message && (
|
||||
<p className="text-sm text-gray-500 mb-8 font-mono bg-gray-100 p-3 rounded-lg">
|
||||
<p className="text-xs md:text-sm text-gray-500 mb-6 md:mb-8 font-mono bg-gray-100 p-2 md:p-3 rounded-lg break-all text-left mt-3">
|
||||
{error.message}
|
||||
</p>
|
||||
)}
|
||||
{!error.message && (
|
||||
<p className="text-gray-600 mb-8">
|
||||
<p className="text-sm md:text-base text-gray-600 mb-6 md:mb-8 px-2">
|
||||
Veuillez réessayer dans quelques instants.
|
||||
</p>
|
||||
)}
|
||||
|
||||
{/* Action Buttons */}
|
||||
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
||||
<div className="flex flex-col gap-3 md:gap-4 justify-center">
|
||||
<button
|
||||
onClick={reset}
|
||||
className="inline-flex items-center justify-center px-6 py-3 border border-transparent rounded-lg text-sm font-medium text-white bg-lorange hover:bg-dorange focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-lorange transition-colors"
|
||||
className="inline-flex items-center justify-center px-6 py-3 border border-transparent rounded-lg text-sm font-medium text-white bg-lorange hover:bg-dorange focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-lorange transition-colors w-full md:w-auto"
|
||||
>
|
||||
Réessayer
|
||||
</button>
|
||||
<Link
|
||||
href="/dashboard"
|
||||
className="inline-flex items-center justify-center px-6 py-3 border border-gray-300 rounded-lg text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-lorange transition-colors"
|
||||
className="inline-flex items-center justify-center px-6 py-3 border border-gray-300 rounded-lg text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-lorange transition-colors w-full md:w-auto"
|
||||
>
|
||||
Retour au tableau de bord
|
||||
</Link>
|
||||
@@ -66,8 +67,8 @@ export default function Error({ error, reset }: ErrorProps) {
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div className="mt-12 text-center text-xs text-gray-500">
|
||||
© {new Date().getFullYear()} MAD - <a href="https://legouix.dev" target="_blank" className="text-lblue hover:text-dblue">Propulsé par LGX</a>
|
||||
<div className="mt-8 md:mt-12 text-center text-xs text-gray-500 px-4">
|
||||
© {new Date().getFullYear()} MAD - <a href="https://legouix.dev" target="_blank" rel="noopener noreferrer" className="text-lblue hover:text-dblue">Propulsé par LGX</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -11,25 +11,26 @@ export default async function LoginPage() {
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-screen flex items-center justify-center bg-cwhite">
|
||||
<div className="w-full max-w-lg bg-white rounded-3xl shadow-lg py-8 px-12">
|
||||
<div className="min-h-screen flex items-center justify-center bg-cwhite px-4 sm:px-6 lg:px-8 py-8 sm:py-12">
|
||||
<div className="w-full max-w-lg bg-white rounded-2xl sm:rounded-3xl shadow-lg py-6 sm:py-8 px-6 sm:px-8 md:px-12">
|
||||
{/* Logo */}
|
||||
<div className="flex justify-center mb-6">
|
||||
<div className="flex justify-center mb-4 sm:mb-6">
|
||||
<Image
|
||||
src="/logo.svg"
|
||||
alt="MAD Logo"
|
||||
width={120}
|
||||
height={120}
|
||||
width={100}
|
||||
height={100}
|
||||
className="w-20 h-20 sm:w-24 sm:h-24 md:w-[120px] md:h-[120px]"
|
||||
priority
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Heading */}
|
||||
<div className="text-center mb-6">
|
||||
<h2 className="text-2xl font-bold text-gray-900 mb-2">
|
||||
<div className="text-center mb-5 sm:mb-6">
|
||||
<h2 className="text-xl sm:text-2xl font-bold text-gray-900 mb-2">
|
||||
Content de vous revoir
|
||||
</h2>
|
||||
<p className="text-sm text-gray-600">
|
||||
<p className="text-xs sm:text-sm text-gray-600 px-2">
|
||||
Connectez-vous pour accéder à la plateforme.
|
||||
</p>
|
||||
</div>
|
||||
@@ -38,7 +39,7 @@ export default async function LoginPage() {
|
||||
<LoginForm />
|
||||
|
||||
{/* Footer */}
|
||||
<div className="mt-8 text-center text-xs text-gray-500">
|
||||
<div className="mt-6 sm:mt-8 text-center text-[10px] sm:text-xs text-gray-500 px-2">
|
||||
© {new Date().getFullYear()} MAD - <a href="https://legouix.dev" target="_blank" className="text-lblue hover:text-dblue">Propulsé par LGX</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,39 +3,40 @@ import Image from 'next/image';
|
||||
|
||||
export default function NotFound() {
|
||||
return (
|
||||
<div className="min-h-screen flex items-center justify-center bg-cwhite">
|
||||
<div className="text-center px-4">
|
||||
<div className="min-h-screen flex items-center justify-center bg-cwhite px-4 py-8">
|
||||
<div className="text-center w-full max-w-md mx-auto">
|
||||
{/* Logo */}
|
||||
<div className="flex justify-center mb-8">
|
||||
<div className="flex justify-center mb-6 md:mb-8">
|
||||
<Image
|
||||
src="/logo.svg"
|
||||
alt="MAD Logo"
|
||||
width={120}
|
||||
height={120}
|
||||
width={100}
|
||||
height={100}
|
||||
className="w-20 h-20 md:w-[120px] md:h-[120px]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 404 Content */}
|
||||
<div className="max-w-md mx-auto">
|
||||
<h1 className="text-9xl font-bold text-lblue mb-4">404</h1>
|
||||
<h2 className="text-3xl font-semibold text-gray-900 mb-4">
|
||||
<h1 className="text-7xl md:text-9xl font-bold text-lblue mb-3 md:mb-4">404</h1>
|
||||
<h2 className="text-2xl md:text-3xl font-semibold text-gray-900 mb-3 md:mb-4">
|
||||
Page non trouvée
|
||||
</h2>
|
||||
<p className="text-gray-600 mb-8">
|
||||
<p className="text-sm md:text-base text-gray-600 mb-6 md:mb-8 px-2">
|
||||
Désolé, la page que vous recherchez n'existe pas ou a été déplacée.
|
||||
</p>
|
||||
|
||||
{/* Action Buttons */}
|
||||
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
||||
<div className="flex flex-col gap-3 md:gap-4 justify-center">
|
||||
<Link
|
||||
href="/dashboard"
|
||||
className="inline-flex items-center justify-center px-6 py-3 border border-transparent rounded-lg text-sm font-medium text-white bg-lblue hover:bg-dblue focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-lblue transition-colors"
|
||||
className="inline-flex items-center justify-center px-6 py-3 border border-transparent rounded-lg text-sm font-medium text-white bg-lblue hover:bg-dblue focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-lblue transition-colors w-full md:w-auto"
|
||||
>
|
||||
Retour au tableau de bord
|
||||
</Link>
|
||||
<Link
|
||||
href="/login"
|
||||
className="inline-flex items-center justify-center px-6 py-3 border border-gray-300 rounded-lg text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-lblue transition-colors"
|
||||
className="inline-flex items-center justify-center px-6 py-3 border border-gray-300 rounded-lg text-sm font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-lblue transition-colors w-full md:w-auto"
|
||||
>
|
||||
Page de connexion
|
||||
</Link>
|
||||
@@ -43,8 +44,8 @@ export default function NotFound() {
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div className="mt-12 text-center text-xs text-gray-500">
|
||||
© {new Date().getFullYear()} MAD - <a href="https://legouix.dev" target="_blank" className="text-lblue hover:text-dblue">Propulsé par LGX</a>
|
||||
<div className="mt-8 md:mt-12 text-center text-xs text-gray-500 px-4">
|
||||
© {new Date().getFullYear()} MAD - <a href="https://legouix.dev" target="_blank" rel="noopener noreferrer" className="text-lblue hover:text-dblue">Propulsé par LGX</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user