C. Cassel
ef302ebda9
Phase 1 - Bug fixes:
- Fix color labels not showing on active line in format preview
- Replace eye emoji with SVG icon showing clear preview/raw state
- Replace // button with comment icon + better tooltip
- Fix ThemePicker accent colors when using system theme
Phase 2 - Font:
- Load JetBrains Mono via Google Fonts with offline fallback
- Add font size control (A-/A+) with keyboard shortcuts
- Persist font size preference in localStorage
Phase 3 - Auth:
- Supabase-based email/password authentication
- Device session management with configurable password renewal TTL
- AuthModal, UserMenu, SecuritySettings components
Phase 4 - Cloud sync:
- Document metadata sync to Supabase PostgreSQL
- Legacy localStorage migration on first login
- IndexedDB persistence via y-indexeddb
Phase 5 - Real-time collaboration:
- Y.js CRDT integration with CodeMirror 6
- Hocuspocus WebSocket server with JWT auth
- Collaborative cursor awareness
- CollabIndicator component
Phase 6 - Sharing:
- Share links with view/edit permissions
- ShareDialog component with copy-to-clipboard
- Minimal client-side router for /s/{token} URLs
Infrastructure:
- Docker Compose with PostgreSQL, GoTrue, PostgREST, Hocuspocus
- Nginx reverse proxy for all backend services
- SQL migrations with RLS policies
- Production-ready Dockerfile with build args
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
40 lines
1.3 KiB
TypeScript
40 lines
1.3 KiB
TypeScript
import { useState, useEffect, useCallback } from 'react'
|
|
|
|
const STORAGE_KEY = 'calctext-fontsize'
|
|
const DEFAULT_SIZE = 15
|
|
export const MIN_FONT_SIZE = 11
|
|
export const MAX_FONT_SIZE = 24
|
|
|
|
function getStoredFontSize(): number {
|
|
try {
|
|
const stored = localStorage.getItem(STORAGE_KEY)
|
|
if (stored) {
|
|
const n = parseInt(stored, 10)
|
|
if (n >= MIN_FONT_SIZE && n <= MAX_FONT_SIZE) return n
|
|
}
|
|
} catch { /* localStorage unavailable */ }
|
|
return DEFAULT_SIZE
|
|
}
|
|
|
|
export function useFontSize() {
|
|
const [fontSize, setFontSizeState] = useState(getStoredFontSize)
|
|
|
|
const setFontSize = useCallback((size: number) => {
|
|
const clamped = Math.max(MIN_FONT_SIZE, Math.min(MAX_FONT_SIZE, size))
|
|
setFontSizeState(clamped)
|
|
try { localStorage.setItem(STORAGE_KEY, String(clamped)) } catch { /* */ }
|
|
document.documentElement.style.setProperty('--editor-font-size', `${clamped}px`)
|
|
}, [])
|
|
|
|
const resetFontSize = useCallback(() => {
|
|
setFontSize(DEFAULT_SIZE)
|
|
}, [setFontSize])
|
|
|
|
// Apply on mount
|
|
useEffect(() => {
|
|
document.documentElement.style.setProperty('--editor-font-size', `${fontSize}px`)
|
|
}, []) // eslint-disable-line react-hooks/exhaustive-deps
|
|
|
|
return { fontSize, setFontSize, resetFontSize, MIN_SIZE: MIN_FONT_SIZE, MAX_SIZE: MAX_FONT_SIZE }
|
|
}
|