Pierre/MAD-Platform
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added optimizations for mobile

Browse Source
This commit is contained in:
Pierre
2026-02-08 15:27:44 +01:00
parent f1e9e3f8d4
commit da2e32d004
28 changed files with 1667 additions and 1075 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
components/ParametresContent.tsx
View File

@@ -316,45 +316,45 @@ export default function ParametresContent() {
const router = useRouter();
return (
<div className="p-6">
<div className="mb-8">
<h1 className="text-3xl font-bold text-gray-900 mb-2">Paramètres</h1>
<p className="text-sm text-gray-600">
<div className="p-4 md:p-6">
<div className="mb-6 md:mb-8">
<h1 className="text-2xl md:text-3xl font-bold text-gray-900 mb-2">Paramètres</h1>
<p className="text-xs md:text-sm text-gray-600">
Gérez votre profil et configurez la plateforme
</p>
</div>
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div className="grid grid-cols-1 lg:grid-cols-2 gap-4 md:gap-6">
{/* Colonne de gauche - Profil/Compte */}
<div>
<div className="bg-white rounded-xl shadow-sm border border-gray-100 p-6">
<div className="text-center mb-6">
<div className="bg-white rounded-xl shadow-sm border border-gray-100 p-4 md:p-6">
<div className="text-center mb-4 md:mb-6">
{user?.photoUrl ? (
<img
src={user.photoUrl}
alt={user.name || 'Utilisateur'}
className="w-20 h-20 rounded-full object-cover mx-auto mb-4 shadow-lg border-4 border-white"
className="w-16 h-16 md:w-20 md:h-20 rounded-full object-cover mx-auto mb-3 md:mb-4 shadow-lg border-2 md:border-4 border-white"
/>
) : (
<div className="w-20 h-20 rounded-full bg-gradient-to-br from-lblue to-dblue flex items-center justify-center mx-auto mb-4 shadow-lg">
<span className="text-white text-2xl font-bold">{getUserInitials()}</span>
<div className="w-16 h-16 md:w-20 md:h-20 rounded-full bg-gradient-to-br from-lblue to-dblue flex items-center justify-center mx-auto mb-3 md:mb-4 shadow-lg">
<span className="text-white text-xl md:text-2xl font-bold">{getUserInitials()}</span>
</div>
)}
<h2 className="text-xl font-bold text-gray-900 mb-1">
<h2 className="text-lg md:text-xl font-bold text-gray-900 mb-1">
{user?.name || 'Utilisateur'}
</h2>
<p className="text-sm text-gray-500">{user?.email}</p>
<p className="text-xs md:text-sm text-gray-500 break-words">{user?.email}</p>
</div>
<button
onClick={() => router.push('/dashboard/parametres/compte')}
className="w-full px-4 py-3 bg-gray-50 hover:bg-gray-100 rounded-lg text-left transition-colors border border-gray-200"
className="w-full px-3 md:px-4 py-2.5 md:py-3 bg-gray-50 hover:bg-gray-100 rounded-lg text-left transition-colors border border-gray-200"
>
<div className="flex items-center gap-3">
<svg className="w-5 h-5 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div className="flex items-center gap-2 md:gap-3">
<svg className="w-4 h-4 md:w-5 md:h-5 text-gray-600 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
</svg>
<span className="font-medium text-gray-900">Modifier le compte</span>
<span className="font-medium text-sm md:text-base text-gray-900">Modifier le compte</span>
</div>
</button>
</div>
@@ -365,24 +365,24 @@ export default function ParametresContent() {
<div>
<button
onClick={() => router.push('/dashboard/parametres/configuration')}
className="w-full bg-white rounded-xl shadow-sm border border-gray-100 p-6 hover:shadow-md hover:border-lblue transition-all text-left group"
className="w-full bg-white rounded-xl shadow-sm border border-gray-100 p-4 md:p-6 hover:shadow-md hover:border-lblue transition-all text-left group"
>
<div className="flex items-center gap-4">
<div className="w-16 h-16 rounded-xl bg-lblue/10 flex items-center justify-center group-hover:bg-lblue/20 transition-colors">
<svg className="w-8 h-8 text-lblue" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div className="flex items-center gap-3 md:gap-4">
<div className="w-12 h-12 md:w-16 md:h-16 rounded-xl bg-lblue/10 flex items-center justify-center group-hover:bg-lblue/20 transition-colors flex-shrink-0">
<svg className="w-6 h-6 md:w-8 md:h-8 text-lblue" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" />
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
</svg>
</div>
<div className="flex-1">
<h3 className="text-xl font-bold text-gray-900 mb-1 group-hover:text-lblue transition-colors">
<div className="flex-1 min-w-0">
<h3 className="text-lg md:text-xl font-bold text-gray-900 mb-1 group-hover:text-lblue transition-colors">
Configuration
</h3>
<p className="text-sm text-gray-600">
<p className="text-xs md:text-sm text-gray-600">
Configurez les paramètres de la plateforme
</p>
</div>
<svg className="w-5 h-5 text-gray-400 group-hover:text-lblue transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<svg className="w-4 h-4 md:w-5 md:h-5 text-gray-400 group-hover:text-lblue transition-colors flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>
</div>