senke
0a29c544af
fix(web): resolve all 568 TypeScript errors — tsc --noEmit now passes with zero errors
...
Major categories fixed:
- TS6133 (188): Remove unused imports (React, icons, types) and variables
- TS2322 (222): Fix type mismatches in stories (satisfies Meta -> const meta: Meta),
add nullish coalescing for optional values, fix component prop types
- TS2345 (43): Fix argument type mismatches with proper null checks and type narrowing
- TS2741 (21): Add missing required properties to mock/story data
- TS2339 (19): Fix property access on incorrect types, add type guards
- TS2353 (13): Remove extra properties from object literals or extend interfaces
- TS2352 (11): Fix type conversion chains
- TS2307 (9): Fix import paths and module references
- Other (42): Fix implicit any, possibly undefined, export declarations
Vite build and tsc --noEmit both pass cleanly.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-13 00:32:08 +01:00
senke
8cbd4f7558
refactor: Phase 7 — Clean up legacy components and remove dead tokens
...
- Bulk replace text-white → text-foreground across 116 component files
(preserving text-white/ opacity variants)
- Remove hover-glow-cyan, shadow-card-glow-cyan, shadow-button-primary-glow
classes from all components
- Replace --duration-normal/--duration-immersive/--duration-slow with
--sumi-duration-normal/--sumi-duration-slow across 130+ files
- Replace --ease-out/--ease-in-out with --sumi-ease-out/--sumi-ease-in-out
- Replace focus:ring-blue-500 → focus:ring-primary (4 files)
- Remove hover:scale-105/110 and hover:-translate-y-1/0.5 transforms
(SUMI anti-pattern: no scale on hover)
- Clean up stale kodo- references in comments
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 02:09:29 +01:00
senke
dce0654720
refactor: Phase 3 — Semantic color + hex + z-index migration
...
Phase 3b: Replace hardcoded hex colors with SUMI palette values
- #66FCF1 (neon cyan) → #7c9dd6 (sumi-accent) across all files
- #3b82f6 (blue-500) → #7c9dd6 in chart components
- #36E5D1 → #7a9e6c (sage), #E4B314 → #c9a84c (gold)
- #E63946 → #d4634a (vermillion)
- Update ThemeSwitcher, AppearanceSettings, SwaggerUI, chart components
Phase 3c: Normalize z-index to SUMI scale
- z-[100] (modals) → z-[400] (--sumi-z-modal)
- z-[110] (player expanded, search) → z-[500] (--sumi-z-popover)
- z-[200] (image viewer) → z-[500]
- z-[35] (navbar overlay) → z-[300] (--sumi-z-overlay)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 01:54:47 +01:00
senke
5cc720be8f
refactor: Phase 3a — Global color class migration to SUMI semantics
...
- Replace all kodo-* color classes across ~100 TSX files:
kodo-void → background, kodo-ink → card, kodo-graphite → muted,
kodo-steel → muted-foreground, kodo-cyan → primary, kodo-magenta → destructive,
kodo-lime → success, kodo-red → destructive, kodo-gold → warning
- Replace cyan-500, magenta-500, lime-500 default Tailwind colors with
semantic equivalents (primary, destructive, success)
- Fix WaveformVisualizer hardcoded hex colors to SUMI values
- Delete global-effects.css (conflicting, redundant with index.css)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 01:51:49 +01:00
senke
230286e073
refactor: Phase 1 — SUMI token foundation
...
- Rewrite index.css with complete SUMI token system (dark + light themes)
- All --sumi-* variables: backgrounds, surfaces, borders, text, pigments,
spacing, radius, shadows, glass, scrollbar, motion, z-index, layout
- shadcn/Radix semantic mapping (--background, --foreground, etc.)
- Tailwind @theme mapping with new fonts (Inter, Space Grotesk, JetBrains Mono)
- SUMI keyframe animations (sumi-fade-in, sumi-slide-up, sumi-scale-in, etc.)
- Delete 11 redundant CSS files (design-system.css, design-tokens.css,
button.css, card.css, input.css, badge-avatar.css, header.css,
fix-input-focus.css, fix-login-form.css, visual-enhancements.css,
premium-utilities.css)
- Update main.tsx: single CSS import (index.css only)
- Update ThemeProvider: data-theme attribute instead of .dark class toggle
- Update index.html FOUC script: data-theme attribute
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-12 01:48:01 +01:00
senke
1e897c95a0
ui(tokens): migrate kodo-cyan to primary (51 files, 88 instances)
...
Replace legacy text-kodo-cyan/border-kodo-cyan/bg-kodo-cyan with semantic
text-primary/border-primary/bg-primary across 51 components.
The brand primary color now uses the design system token, enabling proper
theme adaptation. Covers UI primitives, search, dashboard, chat, playlists,
settings, social, marketplace, and auth components.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:19:12 +01:00
senke
68a4aba534
ui(tokens): migrate text-kodo-secondary to text-muted-foreground (11 files)
...
Replace legacy text-kodo-secondary with semantic text-muted-foreground
across chat, notifications, developer tools, and PWA components.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:13:27 +01:00
senke
66a56409ad
feat(web): UI premium Discord/Spotify-like — tokens, shadows, focus, layout
...
Plan UI premium 6–8 semaines (design system, shell, Storybook, a11y):
- Design system: DESIGN_TOKENS.md, APP_SHELL.md, FULL_LAYOUT_PAGE.md. Single source
for layout/shell (index.css), shadows (design-system.css), durations/easing.
- Tokens: shadow-cover-depth, shadow-gold-glow, shadow-fab-glow; layout max-height
(max-h-layout-drawer, max-h-layout-panel, max-h-layout-list). All duration-200/300/500
replaced by --duration-fast/normal/slow. Arbitrary shadows replaced by token classes.
- Shell & player: Sidebar, Header, GlobalPlayer, MiniPlayer, PlayerQueue, PlayerControls,
AudioPlayer use tokens; focus-visible on Sidebar, PlayerQueue, DropdownMenuTrigger/Item,
TabsTrigger. Typography: text-[10px]/[9px] → text-xs where applicable.
- ESLint: no-restricted-syntax (warn) for w-/h-/rounded-/shadow-/text-/spacing arbitrary.
- Scripts: report-arbitrary-values.mjs, capture/compare/generate visual; visual-complete.spec.ts.
- Stories full layout: Dashboard, Playlists, Library, Settings, Profile in DashboardLayout.stories.
- .cursorrules + README: DESIGN_TOKENS, APP_SHELL, visual commands, no arbitrary without justification.
- apps/web/.gitignore: e2e test artifacts (test-results-visual, playwright-report-visual).
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 17:15:58 +01:00
senke
2964cec09a
chore(dx): add .cursorrules and design system audit documentation
2026-02-05 14:20:06 +01:00
senke
5ed179cfa8
feat(storybook): add stories for Auth, Player, Tracks, Dashboard (Batches 22-25)
...
- Batch 22 (Auth/Settings): OAuthButtons, PasswordStrengthIndicator, ThemeSwitcher, TwoFactorSettings
- Batch 23 (Player): TimeDisplay, RepeatShuffleButtons, NextPreviousButtons, QualitySelector
- Batch 24 (Tracks): LikeButton, TrackFilters, TrackStatsDisplay
- Batch 25 (Dashboard): StatCard
- Fixed build issues with sonner dependencies.
2026-02-02 20:42:51 +01:00
senke
ebf293a4c0
refactor of veza frontend ui- batch 1
2026-01-22 17:23:11 +01:00
senke
5fe4c57e9d
aesthetic-improvements: fix decorative gradient in ThemeSwitcher (Action 11.5.1.6)
...
- ThemeSwitcher: Replaced decorative gradient with solid color (bg-gradient-to-br from-kodo-cyan to-kodo-magenta → bg-kodo-cyan)
- Preserved: Functional overlay gradients for text readability (LiveStreamDetailView, ExploreView, ImageViewerModal, PWAInstallBanner)
- Action 11.5.1.6: Apply direction to all components - Batch 3 complete (gradient fix)
2026-01-16 12:07:15 +01:00
senke
4b047d160a
aesthetic-improvements: fix spacing in components batch 2 (Action 11.5.1.6)
...
- Modals: CreatorModal (p-6 → p-8, space-y-6 → space-y-8)
- Seller: CreateProductView (space-y-6 → space-y-8, 2 instances)
- Social: ExploreView, GroupCard (space-y-6 → space-y-8, p-6 → p-8)
- Studio: ProjectsManager, CloudFileBrowser (space-y-6 → space-y-8, gap-6 → gap-8)
- Theme: ThemeSwitcher (space-y-6 → space-y-8, p-6 → p-8)
- Settings: AppearanceSettingsView (p-6 → p-8, space-y-6 → space-y-8)
- Library: PlaylistsView (space-y-6 → space-y-8)
- Upload: TagSuggestionsModal, LyricsEditorModal, BulkUploadModal (p-6 → p-8, space-y-6 → space-y-8)
- UI: modal, dialog, ImageCropper (p-6 → p-8)
- All spacing now aligned to 8px grid (32px standard padding)
- Action 11.5.1.6: Apply direction to all components - Batch 2 complete (spacing fixes)
2026-01-16 12:06:56 +01:00
senke
51c38a95db
aesthetic-improvements: apply design direction to components batch 1 (Action 11.5.1.6)
...
- UI components: FAB (removed scale transforms), tabs (removed decorative shadow)
- Upload components: FileUploadZone, MetadataEditor, BulkUploadModal (removed scale transforms and decorative gradient)
- Search: SearchBar (removed decorative shadow)
- PWA: PWAInstallBanner (removed decorative shadow)
- Social: ExploreView (removed decorative shadow and image zoom)
- Live: LiveStreamDetailView (removed decorative shadow)
- Player: VisualizerSettingsModal (removed scale transform)
- Marketplace: ReviewProductModal, ProductDetailView (removed scale transforms)
- Library: PlaylistsView (removed scale transform)
- Settings: AppearanceSettingsView (removed scale transform)
- Theme: ThemeSwitcher (removed scale transform)
- Studio: ProjectsManager, CloudFileBrowser (removed scale transforms)
- Social: GroupCard (removed image zoom)
- Seller: CreateProductView (removed scale transform)
- Modals: CreatorModal (removed scale transform)
- Replaced decorative scale transforms with subtle opacity changes or removed entirely
- Action 11.5.1.6: Apply direction to all components - Batch 1 complete (17 components)
2026-01-16 12:06:00 +01:00
senke
7c69474cf9
aesthetic-improvements: align spacing to 8px grid (Action 11.2.1.3)
...
- Created automated script (scripts/align-8px-grid.py) to align all spacing to 8px grid
- Replaced non-8px-aligned spacing: gap-3/p-3/m-3 (12px) → gap-4/p-4/m-4 (16px), gap-5/p-5/m-5 (20px) → gap-6/p-6/m-6 (24px), gap-10/p-10/m-10 (40px) → gap-12/p-12/m-12 (48px), gap-20/p-20/m-20 (80px) → gap-24/p-24/m-24 (96px)
- Preserved: 4px values (gap-1, p-1, m-1) as they may be intentional fine-tuning, responsive breakpoints (sm:, md:, lg:), test files, documentation
- Modified files across all components to ensure consistent 8px grid alignment
- Action 11.2.1.3: Align all elements to 8px grid - COMPLETE
2026-01-16 11:50:46 +01:00
senke
41b1cfaedd
aesthetic-improvements: automated replacement of decorative cyan with steel (80/20 rule, Action 11.3.1.3)
...
- Created automated script (scripts/replace-decorative-cyan.py) to systematically replace decorative/informational kodo-cyan instances with kodo-steel variants
- Script intelligently preserves active/functional states, design system variants, semantic indicators, and interactive states
- Modified 85 files, replaced 145 decorative instances, preserved 47 functional instances
- No linter errors, type safety maintained
- Action 11.3.1.3 significantly advanced (total: ~302 instances replaced across ~229 files including previous batches)
2026-01-16 11:40:13 +01:00
senke
39f7967e1e
incus deployement fully implemented, Makefile updated and make fmt ran
2026-01-13 19:47:57 +01:00
senke
18d8ea1fbe
fix: Corrected ThemeSwitcher and improved visual design
...
- Fixed corrupted ThemeSwitcher.tsx (was all on one line)
- Enhanced theme cards with gradient backgrounds
- Added hover animations and transitions
- Improved visual hierarchy
- Added active theme indicator with glow effect
- Better spacing and typography
2026-01-11 02:37:48 +01:00
senke
0eca0729b5
feat: Visual masterpiece - true light mode & premium UI
...
🎨 **True Light/Dark Mode**
- Implemented proper light mode with inverted color scheme
- Smooth theme transitions (0.3s ease)
- Light mode colors: white backgrounds, dark text, vibrant accents
- System theme detection with proper class application
🌈 **Enhanced Theme System**
- 4 color themes work in both light and dark modes
- Cyber (cyan/magenta), Ocean (blue/teal), Forest (green/lime), Sunset (orange/purple)
- Theme-specific glassmorphism effects
- Proper contrast in light mode
✨ **Premium Animations**
- Float, glow-pulse, slide-in, scale-in, rotate-in animations
- Smooth page transitions
- Hover effects with depth (lift, glow, scale)
- Micro-interactions on all interactive elements
🎯 **Visual Polish**
- Enhanced glassmorphism for light/dark modes
- Custom scrollbar with theme colors
- Beautiful text selection
- Focus indicators for accessibility
- Premium utility classes
🔧 **Technical Improvements**
- Updated UIStore to properly apply light/dark classes
- Added data-theme attribute for CSS targeting
- Smooth scroll behavior
- Optimized transitions
The app is now a visual masterpiece with perfect light/dark mode support!
2026-01-11 02:32:21 +01:00