fix: respect potato mode in emoji picker - #168
Conversation
|
Warning Rate limit exceeded
⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. Comment |
Add potato mode support to disable backdrop blur effects in the emoji picker, including the emoji-mart library's internal blur on the search input. Uses a CSS class to override all backdrop-filter effects when potato mode is enabled.
a955d6e to
9a05cb9
Compare
Deploying yappr with
|
| Latest commit: |
9a05cb9
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://a6a3dc45.yappr.pages.dev |
| Branch Preview URL: | https://claude-fix-emoji-picker-pota.yappr.pages.dev |
|
🕓 Ready for review — 63 ahead in queue (commit 9a05cb9) |
thepastaclaw
left a comment
There was a problem hiding this comment.
Preliminary review — Codex only
The potato-mode state is applied to the picker wrapper, but the new CSS cannot reach emoji-mart's blur-bearing elements inside its shadow root. Because the PR's intended behavior remains ineffective, this requires changes.
Validated blockers were found in the Codex precheck. Sonnet is deferred until a fresh Codex revalidation clears the blocker gate.
Review provenance
- Codex reviewers:
gpt-5.6-sol— general (failed),gpt-5.6-sol— general (failed),gpt-5.6-sol— general (completed) - Verifier:
gpt-5.6-sol— verifier - Sonnet: not run (deferred by blocker gate)
🔴 1 blocking
🤖 Prompt for all review comments with AI agents
These findings are from an automated code review. Verify each finding against the current code and only fix it if needed.
In `app/globals.css`:
- [BLOCKING] app/globals.css:56-61: Potato-mode selector cannot reach emoji-mart's blur effects
The lockfile resolves emoji-mart 5.6.0, whose `em-emoji-picker` custom element creates a shadow root and injects the `.sticky` and `.menu` rules containing `backdrop-filter: blur(4px)` inside it. Document-level descendant selectors cannot cross that shadow boundary, and `backdrop-filter` is not inherited, so these declarations only affect the wrapper and custom-element host. Potato mode therefore leaves the picker's internal blur effects enabled; the override must be installed inside the open shadow root or applied through a supported emoji-mart styling mechanism.
| .potato-mode, | ||
| .potato-mode *, | ||
| .potato-mode *::before, | ||
| .potato-mode *::after { | ||
| backdrop-filter: none !important; | ||
| -webkit-backdrop-filter: none !important; |
There was a problem hiding this comment.
🔴 Blocking: Potato-mode selector cannot reach emoji-mart's blur effects
The lockfile resolves emoji-mart 5.6.0, whose em-emoji-picker custom element creates a shadow root and injects the .sticky and .menu rules containing backdrop-filter: blur(4px) inside it. Document-level descendant selectors cannot cross that shadow boundary, and backdrop-filter is not inherited, so these declarations only affect the wrapper and custom-element host. Potato mode therefore leaves the picker's internal blur effects enabled; the override must be installed inside the open shadow root or applied through a supported emoji-mart styling mechanism.
source: ['codex']
Add potato mode support to the emoji picker component to disable backdrop blur effects when potato mode is enabled for better performance on older devices.