fix(ui): apply backdrop blur to modal scrims for better separation#123
Merged
Conversation
Aligns all 10 modal backdrops on the OnboardingModal pattern (`bg-black/80 backdrop-blur-md`) so the wizard / form panel stops visually blending with the underlying app content. Lightbox keeps its `bg-black/90` (no blur) since image viewing wants a clean dark canvas. Closes #108
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: ASSERTIVE Plan: Pro Plus Run ID: 📒 Files selected for processing (10)
📝 WalkthroughWalkthroughLa PR ajoute l'effet visuel ChangesEffet de flou d'arrière-plan sur les modales
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~3 minutes Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Comment |
InstaZDLL
added
scope: frontend
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
InstaZDLL
added a commit
that referenced
this pull request
May 23, 2026
Brings the themes branch up to date with the v1.2.0 → v1.3.0 main work and applies the CodeRabbit findings on the original diff. Major points of conflict resolution + new work in this merge: * All ten modal backdrops now read `bg-black/80 backdrop-blur-md` (from PR #123) — the AnimatedModalShell default carries the blur, the four bespoke motion.div modals carry it in their own className. * SettingsView keeps the Lokal-style category tablist from main (#83) and moves the theme picker into the now-active Appearance tab. `PlayerBarLayoutCard` also lives in Appearance now — it was parked under Playback while the tab was still a placeholder (deferred from #122 with the explicit "move when themes land" note). * MoreActionsMenu / TrackPropertiesModal / BatchTagEditModal / ProfileSelectorModal / OnboardingModal kept their main-side imports and structure (delete view, profile-name step, 1080p cap, scroll-wheel volume, etc.) while taking the themes branch's framer-motion wrappers and the per-modal CodeRabbit cleanup. CodeRabbit findings addressed in this merge: * `index.html` ships an inline theme-bootstrap script that paints the right `dark` class + `data-theme` + ambient bg before React mounts, so a fresh boot with the dark default no longer flashes white (FOUC). * `app.css` focus-visible outline reads `var(--accent-500)` instead of the hardcoded `#10b981`, so the focus ring follows the active preset (Midnight, Sunset, Crimson… were stuck on green). * `ThemeContext.readStoredTheme` migrates the legacy `waveflow.theme.is_dark` boolean to the new id key on first read and removes the legacy entry, so a downgrade-then-upgrade cycle can't silently overwrite a custom preset with the stale boolean. * `ThemeContext.setThemeId` wraps `document.startViewTransition` in try/catch — some WebKitGTK builds throw synchronously, which previously left `writeStoredTheme` persisted but `setTheme(next)` never called. * `ContextMenu` and `ContextMenuSub` flip math reads `offsetWidth`/`offsetHeight` instead of `getBoundingClientRect()` so the menu mounted at `scale: 0.96` doesn't underestimate its size and misfire the flip near the viewport edges. * `ProfileSelectorModal` aria-label is now computed from `view` (`select` / `create` / `delete`) so the screen reader announces the actual content, and the leftover `animate-fade-in` class on the create / delete cards was removed — the outer motion.div already owns the fade.
12 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
backdrop-blur-mdto the 10 modal backdrops that were rendering as a flatbg-black/80scrim, matching the existingOnboardingModalpattern.Lightboxis intentionally untouched: image viewing keeps the darkbg-black/90canvas with no blur.Closes #108
Test plan
Summary by CodeRabbit
Release Notes