julienfroidefond/workshop-manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(ui): unify low-level controls and expand design system
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 2m57s
Details

Browse Source
This commit is contained in:
Julien Froidefond
2026-03-03 15:50:15 +01:00
parent 9a43980412
commit db7a0cef96
47 changed files with 1404 additions and 711 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
src/components/weather/WeatherInfoPanel.tsx
View File

@@ -1,58 +1,36 @@
'use client';
import { useState } from 'react';
import { Disclosure } from '@/components/ui';
export function WeatherInfoPanel() {
const [isOpen, setIsOpen] = useState(false);
return (
<div className="mb-6 rounded-lg border border-border bg-card-hover">
<button
onClick={() => setIsOpen(!isOpen)}
className="w-full flex items-center justify-between px-4 py-2.5 text-left transition-colors hover:bg-card"
>
<h3 className="text-sm font-semibold text-foreground">
Les 4 axes de la météo personnelle
</h3>
<svg
className={`h-4 w-4 text-muted transition-transform ${isOpen ? 'rotate-180' : ''}`}
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
</svg>
</button>
{isOpen && (
<div className="border-t border-border px-4 py-3">
<div className="grid gap-2.5 sm:grid-cols-2 lg:grid-cols-4">
<div>
<p className="text-xs font-medium text-foreground mb-0.5">☀️ Performance</p>
<p className="text-xs text-muted leading-relaxed">
Votre performance personnelle et l&apos;atteinte de vos objectifs
</p>
</div>
<div>
<p className="text-xs font-medium text-foreground mb-0.5">😊 Moral</p>
<p className="text-xs text-muted leading-relaxed">
Votre moral actuel et votre ressenti
</p>
</div>
<div>
<p className="text-xs font-medium text-foreground mb-0.5">🌊 Flux</p>
<p className="text-xs text-muted leading-relaxed">
Votre flux de travail personnel et les blocages éventuels
</p>
</div>
<div>
<p className="text-xs font-medium text-foreground mb-0.5">💎 Création de valeur</p>
<p className="text-xs text-muted leading-relaxed">
Votre création de valeur et votre apport
</p>
</div>
</div>
<Disclosure title="Les 4 axes de la météo personnelle" className="mb-6">
<div className="grid gap-2.5 sm:grid-cols-2 lg:grid-cols-4">
<div>
<p className="mb-0.5 text-xs font-medium text-foreground">☀️ Performance</p>
<p className="text-xs leading-relaxed text-muted">
Votre performance personnelle et l&apos;atteinte de vos objectifs
</p>
</div>
)}
</div>
<div>
<p className="mb-0.5 text-xs font-medium text-foreground">😊 Moral</p>
<p className="text-xs leading-relaxed text-muted">
Votre moral actuel et votre ressenti
</p>
</div>
<div>
<p className="mb-0.5 text-xs font-medium text-foreground">🌊 Flux</p>
<p className="text-xs leading-relaxed text-muted">
Votre flux de travail personnel et les blocages éventuels
</p>
</div>
<div>
<p className="mb-0.5 text-xs font-medium text-foreground">💎 Création de valeur</p>
<p className="text-xs leading-relaxed text-muted">
Votre création de valeur et votre apport
</p>
</div>
</div>
</Disclosure>
);
}