fix: resolve mobile UI issues — theme, layout, light mode contrast#251
Merged
fix: resolve mobile UI issues — theme, layout, light mode contrast#251
Conversation
#217, #218, #223) - Invert system theme detection so null/undefined defaults to light instead of dark, and align default context value to light (#217) - Add BOTTOM_NAV_CLEARANCE constant and apply 120px bottom padding on the Account screen so legal links clear the absolutely-positioned bottom nav (#223) - Replace hardcoded dark hex/rgba colors with theme tokens across auth screen, loading state, history section header, activity notices, and status badge pills for proper light mode contrast (#218) - Comment out NyxFAB and NyxSheet (chat not ready); make BottomNavV2 layout conditional on onFabPress prop Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Add border (c.borderSoft) to history section header pill for visibility in light mode, use c.textSecondary for stronger text contrast - Replace withSpring with withTiming on detail sheet open and snap-back animations for a clean slide with no bounce Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
tabWidth was a useRef that didn't trigger re-renders when onLayout recalculated it after remount. Converted to useState so the highlight width updates correctly. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…for legal screens - Use c.cardSoft (opaque) instead of c.ghostBg (4% opacity) for history section header background - Map TermsOfService/PrivacyPolicy routes to account tab so the highlight stays on Account when navigating to legal screens Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
onLayout sets tabWidth via setState (async), but computeOffset read the stale value in the same cycle. Now computes offset directly from the new width in onLayout, and added tabWidth to useEffect deps so the spring re-runs after state updates. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
… light mode BlurView's tint rendered a dark overlay on top of c.cardSoft, making the pill unreadable in light mode. Replaced with plain View. Also bumps build number to 34. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Dark mode uses BlurView with tint="dark" for the frosted effect. Light mode uses a plain View since BlurView's tint overrides the opaque background. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
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
Theme & Light Mode (#217, #218, #223)
Use system settingis enabled while system appearance is Light #217 — System theme detection defaults to light whenuseColorScheme()returnsnullNavigation & Animation
c.cardSoftbg with border; BlurView kept for dark mode onlywithTiming, no bouncetabWidthref→state; legal routes map to account tabLogin Page Redesign
social_auth_registration_closed)Build
Closes #217, closes #218, closes #223
Test plan
🤖 Generated with Claude Code