Repository navigation
3.0
Major UX Overhaul
Complete visual redesign with modern glassmorphism aesthetic, restructured UI architecture, and significant improvements to the recommendation engine.
UI/UX
- Dynamic Island Header — Floating pill-shaped header with settings that expand inline via smooth slide animation
- Glassmorphism Design — Backdrop blur, semi-transparent surfaces, and layered depth throughout
- Now Playing Card — Redesigned music display with large album artwork, scrolling track/artist names (marquee effect), and inline metadata (genres, BPM)
- History Cards — Compact cards with album art thumbnails, source page links, and expandable "More Info" sections containing Spotify embeds
- Theme System — Light and Dark themes with CSS custom properties for consistent token-based styling
- Dual-Range Popularity Slider — Set both minimum and maximum popularity bounds instead of just a threshold
- Hidden Scrollbar — Cleaner look with optional toggle to show scrollbar
- Custom Checkboxes — Rounded toggle switches with smooth animations
Performance
- Singleton Summarizer — AI model instantiated once per session and reused across all requests, eliminating repeated initialization overhead
- Lazy-Loaded Embeds — Spotify iframes only load when "More Info" is expanded
- GPU-Accelerated Animations — All transitions use
transformandopacityfor 60fps performance
Recommendation Engine
- Expanded Genre Mapping — Comprehensive mapping table covering 50+ genre synonyms and mood-to-genre conversions
- Multi-Strategy Search — Four-tier fallback: genre-filtered → multi-genre text → playlist mining → simple search
- Artist Diversity — Track selection pools are diversified by artist before random selection
- Improved Scoring — Tracks scored by genre relevance (85%), popularity (7.5%), and tempo match (7.5% bonus)
- Range-Based Filtering — Popularity bounds expand iteratively (±10) if no matches found
Technical
- Process Cards Module — Extracted to
processCards.jswith minimal status indicators and auto-dismiss on completion - Content Extraction Script — Moved Readability injection to dedicated
extract-content.js - CSS Architecture — Complete rewrite using CSS custom properties (
--color-*,--radius-*,--spacing-*) - Settings in Header — Removed footer; settings now expand from Dynamic Island
Bug Fixes
- Fixed scrollbar rendering white in dark mode
- Fixed settings panel clipping content at bottom of viewport
- Fixed checkbox visual state not updating on toggle
- Fixed source link text illegible in light mode
- Fixed album art hover state showing redundant play button overlay