senke
c3cd478508
feat(ui): contextual skeleton loading + list stagger animations
...
Skeleton loading (5 pages migrated from spinner):
- SettingsPage: tabs + profile + settings cards skeleton
- RolesPage: table header + 6 data rows + assign role skeleton
- MarketplaceHome: filter bar + category pills + 8 product cards
- TrackSearchResults: results count + 8 track card grid
- PlaybackSummary: 3-column stats skeleton
List stagger animations (5 lists):
- New stagger-fade-in CSS keyframe (translateY 8px, 250ms, ease-out)
- 50ms per item delay, capped at 500ms (10+ items render together)
- Applied to: NotificationsPage, PlaylistList, PlaylistTrackList (static),
dashboard TrackList, NotificationMenuList
- Respects prefers-reduced-motion
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:59:54 +01:00
senke
2fd7935957
feat(ui): remaining polish — DnD feedback, typography headings, lightbox, share dialog
...
Includes changes from previous session that weren't fully staged:
- PlaylistDetailView + QueueView: drag-over visual feedback
- PlaylistTrackListSortableItem: DnD opacity + shadow + insertion line
- ImageViewerModal: zoom toggle, keyboard nav, image counter, loading skeleton
- Badge: dismissible, pulse, dot-only enhancements
- ShareDialog: useCopyToClipboard integration
- SessionsPage, NotificationsPage, SettingsPage, DashboardPage: typography utility classes
- index.css: like-bounce, shake, empty-state-in, marquee, typography utilities
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:54:39 +01:00
senke
8f69e0ab0a
feat(ui): badge polish, DnD feedback, typography system, image lightbox
...
Badge component:
- Dismissible variant with X button (onDismiss prop)
- Pulse animation variant (pulse prop)
- Enhanced dot-only mode for standalone colored circles
Drag-and-drop visual feedback:
- PlaylistTrackListSortableItem: opacity + shadow + ring on drag, border insertion line
- QueueView: dragOverIndex tracking, bg-primary/5 drop zone highlight
- PlaylistDetailView: same DnD feedback pattern
Typography standardization:
- 9 utility classes: text-display, text-heading-1..4, text-body-lg, text-body, text-caption, text-label
- Applied to 8 page headings (Dashboard, Settings, Library, Search, etc.)
- DESIGN_TOKENS.md updated with typography reference
Image lightbox:
- Keyboard navigation: ArrowLeft/Right for gallery, Escape to close
- Image counter pill: "2 / 5" with backdrop-blur
- Zoom toggle: click to zoom in/out with scale transition
- Loading skeleton: pulse placeholder while image loads
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:52:33 +01:00
senke
2131da1a9a
feat(ui): header glassmorphism, card hover effects, content transitions, badge animations
...
Header polish:
- Glassmorphism: bg-background/80 backdrop-blur-lg + subtle border
- Search bar focus-within ring on container
- Avatar hover: ring-primary/50 + scale-105
- Notification badge animate-pulse
Card hover effects:
- Interactive Card variant: hover border-primary/20 tint
- ProductCard: lift (-translate-y-1) + shadow-lg + cover scale-105
- PlaylistCard: lift + shadow-lg + cover scale-105
- CourseCard: lift + shadow-xl + cover scale-105
ContentTransition component (new):
- Reusable skeleton-to-content crossfade with AnimatePresence
- Applied to DashboardPage as proof-of-concept
Notification badge pulse:
- Sidebar collapsed badges: radar-ping effect (animate-ping behind solid dot)
- Header notification bell: matching ping animation on unread count
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:25:52 +01:00
senke
cd764d32cb
feat(ui): premium empty states + focus ring consistency
...
Empty states enhanced:
- EmptyState component gains variant prop (default/centered/card)
- Soft entry animation (fade + scale) via new CSS keyframe
- Icon wrapped in muted background circle
- Library: "Your library is empty" + "Upload Track" action
- Search: "No results found" + improved description
- Wishlist: "Explore the marketplace" + Browse button
- Queue: "Nothing in your queue" with autoplay context
- Chat: improved no-conversation and no-messages states
Focus ring consistency (6 files fixed):
- input.tsx: ring-primary/30 → ring-ring + ring-offset
- checkbox.tsx: peer-focus → peer-focus-visible + ring-ring
- textarea.tsx: focus:ring-1 → focus-visible:ring-2 + ring-ring
- List.tsx: added ring-offset-background
- TrackListRow.tsx: full focus-visible on rows + action buttons
- PlaylistCard.tsx: focus-visible on checkbox button
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:23:09 +01:00
senke
592cc94b63
feat(ui): polish, animations & performance optimizations
...
Sprint 4.1 — Exit animations with framer-motion AnimatePresence:
- modal.tsx: overlay fade + panel scale/fade entry/exit
- dropdown.tsx: slide/fade entry/exit
Sprint 4.2 — Missing hover transitions on PostCard:
- Added transition-colors to author name + tags hover states
Sprint 4.3 — Button loading prop:
- Added loading?: boolean with Loader2 spinner + auto-disable
Sprint 4.4 — OptimizedImage replacement:
- PostCard, ProductCard, CourseCard, PlaylistDetailView content images
Sprint 4.5 — React.memo on list components:
- ProductCard, PlaylistCard, TrackCard, CourseCard, PostCard
Sprint 4.6 — Consolidate duplicates:
- Deleted KodoEmptyState (redundant with EmptyState)
- Documented Spinner vs LoadingSpinner distinction (complementary)
- Confirmed Dialog delegates to Modal (correct architecture)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:05:26 +01:00
senke
bfdc785ccc
refactor(tokens): complete design token migration to semantic system
...
Sprint 3.1 — Default colors → semantic (~15 files, ~99 replacements):
- lime-500 → success, red-500 → destructive, cyan-500 → primary
Sprint 3.2 — Hardcoded colors → semantic (~13 files, ~99 replacements):
- text-white → text-foreground, bg-black → bg-background, bg-white → bg-card
Sprint 3.3 — Legacy kodo-* → semantic (~27 files, ~122 replacements):
- bg-kodo-ink → bg-card, bg-kodo-void → bg-background, text-kodo-steel → text-muted-foreground
- Preserved kodo-cyan/magenta/lime/gold palette accents and gradients
Sprint 3.4 — Arbitrary values → Tailwind scale (5 replacements):
- min-h-[600px] → min-h-layout-page, min-h-[400px] → min-h-layout-page-sm
- left-[50%] → left-1/2, min-h-[80px] → min-h-20, min-h-[40px] → min-h-10
Sprint 3.5 — Border-radius standardization (4 replacements):
- Modal/dialog skeletons: rounded-lg → rounded-xl (convention)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 23:05:09 +01:00
senke
dd6333d540
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
6d9a4b0a5a
ui(tokens): migrate bg-kodo-steel to bg-muted (46 files, 76 instances)
...
Replace legacy hardcoded bg-kodo-steel (RGB 59,69,84, theme-unaware)
with semantic bg-muted token across 46 user-facing components.
This completes the kodo-steel elimination from source files: text, border,
and background variants are now all on semantic design system tokens.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:08:42 +01:00
senke
68417c667c
ui(tokens): migrate border-kodo-steel to border-border (86 files, 269 instances)
...
Replace legacy hardcoded border-kodo-steel (RGB 59,69,84, theme-unaware)
with semantic border-border token across 86 user-facing components.
Covers UI primitives (checkbox, badge, modal, table, textarea, alert,
radio-group, avatar), all modals, settings views, social features,
playlist views, inventory, chat, commerce, and cloud file browser.
Only story/test files retain the legacy token.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:07:00 +01:00
senke
7113d35a4a
ui(tokens): complete text-kodo-content-dim → text-muted-foreground migration (52 files)
...
Eliminate all remaining text-kodo-content-dim from user-facing source files.
This legacy token (hardcoded Gray-400) is now fully replaced by the
theme-aware text-muted-foreground token across UI primitives, settings,
social features, playlists, modals, inventory, and admin views.
Only story files (.stories.tsx) retain the old token for reference.
Total migration: ~345 instances across 87 files (this + previous commit).
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:04:51 +01:00
senke
a508dde511
ui(tokens): migrate text-kodo-content-dim to text-muted-foreground (35 files, 160 instances)
...
Replace legacy hardcoded `text-kodo-content-dim` (Gray-400, theme-unaware)
with semantic `text-muted-foreground` across 35 user-facing components.
This ensures all secondary/muted text adapts correctly to light/dark theme
changes instead of staying fixed at a single gray value.
Covers: SearchBar, PlaylistsView, NotificationBell, TrackAnalyticsView,
LiveStreamDetailView, LicenceCard, FilePreviewCard, PasswordStrengthIndicator,
NotificationItem, TrackList, CourseCard, GroupCard, AchievementCard, XPBar,
EquipmentCard, SellerDashboardView, APIPlaygroundView, DeveloperDashboardView,
CreatorModal, AddToPlaylistModal, LicenceDetailsModal, QuizModal,
CertificateModal, FlashSaleModal, CreateAPIKeyModal, LyricsEditorModal,
WatermarkSettingsModal, ProfileXPView, LeaderboardView, PostCard,
ExploreView, FeedView, MessageSearch, TypingIndicator, PlaylistTrackItem.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-09 00:03:33 +01:00
senke
0d0046f48c
ui(components): migrate 16 skeleton files from animate-pulse to Skeleton shimmer
...
Replace raw `animate-pulse bg-muted` divs with the `<Skeleton>` component
across all major page and section skeletons. Every loading state now uses
the premium sweeping shimmer animation instead of the basic pulse.
Files: TrackDetailPageSkeleton, LibraryPageSkeleton, PlaylistDetailPageSkeleton,
DiscoverViewSkeleton, PlaybackDashboardSkeleton, StudioViewSkeleton,
MonitoringDashboardSkeleton, LibraryManagerSkeleton, UploadViewSkeleton,
FileManagerViewSkeleton, TrackSearchFiltersSkeleton, TrackListPaginationSkeleton,
TrackFiltersSkeleton, TrackHistorySkeleton, PlaylistActionsSkeleton, TrackGrid.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 23:12:58 +01:00
senke
fec4d3dd12
ui(components): fix PlaylistCard hover transition and add focus-visible
...
- Remove transition-opacity that was overriding Card's shadow/color
transitions (hover:shadow-xl was not animating)
- Add focus-visible ring to selectable wrapper and Link wrapper
- Replace ring-blue-500 (arbitrary color) with ring-primary (design system)
for selected state
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:55:23 +01:00
senke
a0bf68535f
ui(tokens): migrate remaining arbitrary min-w values to Tailwind scale
...
- min-w-[140px] → min-w-36 (AdminModerationView)
- min-w-[100px] → min-w-24 (PlaylistFollowButton, FollowButton)
- min-w-[80px] → min-w-20 (PasswordStrengthIndicator)
- collapsible.tsx: eslint-disable comment for max-h-[5000px] animation
technique (documented exception)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:48:37 +01:00
senke
dc88ea6805
ui(tokens): migrate text-[10px] to text-xs across 23 components
...
Replace all arbitrary text-[10px] / text-[9px] with the standard Tailwind
text-xs token. Also migrates nearby arbitrary width values where applicable
(max-w-[200px] → max-w-48, max-w-[120px] → max-w-32, h-[1px] → h-px).
Only documented exceptions remain: avatar xs (text-[10px] for w-6 h-6
initials) and badge JSDoc reference.
Affected areas: admin views, marketplace, player, settings, chat, upload,
education, commerce, library, PWA, search, navbar, user card.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-08 22:47:19 +01:00
senke
39b2b642d2
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
e8864fdb25
style(playlists,ui): elevate PlaylistListToolbar, DataList, Select to SaaS Premium
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:26:55 +01:00
senke
e293cc9366
style(stories): replace kodo decorators with design tokens in all story files
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 15:10:32 +01:00
senke
d600e3858c
style(playlists): elevate playlist batch/track-list to SaaS Premium
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 14:54:46 +01:00
senke
11ec40b692
refactor(playlists): split PlaylistDetailPage into module with Hero, CoverAndInfo, ActionsBar, Tabs, Skeleton, NotFound
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 06:46:30 +01:00
senke
1ebfacd12c
refactor(playlists): split PlaylistActions into module (buttons, edit dialog, skeleton)
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 06:09:51 +01:00
senke
6dd7a312aa
refactor(web): split PlaylistAnalytics into module (stat cards, main/advanced, error, skeleton)
...
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-07 04:53:54 +01:00
senke
648cda6bf3
refactor(playlists): AddCollaboratorModal module, re-export, stories, tests
...
- Module add-collaborator-modal: types, useAddCollaboratorModal, Form, Skeleton
- Re-export from AddCollaboratorModal.tsx
- Stories: Default, Loading (Skeleton), Error (MSW)
- Tests: validation/mutation via ErrorDisplay, retry, no toast assertions
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 01:04:24 +01:00
senke
cf9bc76a03
refactor(playlists): découper SharePlaylistModal en module
...
- Module share-playlist-modal/ : useSharePlaylistModal, Content, Skeleton
- ErrorDisplay + retry (max 3), Spinner pour chargement
- Stories : Default, Loading, Error (MSW 500)
- Tests : useCreateShareLink mock, playlistId string
- Re-export depuis SharePlaylistModal.tsx
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 00:57:48 +01:00
senke
b3b206dd2b
refactor(playlists): découper CreatePlaylistDialog en module
...
- Module create-playlist-dialog/ : schema zod, useCreatePlaylistDialog,
CreatePlaylistDialogForm, CreatePlaylistDialogSkeleton
- Bouton Créer avec Spinner (remplace Loader2)
- Stories : Default, Loading
- Tests : assertion createPlaylist(object), erreur avec Error
- Re-export depuis CreatePlaylistDialog.tsx
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 00:52:51 +01:00
senke
40f43a9640
refactor(playlists): découper PlaylistSearch en module
...
- Module playlist-search/ : usePlaylistSearch, Bar, Filters, Results, Skeleton
- Chargement avec Spinner (remplace Loader2)
- PLAYLIST_SEARCH activé en Storybook (VITE_STORYBOOK)
- MSW : GET /api/v1/playlists/search
- Stories : Default, Loading, Empty, Error
- Tests : Vitest + mock playlistsApi, useToast stable
- Re-export depuis PlaylistSearch.tsx
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 00:47:28 +01:00
senke
5f5275f6bb
refactor(playlists): découper PlaylistBatchActions en module
...
- Module playlist-batch-actions/ : usePlaylistBatchActions, exportUtils,
Bar, Buttons, DeleteDialog, Skeleton
- Boutons min-h-11 (remplace min-h-[44px])
- Stories : Default, SingleSelection, Loading
- Tests : mocks URL + Playlist id/user_id en string
- Re-export depuis PlaylistBatchActions.tsx
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 00:37:06 +01:00
senke
157bda45e2
refactor(playlists): découper AddTrackToPlaylistModal en module
...
- Module add-track-to-playlist-modal/ : useAddTrackToPlaylistModal, Search,
List, TrackRow, Footer, Skeleton
- Liste max-h-96 (layout), Spinner pour chargement
- Stories : Default (useArgs), Loading (Skeleton)
- Re-export depuis AddTrackToPlaylistModal.tsx
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 00:22:09 +01:00
senke
d1ad2639e4
refactor(playlists): PlaylistTrackList module with hook, subcomponents, skeleton
...
- Add playlist-track-list/ with usePlaylistTrackList, Empty, SortableItem, Skeleton, utils
- Prop isLoading for skeleton state
- Re-export from PlaylistTrackList.tsx and PlaylistTrackListSkeleton.tsx
- Stories: Default, Loading (Skeleton), Empty, Reordering (with mock data)
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-06 00:14:19 +01:00
senke
a13555f58d
refactor(playlists): extract PlaylistList into playlist-list module
...
- Add playlist-list/ with usePlaylistList, PlaylistListToolbar, PlaylistListEmpty,
PlaylistListError, types; keep PlaylistListSkeleton at components level
- Re-export from PlaylistList.tsx for backward compatibility
- Stories: Default, Grid, Empty (MSW), Loading (skeleton, min-h-layout-story)
- Replace min-h-[44px] with min-h-11; no arbitrary values
- Tests: assert French labels and Pagination text; fix skeleton test
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-05 22:54:54 +01:00
senke
c8b640263d
chore(dx): add .cursorrules and design system audit documentation
2026-02-05 14:20:06 +01:00
senke
97c77a1925
refactor(storybook): remove duplicate providers from stories (Phase 2)
...
Stories no longer wrap with QueryClientProvider, ToastProvider,
ThemeProvider, or MemoryRouter; global StorybookDecorator provides them.
- Route-specific pages use parameters.router.initialEntries
(ResetPasswordPage, VerifyEmailPage) or minimal MemoryRouter+Route
where useParams is needed (TrackDetailPage, PlaylistDetailPage).
- Stories that seeded query cache use useQueryClient() from global
decorator (FollowButton, CollaboratorManagement, CommentSection).
- Navbar, AuthLayout, DashboardLayout, Header, and 25+ story files
simplified to layout divs only.
Co-authored-by: Cursor <cursoragent@cursor.com>
2026-02-05 13:08:17 +01:00
senke
d2ae91ac25
chore(storybook): improve configuration and cleanup
2026-02-04 00:44:40 +01:00
senke
a2576c4eae
stabilisation: fix commit
2026-02-03 09:56:11 +01:00
senke
2e8dbb74d5
feat(storybook): add stories for Feedback and Playlist components (Batches 20-21)
...
- Batch 20 (Feedback): Alert, Toast
- Batch 21 (Playlists): PlaylistCard, PlaylistHeader, AddTrackToPlaylistModal
- Verified successful build.
2026-02-02 20:38:52 +01:00
senke
f61c0c3dcc
improving UI: adding API doc to Developer Page
2026-01-26 14:12:17 +01:00
senke
8803070c2e
feat(frontend): complete design system migration and cleanup old pages
2026-01-25 12:33:46 +01:00
senke
1a5c81282c
refactor(frontend): improve ui using design system
...
- Refactor Navbar, ChatInput, RegisterPage, and CreatePlaylistDialog to use @veza/design-system components
- Shim local UI components (Button, Input, Card) to align with Design System API and styles
- Fix hundreds of type errors by exporting missing components (SearchInput, FileUpload) and adding missing props (icon, variant)
2026-01-18 22:27:53 +01:00
senke
1ef4cdb35a
implicit-tasks: update unit tests after type changes - fix Track mocks to use string IDs and creator_id
2026-01-16 15:12:37 +01:00
senke
6974c12a25
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
3fb12b2ce2
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
936b2c36fe
aesthetic-improvements: replace secondary cyan hover states with steel (batch 5)
...
- PlayerControls: visualizer toggle hover text (1 instance)
- Header: theme toggle hover text (1 instance)
- PlaylistCard: checkbox hover border (1 instance)
- GearView: equipment card hover border (1 instance)
- ProfileView: track title hover text (1 instance)
- ProjectsManager: project title hover text (1 instance)
- CourseCard: course title hover text (1 instance)
- TwoFactorSetup: 2FA option hover states (2 instances: bg and text)
- Total: ~8 files, ~9 instances replaced
- Preserved: Active/selected states (cyan), primary actions (cyan)
- Action 11.3.1.2 in progress (fifth batch complete)
2026-01-16 10:59:09 +01:00
senke
85911dce7f
aesthetic-improvements: remove excessive hover effects from high-priority files
...
- Removed scale transforms (hover:scale-[1.02], hover:scale-110, group-hover:scale-110/105) from cards and images
- Removed decorative shadow/glow effects (hover:shadow-neon-cyan/20, hover:shadow-lg) from cards
- Removed hover-lift class (translateY + shadow) from base Card and Button components
- Replaced excessive effects with subtle hover:bg-white/5 or hover:opacity-90
- Preserved functional hover states (group-hover:opacity-100 for play overlays, hover:bg-accent/50 for interactive feedback)
- Updated 14 files: ProductCard, TrackCard, CourseCard, EquipmentCard, PostCard, ProfileView, card.tsx, SearchPage, PlayerControls, OrderSummary, DiscoverView, PlaylistCard, Sidebar, button.tsx
- Effects are now subtle and purposeful, aligning with Surgical Minimalism
- Action 11.4.1.3 complete
2026-01-16 10:34:41 +01:00
senke
de79895e5d
consistency: fix remaining Tailwind default colors in auth and features components
2026-01-16 01:59:31 +01:00
senke
955898cc37
consistency: auto-migrate Tailwind default colors (Batch 12, 62 instances)
2026-01-16 01:57:01 +01:00
senke
5ea2191f9c
consistency: auto-migrate Tailwind default colors (Batch 11, 100 instances)
2026-01-16 01:56:57 +01:00
senke
332b685f68
ui: use Spinner component in loading states (Action 8.3.1.5 partial)
...
- Replaced Loader2 with Spinner in high-leverage locations:
- LibraryPage (addToPlaylist)
- CommentSection (create comment)
- CommentThread (reply, edit)
- PlaylistForm (submit)
- AddCollaboratorModal
- CollaboratorList (remove)
- PlaylistFollowButton
- PlaylistActions (edit, delete)
- PlaylistBatchActions (share, delete)
- SharePlaylistModal
- AddTrackToPlaylistModal
- ShareLinkManager (create)
- Spinner provides consistent Kodo design system styling
- Remaining Loader2 usages can be migrated incrementally
- Part of Action 8.3.1.5: Use Spinner in loading states
2026-01-16 00:48:39 +01:00
senke
80a2f4dbf2
ui: add loading states to revoke share link and reorder tracks (Action 8.3.1.3 partial)
...
- Added isLoading prop to ConfirmationDialog for revoke share link
- Disabled drag-and-drop context when reorder mutation is pending
- Uses mutation.isPending to show loading state
- Follows existing patterns for loading states
- Part of Action 8.3.1.3: Add loading states to all mutation buttons
2026-01-16 00:44:30 +01:00
senke
8d5db4cd34
typography: standardize h2-h6 heading elements
...
- Standardized h2 elements: 19 instances from text-3xl/text-xl to text-2xl
- Standardized h3 elements: 4 instances from text-2xl to text-xl
- Established consistent hierarchy: h1(text-3xl), h2(text-2xl), h3(text-xl)
- Preserved special cases: demo pages, responsive patterns, stat value displays
- Created standardization plan document
- Task 7.1.2.3 complete
2026-01-15 23:54:05 +01:00