fix: display evolution indicators inline (flex-row) next to emoji instead of below

This commit is contained in:
2026-02-24 17:17:45 +01:00
parent 51bc187374
commit 30c2b6cc1e

View File

@@ -145,20 +145,20 @@ export function WeatherCard({ sessionId, currentUserId, entry, canEdit, previous
{/* Performance */}
<td className="w-24 px-2 py-3">
{canEditThis ? (
<div className="flex flex-col items-center gap-1">
<div className="flex items-center justify-center gap-1">
<Select
value={performanceEmoji || ''}
onChange={(e) => handleEmojiChange('performance', e.target.value || null)}
options={WEATHER_EMOJIS.map(({ emoji }) => ({ value: emoji, label: emoji }))}
size="sm"
wrapperClassName="!w-fit mx-auto"
wrapperClassName="!w-fit"
className="!w-16 min-w-16 text-center text-lg py-2.5"
/>
<EvolutionIndicator current={performanceEmoji} previous={previousEntry?.performanceEmoji ?? null} />
</div>
) : (
<div className="flex flex-col items-center gap-1">
<div className="text-2xl text-center">{performanceEmoji || '-'}</div>
<div className="flex items-center justify-center gap-1">
<span className="text-2xl">{performanceEmoji || '-'}</span>
<EvolutionIndicator current={performanceEmoji} previous={previousEntry?.performanceEmoji ?? null} />
</div>
)}
@@ -167,20 +167,20 @@ export function WeatherCard({ sessionId, currentUserId, entry, canEdit, previous
{/* Moral */}
<td className="w-24 px-2 py-3">
{canEditThis ? (
<div className="flex flex-col items-center gap-1">
<div className="flex items-center justify-center gap-1">
<Select
value={moralEmoji || ''}
onChange={(e) => handleEmojiChange('moral', e.target.value || null)}
options={WEATHER_EMOJIS.map(({ emoji }) => ({ value: emoji, label: emoji }))}
size="sm"
wrapperClassName="!w-fit mx-auto"
wrapperClassName="!w-fit"
className="!w-16 min-w-16 text-center text-lg py-2.5"
/>
<EvolutionIndicator current={moralEmoji} previous={previousEntry?.moralEmoji ?? null} />
</div>
) : (
<div className="flex flex-col items-center gap-1">
<div className="text-2xl text-center">{moralEmoji || '-'}</div>
<div className="flex items-center justify-center gap-1">
<span className="text-2xl">{moralEmoji || '-'}</span>
<EvolutionIndicator current={moralEmoji} previous={previousEntry?.moralEmoji ?? null} />
</div>
)}
@@ -189,20 +189,20 @@ export function WeatherCard({ sessionId, currentUserId, entry, canEdit, previous
{/* Flux */}
<td className="w-24 px-2 py-3">
{canEditThis ? (
<div className="flex flex-col items-center gap-1">
<div className="flex items-center justify-center gap-1">
<Select
value={fluxEmoji || ''}
onChange={(e) => handleEmojiChange('flux', e.target.value || null)}
options={WEATHER_EMOJIS.map(({ emoji }) => ({ value: emoji, label: emoji }))}
size="sm"
wrapperClassName="!w-fit mx-auto"
wrapperClassName="!w-fit"
className="!w-16 min-w-16 text-center text-lg py-2.5"
/>
<EvolutionIndicator current={fluxEmoji} previous={previousEntry?.fluxEmoji ?? null} />
</div>
) : (
<div className="flex flex-col items-center gap-1">
<div className="text-2xl text-center">{fluxEmoji || '-'}</div>
<div className="flex items-center justify-center gap-1">
<span className="text-2xl">{fluxEmoji || '-'}</span>
<EvolutionIndicator current={fluxEmoji} previous={previousEntry?.fluxEmoji ?? null} />
</div>
)}
@@ -211,20 +211,20 @@ export function WeatherCard({ sessionId, currentUserId, entry, canEdit, previous
{/* Création de valeur */}
<td className="w-24 px-2 py-3">
{canEditThis ? (
<div className="flex flex-col items-center gap-1">
<div className="flex items-center justify-center gap-1">
<Select
value={valueCreationEmoji || ''}
onChange={(e) => handleEmojiChange('valueCreation', e.target.value || null)}
options={WEATHER_EMOJIS.map(({ emoji }) => ({ value: emoji, label: emoji }))}
size="sm"
wrapperClassName="!w-fit mx-auto"
wrapperClassName="!w-fit"
className="!w-16 min-w-16 text-center text-lg py-2.5"
/>
<EvolutionIndicator current={valueCreationEmoji} previous={previousEntry?.valueCreationEmoji ?? null} />
</div>
) : (
<div className="flex flex-col items-center gap-1">
<div className="text-2xl text-center">{valueCreationEmoji || '-'}</div>
<div className="flex items-center justify-center gap-1">
<span className="text-2xl">{valueCreationEmoji || '-'}</span>
<EvolutionIndicator current={valueCreationEmoji} previous={previousEntry?.valueCreationEmoji ?? null} />
</div>
)}