andil/THE-TIP-TOP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Responsive : toutes les pages et composants Header/Footer

Browse Source 
- Header : menu hamburger animé pour mobile, nav cachée sur petit écran
- Footer : grid 2 colonnes sur mobile, 4 colonnes sur desktop
- Accueil : titres et paddings adaptés mobile/tablette/desktop
- ReglesJeu : titres, cartes et CTA responsives
- MentionsLegales / Confidentialite : paddings et titres adaptés mobile
- Contact : padding et formulaire adaptés mobile
- Admin : tableau avec scroll horizontal sur mobile
- Employe : formulaire de recherche en colonne sur mobile
- Ajout composants Layout, Header, Footer et logo depuis branche Alexis

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Emma781227
2026-06-24 10:19:52 +02:00
parent 4727a3a268
commit 4ea733440f
9 changed files with 316 additions and 691 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/src/pages/Employe.jsx
View File

@@ -22,49 +22,47 @@ export default function Employe() {
}
return (
<div className="min-h-screen bg-gray-50 p-6">
<div className="min-h-screen bg-gray-50 p-4 sm:p-6">
<div className="max-w-lg mx-auto">
<h1 className="text-2xl font-bold text-gray-800 mb-1">Espace Employé</h1>
<p className="text-gray-500 mb-6">Vérifier et remettre un lot</p>
<h1 className="text-xl sm:text-2xl font-bold text-gray-800 mb-1">Espace Employé</h1>
<p className="text-gray-500 mb-5 sm:mb-6 text-sm sm:text-base">Vérifier et remettre un lot</p>
<form onSubmit={handleSearch} className="flex gap-2 mb-6">
<form onSubmit={handleSearch} className="flex flex-col sm:flex-row gap-2 mb-5 sm:mb-6">
<input
type="text"
value={code}
onChange={(e) => setCode(e.target.value)}
required
placeholder="Code ticket (TTT-XXXXX)"
className="flex-1 border border-gray-300 rounded-lg px-4 py-2.5 focus:outline-none focus:ring-2 focus:ring-green-500 font-mono"
className="flex-1 border border-gray-300 rounded-lg px-4 py-2.5 focus:outline-none focus:ring-2 focus:ring-green-500 font-mono text-sm"
/>
<button
type="submit"
className="bg-green-700 hover:bg-green-800 text-white font-semibold px-5 py-2.5 rounded-lg transition-colors"
className="bg-green-700 hover:bg-green-800 text-white font-semibold px-5 py-2.5 rounded-lg transition-colors text-sm sm:text-base whitespace-nowrap"
>
Rechercher
</button>
</form>
{gain && (
<div className="bg-white rounded-xl shadow p-6 space-y-3">
<div className="flex justify-between items-start">
<div className="bg-white rounded-xl shadow p-4 sm:p-6 space-y-3">
<div className="flex flex-col sm:flex-row sm:justify-between sm:items-start gap-2">
<div>
<p className="font-bold text-gray-800 text-lg">{gain.lot}</p>
<p className="text-sm text-gray-500 font-mono">{gain.code}</p>
<p className="font-bold text-gray-800 text-base sm:text-lg">{gain.lot}</p>
<p className="text-xs sm:text-sm text-gray-500 font-mono">{gain.code}</p>
</div>
<span className={`text-xs font-semibold px-3 py-1 rounded-full ${gain.status === 'DELIVERED' ? 'bg-green-100 text-green-800' : 'bg-yellow-100 text-yellow-800'}`}>
<span className={`self-start text-xs font-semibold px-3 py-1 rounded-full ${gain.status === 'DELIVERED' ? 'bg-green-100 text-green-800' : 'bg-yellow-100 text-yellow-800'}`}>
{gain.status === 'DELIVERED' ? 'Remis' : 'À remettre'}
</span>
</div>
<div className="border-t pt-3">
<div className="border-t pt-3 space-y-1">
<p className="text-sm text-gray-600"><span className="font-medium">Client :</span> {gain.client}</p>
<p className="text-sm text-gray-600"><span className="font-medium">Email :</span> {gain.email}</p>
</div>
{gain.status === 'PENDING' && (
<button
onClick={handleDeliver}
className="w-full bg-green-700 hover:bg-green-800 text-white font-semibold py-2.5 rounded-lg transition-colors mt-2"
className="w-full bg-green-700 hover:bg-green-800 text-white font-semibold py-2.5 rounded-lg transition-colors mt-2 text-sm sm:text-base"
>
Confirmer la remise du lot
</button>