Checkpoint: Vignettes Veille : Niveau en violet, Territoire en teal, Date en orange. Vignettes AAP : Région en violet, Département en teal, Date de publication en orange. Cohérence visuelle avec la palette de la boîte de dialogue.
This commit is contained in:
@@ -283,21 +283,21 @@ function AAPGridView({ items }: { items: AAPItem[] }) {
|
||||
<h3 className="font-semibold text-sm text-foreground leading-snug line-clamp-3 mt-2">{item.titre}</h3>
|
||||
</CardHeader>
|
||||
<CardContent className="px-4 pb-4 space-y-2">
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<div className="flex flex-wrap gap-1.5">
|
||||
{item.region && (
|
||||
<span className="inline-flex items-center gap-1 text-xs text-muted-foreground">
|
||||
<span className="inline-flex items-center gap-1 text-xs px-1.5 py-0.5 rounded bg-violet-50 text-violet-700 border border-violet-200">
|
||||
<MapPin size={10} />{item.region}
|
||||
</span>
|
||||
)}
|
||||
{item.departement && (
|
||||
<span className="inline-flex items-center gap-1 text-xs text-muted-foreground">
|
||||
<span className="inline-flex items-center gap-1 text-xs px-1.5 py-0.5 rounded bg-teal-50 text-teal-700 border border-teal-200">
|
||||
<MapPin size={10} />{item.departement}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center justify-between pt-1 border-t border-border/50">
|
||||
<div className="flex items-center justify-between pt-1 border-t border-border/50 flex-wrap gap-1">
|
||||
{item.datePublication && (
|
||||
<span className="inline-flex items-center gap-1 text-xs text-muted-foreground/70">
|
||||
<span className="inline-flex items-center gap-1 text-xs px-1.5 py-0.5 rounded bg-orange-50 text-orange-700 border border-orange-200">
|
||||
<Calendar size={10} />
|
||||
{formatDate(item.datePublication)}
|
||||
</span>
|
||||
|
||||
@@ -452,11 +452,19 @@ function VeilleGridView({ items, onDetail }: { items: VeilleItem[]; onDetail: (i
|
||||
{item.resume && <p className="text-xs text-muted-foreground line-clamp-3 leading-relaxed">{item.resume}</p>}
|
||||
<div className="flex flex-wrap gap-1.5 pt-1">
|
||||
{item.categorie && <span className="inline-flex items-center gap-1 text-xs text-muted-foreground"><Tag size={10} />{item.categorie}</span>}
|
||||
{item.territoire && <span className="inline-flex items-center gap-1 text-xs text-muted-foreground"><MapPin size={10} />{item.territoire}</span>}
|
||||
{item.niveau && <span className="inline-flex items-center gap-1 text-xs text-muted-foreground"><Layers size={10} />{item.niveau}</span>}
|
||||
{item.territoire && (
|
||||
<span className="inline-flex items-center gap-1 text-xs px-1.5 py-0.5 rounded bg-teal-50 text-teal-700 border border-teal-200">
|
||||
<MapPin size={10} />{item.territoire}
|
||||
</span>
|
||||
)}
|
||||
{item.niveau && (
|
||||
<span className="inline-flex items-center gap-1 text-xs px-1.5 py-0.5 rounded bg-violet-50 text-violet-700 border border-violet-200">
|
||||
<Layers size={10} />{item.niveau}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
{item.datePublication && (
|
||||
<div className="flex items-center gap-1 text-xs text-muted-foreground/70 pt-1 border-t border-border/50">
|
||||
<div className="flex items-center gap-1 text-xs px-1.5 py-0.5 rounded bg-orange-50 text-orange-700 border border-orange-200 mt-1 w-fit">
|
||||
<Calendar size={10} />
|
||||
{formatDate(item.datePublication)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user