SPB Git

spb/qwhpi Public

QHPI — Quebec Housing Price Index: quality-adjusted, hierarchically pooled housing price indexes.

Python 63.9% TypeScript 25.4% CSS 5.5% TeX 3.5% SQL 0.8% Makefile 0.5% Dockerfile 0.5%
1.2 KB · 43 lines tsx
Raw Blame History
1/**2 * =============================================================================3 * QWHPI — Quebec Weekly Housing Price Index4 * Author  : Simon-Pierre Boucher5 * Contact : contact@spboucher.ai6 * File    : web/components/ThemeToggle.tsx7 * Purpose : Light/dark theme toggle (data-theme attribute wins over OS).8 * =============================================================================9 */10"use client";1112import { useEffect, useState } from "react";1314export default function ThemeToggle() {15  const [theme, setTheme] = useState<string | null>(null);1617  useEffect(() => {18    const saved = localStorage.getItem("qwhpi-theme");19    if (saved) {20      setTheme(saved);21      document.documentElement.dataset.theme = saved;22    }23  }, []);2425  const toggle = () => {26    const current =27      theme ??28      (window.matchMedia("(prefers-color-scheme: dark)").matches29        ? "dark"30        : "light");31    const next = current === "dark" ? "light" : "dark";32    setTheme(next);33    document.documentElement.dataset.theme = next;34    localStorage.setItem("qwhpi-theme", next);35  };3637  return (38    <button className="ctrl" onClick={toggle} aria-label="Toggle color theme">39      {theme === "dark" ? "Light" : "Dark"} mode40    </button>41  );42}43