US-032: Reduced motion audit, final cleanup, and visual review

- Add prefers-reduced-motion overrides for SubNav button transitions - Add prefers-reduced-motion overrides for smooth scroll behavior - Fix connection status dot/text transitions to respect reduced motion - Create ProjectDetail.tsx renderer and wire into DetailPanel - Remove placeholder fallback from DetailPanel (all types now covered) - Delete unused files: useBreakpoint.ts, profile.ts - Remove unused legacy --pmr-* CSS variables (18 properties) - Remove unused .pmr-theme CSS utility class
2026-02-14 03:20:31 +00:00
parent 071b1b78ae
commit 088b783731
6 changed files with 226 additions and 111 deletions
@@ -1,61 +0,0 @@
-import { useState, useEffect } from 'react'
-
-type Breakpoint = 'mobile' | 'tablet' | 'desktop'
-
-interface BreakpointState {
-  breakpoint: Breakpoint
-  isMobile: boolean
-  isTablet: boolean
-  isDesktop: boolean
-}
-
-export function useBreakpoint(): BreakpointState {
-  const [state, setState] = useState<BreakpointState>(() => {
-    if (typeof window === 'undefined') {
-      return { breakpoint: 'desktop', isMobile: false, isTablet: false, isDesktop: true }
-    }
-    const width = window.innerWidth
-    if (width < 768) {
-      return { breakpoint: 'mobile', isMobile: true, isTablet: false, isDesktop: false }
-    }
-    if (width < 1024) {
-      return { breakpoint: 'tablet', isMobile: false, isTablet: true, isDesktop: false }
-    }
-    return { breakpoint: 'desktop', isMobile: false, isTablet: false, isDesktop: true }
-  })
-
-  useEffect(() => {
-    const handleResize = () => {
-      const width = window.innerWidth
-      let breakpoint: Breakpoint
-      let isMobile: boolean
-      let isTablet: boolean
-      let isDesktop: boolean
-
-      if (width < 768) {
-        breakpoint = 'mobile'
-        isMobile = true
-        isTablet = false
-        isDesktop = false
-      } else if (width < 1024) {
-        breakpoint = 'tablet'
-        isMobile = false
-        isTablet = true
-        isDesktop = false
-      } else {
-        breakpoint = 'desktop'
-        isMobile = false
-        isTablet = false
-        isDesktop = true
-      }
-
-      setState({ breakpoint, isMobile, isTablet, isDesktop })
-    }
-
-    handleResize()
-    window.addEventListener('resize', handleResize)
-    return () => window.removeEventListener('resize', handleResize)
-  }, [])
-
-  return state
-}