mirror of
https://github.com/R0m1k3/LogiFlow.git
synced 2026-10-22 22:48:15 +02:00
Merge pull request #146 from R0m1k3/1.1
Improve weather widget readability with clear daily and yearly temper…
This commit is contained in:
1 file changed
+10
-10
@@ -169,31 +169,31 @@ export default function WeatherWidget() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Températures actuelles */}
|
{/* Températures avec en-têtes */}
|
||||||
<div className="flex items-center gap-3">
|
<div className="flex items-stretch gap-3">
|
||||||
<div className="text-center">
|
<div className="text-center">
|
||||||
|
<div className="text-xs text-slate-500 dark:text-slate-400 mb-1 font-medium">
|
||||||
|
Aujourd'hui
|
||||||
|
</div>
|
||||||
<div className="text-2xl font-bold text-slate-800 dark:text-slate-100">
|
<div className="text-2xl font-bold text-slate-800 dark:text-slate-100">
|
||||||
{currentTemp !== undefined ? `${Math.round(currentTemp)}°` : '--°'}
|
{currentTemp !== undefined ? `${Math.round(currentTemp)}°` : '--°'}
|
||||||
</div>
|
</div>
|
||||||
<div className="text-xs text-slate-500 dark:text-slate-400">
|
|
||||||
Aujourd'hui
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Comparaison avec l'an dernier */}
|
{/* Comparaison avec l'an dernier */}
|
||||||
{previousTemp !== undefined && (
|
{previousTemp !== undefined && (
|
||||||
<>
|
<>
|
||||||
<div className="h-12 w-px bg-slate-300 dark:bg-slate-600"></div>
|
<div className="h-12 w-px bg-slate-300 dark:bg-slate-600 self-center"></div>
|
||||||
<div className="text-center min-w-[80px]">
|
<div className="text-center min-w-[90px]">
|
||||||
|
<div className="text-xs text-slate-500 dark:text-slate-400 mb-1 font-medium">
|
||||||
|
Année dernière
|
||||||
|
</div>
|
||||||
<div className="flex items-center justify-center gap-1 mb-1">
|
<div className="flex items-center justify-center gap-1 mb-1">
|
||||||
<WeatherIcon condition={weather.previousYear?.condition || ''} size={16} />
|
<WeatherIcon condition={weather.previousYear?.condition || ''} size={16} />
|
||||||
<div className="text-lg font-semibold text-slate-600 dark:text-slate-300">
|
<div className="text-lg font-semibold text-slate-600 dark:text-slate-300">
|
||||||
{Math.round(previousTemp)}°
|
{Math.round(previousTemp)}°
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="text-xs text-slate-500 dark:text-slate-400 mb-1">
|
|
||||||
Année dernière
|
|
||||||
</div>
|
|
||||||
<div className="text-xs text-slate-600 dark:text-slate-300 font-medium leading-tight">
|
<div className="text-xs text-slate-600 dark:text-slate-300 font-medium leading-tight">
|
||||||
{translateToFrench(weather.previousYear?.condition || '')}
|
{translateToFrench(weather.previousYear?.condition || '')}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in new issue
Block a user