fix: resolve theme toggle inconsistency across dashboard pages#1700
Conversation
|
@nur-hasin is attempting to deploy a commit to the Om Roy's projects Team on Vercel. A member of the Team first needs to authorize it. |
Thanks for creating a PR for your Issue!
|
|
Hi @omroy07, kindly review and merge if approved. Let me know if any changes are required. Thanks. |
|
🎉 Congrats @nur-hasin on getting your PR merged! 🙌 |
|
Hi @omroy07, kindly add the ECWoC26 SPRINT label to this PR. It is necessary for points to be added. |
|
Hi @omroy07, kind reminder - I'd requested the ECWoC26 SPRINT label earlier. Please add it so points can be counted. Thanks. |
Which issue does this PR close?
Rationale for this change
The theme toggle button was unresponsive or visually broken across multiple dashboard pages. Root causes identified:
.circle-container/.cursor-circle) intercepting pointer events and blocking clicks on#themeTogglebody.dark-modeclass vsdata-themeattribute)toggleTheme()functions in page-specific JS overridingtheme.js<line>elements inside the toggle button intercepting clicks before they reached the buttonWhat changes are included in this PR?
pointer-events: noneto.scroll-indicator,.circle-containerand.cursor-circleto prevent overlay elements from blocking button clickspointer-events: noneto theme toggle SVG so ray lines no longer intercept clickstoggleTheme()andinitializeTheme()functions fromapp_scheme.jsbody.dark-modeCSS rules with[data-theme="dark"]selectors instyles_scheme.cssto match the unifiedtheme.jssystem../theme.jsto pages that were missing it (Gov_schemes/index_scheme.html)style="position:fixed"from toggle button inmain.htmlnavbarAre these changes tested?
Manually tested on all pages in both light and dark mode:
localStorageAre there any user-facing changes?
Yes - the theme toggle button now correctly switches between light and dark mode on all dashboard pages with smooth sun/moon animation. No visual or layout changes were made.
Screenshots