{#snippet weatherIcon(name: string, size: number = 16)} {/snippet} {#snippet rowHeader(iconName?: string, unit?: string, label?: string)}
{#if iconName} {@render weatherIcon(iconName)} {/if} {#if label} {label} {/if} {#if unit} {unit} {/if}
{/snippet}

{formatZoned(selectedDay, data.timezone, 'EEEE')} – Hourly ({timezoneLabel})

3h 1h
{#if cellData.length > 0} {@const hourly = data.hourly} {@const iconPx = is3h ? 40 : 26}
{#each cellData as _ (_.idx)} {/each} {@render rowHeader('wi-day-cloudy')} {#each cellData as cell, i (cell.idx)} {@const wCode = hourly.weather_code[cell.idx]} {/each} {@render rowHeader('wi-thermometer', tempUnit)} {#each cellData as cell (cell.idx)} {@const temp = hourly.temperature_2m[cell.idx]} {@const style = getTempStyle(temp, String(units.temperature_unit))} {/each} {@render rowHeader(undefined, tempUnit, 'Feels')} {#each cellData as cell (cell.idx)} {@const temp = hourly.apparent_temperature[cell.idx]} {/each} {@render rowHeader('wi-strong-wind', windUnit)} {#each cellData as cell (cell.idx)} {@const wind = hourly.windspeed_10m[cell.idx]} {@const windDir = hourly.winddirection_10m[cell.idx]} {/each} {@render rowHeader('wi-humidity', '%')} {#each cellData as cell (cell.idx)} {@const hum = hourly.relative_humidity_2m[cell.idx]} {/each} {@render rowHeader('wi-cloud', '%')} {#each cellData as cell (cell.idx)} {@const cloud = hourly.cloud_cover[cell.idx]} {/each} {@render rowHeader('wi-raindrop', precipUnit)} {#each cellData as cell (cell.idx)} {@const precip = hourly.precipitation[cell.idx]} {@const prob = hourly.precipitation_probability[cell.idx]} {/each}
Hourly weather details for {locationName}
{timezoneLabel} {#if sunTimes && sunrisePercent != null && sunsetPercent != null}
{formatTime(sunTimes.sunrise)}
{formatTime(sunTimes.sunset)}
{/if} {#each cellData as cell, i (cell.idx)} {@const leftPct = (i / cellData.length) * 100} {@const widthPct = 100 / cellData.length} {#if is3h} {formatZoned(cell.date, data.timezone, 'HH')} {:else} {formatZoned(cell.date, data.timezone, 'HH')} 00 {/if} {/each}
{@render weatherIcon(getWeatherIconName(wCode, cell.isDaytime), iconPx)}
{formatTemp(temp)}
{formatTemp(temp)}
{#if windDir != null && !isNaN(windDir)} {@render weatherIcon('wi-direction-down', 24)} {/if} {formatValue(wind)}
{formatValue(hum)}
{formatValue(cloud)}
{#if precip > 0}
{precip.toFixed(1)} {/if}
{/if}