feat: add Polish and English language switcher
This commit is contained in:
@@ -16,15 +16,17 @@ import {
|
||||
} from "@/lib/weather-utils";
|
||||
import type { SynopStation } from "@/types/imgw";
|
||||
import { WeatherIcon } from "@/components/weather/weather-icon";
|
||||
import { useI18n } from "@/lib/i18n";
|
||||
|
||||
export function WeatherHero({ station }: { station: SynopStation }) {
|
||||
const { language, t } = useI18n();
|
||||
const mood = getWeatherMoodFromData(station);
|
||||
const feelsLike = calculateFeelsLike(station.temperature, station.humidity, station.windSpeed);
|
||||
const metrics = [
|
||||
{ icon: Droplets, label: "Wilgotność", value: formatHumidity(station.humidity) },
|
||||
{ icon: Wind, label: "Wiatr", value: formatWind(station.windSpeed) },
|
||||
{ icon: Umbrella, label: "Opad", value: formatRainfall(station.rainfall) },
|
||||
{ icon: Gauge, label: "Ciśnienie", value: formatPressure(station.pressure) },
|
||||
{ icon: Droplets, label: t("weather.humidity"), value: formatHumidity(station.humidity, language) },
|
||||
{ icon: Wind, label: t("weather.wind"), value: formatWind(station.windSpeed, null, language) },
|
||||
{ icon: Umbrella, label: t("weather.rainfall"), value: formatRainfall(station.rainfall, language) },
|
||||
{ icon: Gauge, label: t("weather.pressure"), value: formatPressure(station.pressure, language) },
|
||||
];
|
||||
|
||||
return (
|
||||
@@ -43,10 +45,10 @@ export function WeatherHero({ station }: { station: SynopStation }) {
|
||||
<div className="mt-8 flex items-end justify-between gap-3 sm:mt-10">
|
||||
<div>
|
||||
<div className="text-[5.8rem] font-extralight leading-[0.85] tracking-[-0.11em] sm:text-[8rem]">
|
||||
{formatTemperature(station.temperature)}
|
||||
{formatTemperature(station.temperature, language)}
|
||||
</div>
|
||||
<p className="mt-5 text-xl font-medium tracking-tight sm:text-2xl">{getWeatherDescription(station)}</p>
|
||||
<p className="mt-1 text-sm text-white/75">Odczuwalna {formatTemperature(feelsLike)} · pomiar {formatDateTime(station.measuredAt)}</p>
|
||||
<p className="mt-5 text-xl font-medium tracking-tight sm:text-2xl">{getWeatherDescription(station, language)}</p>
|
||||
<p className="mt-1 text-sm text-white/75">{t("weather.feelsLike")} {formatTemperature(feelsLike, language)} · {t("weather.measurement")} {formatDateTime(station.measuredAt, language)}</p>
|
||||
</div>
|
||||
<WeatherIcon mood={mood} className="mb-4 size-20 text-white/80 sm:size-28" />
|
||||
</div>
|
||||
@@ -61,7 +63,7 @@ export function WeatherHero({ station }: { station: SynopStation }) {
|
||||
{station.windDirection !== null && (
|
||||
<p className="mt-4 flex items-center gap-1.5 text-xs text-white/70">
|
||||
<Navigation className="size-3.5" style={{ transform: `rotate(${station.windDirection}deg)` }} />
|
||||
Kierunek wiatru: {station.windDirection}°
|
||||
{t("weather.windDirection")}: {station.windDirection}°
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user