- Header now shows weather icon + temp from weather.forecast_home_2 next to the connection badge (right side of nav bar) - New ChoreChart widget below TodoWidget on Home view; reads from todo.chores HA entity; items prefixed with a name (Becca: / Chris: / Arabella:) get per-person color coding matching the calendar palette; tap toggles completion - Controls overlay simplified from grid-cols-12 auto-rows-min to a plain grid-cols-2 — removes the uneven gaps between widgets
41 lines
1.5 KiB
TypeScript
41 lines
1.5 KiB
TypeScript
import { useUIStore } from '@/stores/uiStore';
|
|
import { useSettingsStore } from '@/stores/settingsStore';
|
|
import { LightsWidget } from '@/components/lights';
|
|
import { LocksWidget } from '@/components/locks';
|
|
import { ThermostatWidget } from '@/components/climate';
|
|
import { AlarmoPanel } from '@/components/alarm';
|
|
|
|
export function ControlsOverlay() {
|
|
const closeControlsOverlay = useUIStore((s) => s.closeControlsOverlay);
|
|
const config = useSettingsStore((s) => s.config);
|
|
|
|
return (
|
|
<div className="overlay-full">
|
|
<header className="h-16 bg-dark-secondary border-b border-dark-border flex items-center justify-between px-5 shrink-0">
|
|
<h2 className="text-2xl font-bold text-ink">Controls</h2>
|
|
<button
|
|
onClick={closeControlsOverlay}
|
|
className="btn btn-sm"
|
|
aria-label="Close controls"
|
|
>
|
|
<svg className="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
|
|
</svg>
|
|
Close
|
|
</button>
|
|
</header>
|
|
|
|
<div className="flex-1 overflow-auto p-5">
|
|
<div className="grid grid-cols-2 gap-4">
|
|
{config.alarm && <AlarmoPanel />}
|
|
{config.thermostats.map((thermostat) => (
|
|
<ThermostatWidget key={thermostat.entityId} config={thermostat} />
|
|
))}
|
|
{config.lights.length > 0 && <LightsWidget />}
|
|
{config.locks.length > 0 && <LocksWidget />}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|