C. Cassel
0d38bd3108
Transform CalcText from a single-document calculator into a full workspace application with multi-document support, theming, and responsive mobile experience. - Theme system: 5 presets (Light, Dark, Matrix, Midnight, Warm) + accent colors - Document model with localStorage persistence and auto-save - Tab bar with keyboard shortcuts (Ctrl+N/W/Tab/1-9), rename, close - Sidebar with search, recent, favorites, folders, templates, drag-and-drop - 5 templates: Budget, Invoice, Unit Converter, Trip Planner, Loan Calculator - Status bar with cursor position, engine status, dedication to Igor Cassel - Results panel: type-specific colors, click-to-copy, error hints - Format toolbar: H, B, I, //, color labels with live preview toggle - Syntax highlighting using theme CSS variables - Error hover tooltips - Mobile: bottom results tray, sidebar drawer, touch targets, safe areas - Docker multi-stage build (Rust WASM + Vite + Nginx) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
95 lines
3.6 KiB
Markdown
95 lines
3.6 KiB
Markdown
# CalcText — Simplified Product Brief
|
|
|
|
**Date:** 2026-03-17
|
|
**Type:** Brownfield — Workspace Evolution
|
|
**Brief Level:** Simplified
|
|
|
|
---
|
|
|
|
## Project Scope
|
|
|
|
CalcText is a cross-platform notepad calculator (Web, macOS, Windows) powered by a shared Rust calculation engine with 200+ unit conversions, 180+ fiat currencies, 50+ crypto, date/time math, and 50+ built-in functions.
|
|
|
|
The web app is evolving from a single-document, two-column calculator into a **full workspace application** with:
|
|
|
|
- **Multi-theme system** — Light, Dark, Matrix, and custom user-defined themes
|
|
- **Tabbed documents** — Multiple calctext files open simultaneously
|
|
- **File sidebar** — Left panel with folder organization, recent files, favorites, templates
|
|
- **localStorage persistence** — Documents survive page reloads without backend
|
|
- **Elevated results panel** — Richer, subtler result display
|
|
|
|
**Platform strategy:** Web-first design. Once established, replicate the UX patterns to macOS (SwiftUI) and Windows (iced/Rust). The design must be portable — avoid web-only paradigms that don't translate to native.
|
|
|
|
---
|
|
|
|
## Challenge & Opportunity
|
|
|
|
CalcText has a powerful engine trapped in a basic single-document UI. The current web app is functional but doesn't reflect the depth of what the engine can do, and doesn't invite users to stay.
|
|
|
|
**The opportunity:** No competitor (Soulver, Numi, Numbr, PCalc) offers a true multi-document workspace with theming and file organization for calculations. CalcText can own this gap — becoming the app users open daily and live in, not just visit for a quick calculation.
|
|
|
|
**The gap:** Current UI is a text editor with results. The vision is a professional workspace where calculations are organized, styled, and persistent.
|
|
|
|
---
|
|
|
|
## Design Goals
|
|
|
|
### Functional
|
|
- Multi-theme engine with preset themes and custom theme support
|
|
- Tab bar for multi-document management
|
|
- Collapsible file sidebar with tree view, folders, and templates
|
|
- Document model with create, rename, delete, organize
|
|
- localStorage persistence for all documents and preferences
|
|
|
|
### Experience
|
|
- Professional workspace feel — "VS Code/Notion for numbers"
|
|
- Complete experience shipped as one coherent product, not incremental phases
|
|
- Matrix theme as a brand differentiator and personality statement
|
|
- Intuitive for first-time users, powerful for daily users
|
|
|
|
### Business
|
|
- Web-first design that establishes reusable UX patterns
|
|
- Cross-platform portable design language
|
|
- Foundation for future premium features (cloud sync, accounts, collaboration)
|
|
|
|
---
|
|
|
|
## Constraints
|
|
|
|
### Technical (locked in)
|
|
- React 19 + CodeMirror 6 + Vite 7
|
|
- Rust WASM engine running in Web Worker
|
|
- Custom CSS with CSS custom properties (no Tailwind, no shadcn)
|
|
- PWA architecture (service worker, manifest, offline support)
|
|
|
|
### Deferred (out of scope this phase)
|
|
- User accounts and authentication
|
|
- Cloud save and sync (Supabase planned)
|
|
- Collaborative real-time editing (CRDT)
|
|
- Shareable URL links
|
|
- Embeddable widget
|
|
|
|
### Cross-platform
|
|
- Design patterns must translate to SwiftUI (macOS) and iced (Windows)
|
|
- Avoid web-only interactions that don't port to native
|
|
- Shared engine means consistent calculation behavior across platforms
|
|
|
|
### Timeline & Budget
|
|
- Flexible — no hard deadline
|
|
- Stakes: enterprise/high — quality over speed
|
|
|
|
---
|
|
|
|
## Current State Reference
|
|
|
|
See `01-brownfield-analysis.md` for complete codebase scan including:
|
|
- All CSS custom properties and values
|
|
- Component inventory and props
|
|
- Responsive breakpoints and behavior
|
|
- Accessibility audit
|
|
- Cross-platform comparison (macOS vs Web)
|
|
|
|
---
|
|
|
|
_Created using Whiteport Design Studio (WDS) methodology_
|