fix: resolve dark mode contrast issues on legal pages#7789
Conversation
Signed-off-by: ankitrewar11 <ankitrewar11@gmail.com>
|
Hey @Rajesh-Nagarajan-11, @banana-three-join, @KatalKavya96, @rishiraj38 👋 |
|
Preview deployment for PR #7789 removed. This PR preview was automatically pruned because we keep only the 6 most recently updated previews on GitHub Pages to stay within deployment size limits. If needed, push a new commit to this PR to generate a fresh preview. |
KatalKavya96
left a comment
There was a problem hiding this comment.
@AnkitRewar11 I can see the issue on the Code of Conduct and Terms of Service pages, and both the issue description and reproduction steps also point to these two pages only.
Could you please clarify why changes were made to additional pages as well? The expected fix seems to be limited to Code of Conduct and Terms of Service.
|
@KatalKavya96 These pages were affected because they all share the same Also, Privacy Policy, Cookie Notice, and Sub-Processors use the same dark mode setup ( Limiting the change to only Code of Conduct and Terms of Service would have left the same issue on the other legal pages. |
KatalKavya96
left a comment
There was a problem hiding this comment.
@AnkitRewar11 Ok, fair enough. Thanks for clarifying.
I rechecked the preview as well, and the fix looks good overall. Since the PR covers both the shared terms.style.js contrast issue and the theme rendering issue on Privacy Policy, Cookie Notice, and Sub-Processors, could you please update the PR description to mention this clearly?
Rest all looks good to me.
|
@AnkitRewar11 Thank you for your contribution! Let's discuss this during the website call tomorrow at 5:30 PM IST | 7 AM CST Add it as an agenda item to the meeting minutes, if you would 🙂 |
Description
This PR fixes #7677
In dark mode, text on Code of Conduct and Terms of Service pages was invisible (dark text on dark background). On Privacy page, the data processing table was rendering in light mode regardless of user's theme preference. Issue resolved only after manually switching theme.
Root Cause
terms.style.jshad no color properties defined, so text became invisible in dark modeprivacy/index.js—SistentThemeProviderwas rendering with wrong initial theme beforeThemeManagerresolved correct theme from localStoragesub-processors/index.js—SistentThemeProviderwas not re-mounting on theme changeChanges Made
terms.style.js: addedprops.theme.whiteToBlackcolor for all text elements to ensure proper contrast in dark and light modeprivacy/index.js: addeddidLoadflag to deferSistentThemeProviderrender until theme is fully resolved, preventing incorrect light mode flash on tablesub-processors/index.js: addedkey={isDark ? "dark" : "light"}anddidLoadflag toSistentThemeProviderto force re-mount on theme changecookie-notice/index.js: addeddidLoadflag andkeyprop toSistentThemeProvider(same table setup as privacy page)Notes for Reviewers
No new dependencies added. Changes are scoped only to legal pages.
Signed commits
Screen.Recording.2026-06-12.003525.mp4