Mission Refactor Big

This commit is contained in:
alma 2026-01-09 15:44:40 +01:00
parent 0cf5035a3e
commit 42e710dcfa

View File

@ -197,14 +197,7 @@ export default function MissionsPage() {
const niveauColor = getNiveauBadgeColor(mission.niveau); const niveauColor = getNiveauBadgeColor(mission.niveau);
return ( return (
<div key={mission.id} className={`bg-white shadow-sm hover:shadow-md transition-shadow duration-200 border overflow-hidden h-full rounded-lg flex flex-col relative ${mission.isClosed ? 'border-amber-300' : 'border-gray-200'}`}> <div key={mission.id} className={`bg-white shadow-sm hover:shadow-md transition-shadow duration-200 border overflow-hidden h-full rounded-lg flex flex-col ${mission.isClosed ? 'border-amber-300' : 'border-gray-200'}`}>
{/* Closed Badge */}
{mission.isClosed && (
<div className="absolute top-0 right-0 bg-amber-500 text-white text-xs font-medium px-3 py-1 rounded-bl-lg flex items-center gap-1 z-10">
<Lock className="h-3 w-3" />
Clôturée
</div>
)}
{/* Card Header with Name and Level */} {/* Card Header with Name and Level */}
<div className="px-5 pt-4 pb-3 flex justify-between items-center border-b border-gray-100"> <div className="px-5 pt-4 pb-3 flex justify-between items-center border-b border-gray-100">
<h2 className="text-base font-medium text-gray-900 line-clamp-2 flex-1">{mission.name}</h2> <h2 className="text-base font-medium text-gray-900 line-clamp-2 flex-1">{mission.name}</h2>
@ -287,10 +280,18 @@ export default function MissionsPage() {
</div> </div>
{/* Card Footer */} {/* Card Footer */}
<div className="mt-auto px-5 py-3 border-t border-gray-100 bg-gray-50 flex justify-between items-center"> <div className={`mt-auto px-5 py-3 border-t flex justify-between items-center ${mission.isClosed ? 'bg-amber-50 border-amber-200' : 'bg-gray-50 border-gray-100'}`}>
<span className="text-xs text-gray-500"> <div className="flex flex-col gap-1">
Créée le {formatDate(mission.createdAt)} <span className="text-xs text-gray-500">
</span> Créée le {formatDate(mission.createdAt)}
</span>
{mission.isClosed && (
<span className="flex items-center gap-1 text-xs font-medium text-amber-700">
<Lock className="h-3 w-3" />
Clôturée
</span>
)}
</div>
<Link href={`/missions/${mission.id}`}> <Link href={`/missions/${mission.id}`}>
<Button className="bg-blue-600 hover:bg-blue-700 text-white text-xs px-3 py-1 h-7 rounded-md"> <Button className="bg-blue-600 hover:bg-blue-700 text-white text-xs px-3 py-1 h-7 rounded-md">