zv/wtr
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: add prettier formatting
All checks were successful
CI / Lint, typecheck and build (push) Successful in 9m56s
Details

Browse Source
This commit is contained in:
zv
2026-06-14 20:26:56 +02:00
parent 8bbd9397a1
commit ee55521803
79 changed files with 2451 additions and 969 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
components/forecast/day-forecast-modal.tsx
View File

@@ -82,7 +82,9 @@ export function DayForecastModal({
}, [day, onClose]);
const formattedDate = day
? new Intl.DateTimeFormat(locale, { weekday: "long", day: "numeric", month: "long", timeZone: "UTC" }).format(new Date(`${day.date}T12:00:00Z`))
? new Intl.DateTimeFormat(locale, { weekday: "long", day: "numeric", month: "long", timeZone: "UTC" }).format(
new Date(`${day.date}T12:00:00Z`),
)
: "";
const modal = (
@@ -114,7 +116,9 @@ export function DayForecastModal({
<CloudSun className="size-4" />
{t("forecast.dayDetails")}
</p>
<h2 id="day-forecast-title" className="mt-2 text-2xl font-semibold tracking-tight sm:text-3xl">{locationName}</h2>
<h2 id="day-forecast-title" className="mt-2 text-2xl font-semibold tracking-tight sm:text-3xl">
{locationName}
</h2>
<p className="mt-1 capitalize text-muted">{formattedDate}</p>
</div>
<button
@@ -134,13 +138,25 @@ export function DayForecastModal({
<p className="text-sm text-muted">{getForecastCondition(day.weatherCode, language)}</p>
<div className="mt-2 flex items-end gap-4">
<ForecastIcon code={day.weatherCode} className="mb-2 size-14 text-accent" />
<p className="text-6xl font-semibold tracking-[-0.08em] sm:text-7xl">{formatForecastTemperature(day.temperatureMax, language, temperatureUnit)}</p>
<p className="mb-2 text-2xl text-muted">{formatForecastTemperature(day.temperatureMin, language, temperatureUnit)}</p>
<p className="text-6xl font-semibold tracking-[-0.08em] sm:text-7xl">
{formatForecastTemperature(day.temperatureMax, language, temperatureUnit)}
</p>
<p className="mb-2 text-2xl text-muted">
{formatForecastTemperature(day.temperatureMin, language, temperatureUnit)}
</p>
</div>
</div>
<div className="grid grid-cols-2 gap-2 sm:min-w-[22rem]">
<DayMetric icon={Droplets} label={t("forecast.precipitation")} value={formatForecastRainfall(day.precipitation, language)} />
<DayMetric icon={Wind} label={t("forecast.maxWind")} value={formatForecastWind(maximumWind, language, windSpeedUnit)} />
<DayMetric
icon={Droplets}
label={t("forecast.precipitation")}
value={formatForecastRainfall(day.precipitation, language)}
/>
<DayMetric
icon={Wind}
label={t("forecast.maxWind")}
value={formatForecastWind(maximumWind, language, windSpeedUnit)}
/>
<DayMetric icon={Sunrise} label={t("forecast.sunrise")} value={formatHour(day.sunrise)} />
<DayMetric icon={Sunset} label={t("forecast.sunset")} value={formatHour(day.sunset)} />
</div>
@@ -160,8 +176,14 @@ export function DayForecastModal({
title={getForecastCondition(weatherCode, language)}
>
<p className="text-xs font-medium text-muted">{formatHour(hour.time)}</p>
<ForecastIcon code={weatherCode} isNight={isForecastNight(hour.time, day)} className="mx-auto my-3 size-6 text-accent" />
<p className="text-lg font-semibold tracking-tight">{formatForecastTemperature(hour.temperature, language, temperatureUnit)}</p>
<ForecastIcon
code={weatherCode}
isNight={isForecastNight(hour.time, day)}
className="mx-auto my-3 size-6 text-accent"
/>
<p className="text-lg font-semibold tracking-tight">
{formatForecastTemperature(hour.temperature, language, temperatureUnit)}
</p>
<p className="mt-2 flex items-center justify-center gap-1 text-[0.66rem] text-accent">
<Droplets className="size-3" />
{hour.precipitationProbability === null ? "—" : `${hour.precipitationProbability}%`}