Repository navigation
feat: per-user dynamic theme - #248
Draft
HammadYousaf01 wants to merge 1 commit into
Draft
HammadYousaf01 wants to merge 1 commit into
HammadYousaf01 wants to merge 1 commit into
Conversation
Learners can pick a Light or Dark preset and personalise five core Paragon colours from a new "Theme" block in the Profile Information section of the Account MFE. The choice follows them across devices and is applied without rebuilding any image. The new indigo_theme Django app stores the presets and each learner's preset and colour overrides, and serves them from /api/indigo/v1/theme/. It is installed into the openedx image and registers itself as a plugin app, so no edx-platform settings patch is needed. Overrides are kept per preset, so a colour chosen for Light does not affect Dark. In the MFEs, IndigoTheme.jsx fetches the theme once per page load, derives the Paragon shade scales that the compiled brand CSS bakes in as literal hex, and writes everything into a single style element as :root custom properties. A username-stamped localStorage cache is applied before the app boots so there is no flash, and is dropped as soon as the JWT cookie is missing or names another user. Legacy LMS pages and the courseware iframe are covered by dynamic-theme.js, a sibling of dark-theme.js in the LMS theme bundles. Their stylesheets are compiled from SASS with literal colours, so the script rewrites the matching declarations in place rather than appending an override sheet, which would change the cascade. The appearance choice is saved as soon as it is picked; colours are previewed live and stored with the "Save" button. The header light/dark toggle is hidden while the feature is on, since the preset choice replaces it. Controlled by INDIGO_ENABLE_DYNAMIC_THEME (default: true). Turning it off needs no image rebuild: the flag is read at runtime, the block and the requests disappear, the cached styles are cleared and the header toggle comes back. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
HammadYousaf01
marked this pull request as draft
September 21, 2026 05:19
HammadYousaf01
requested review from
Abdul-Muqadim-Arbisoft,
Faraz32123,
ahmed-arb,
arbirali and
muhammadadeeltajamul
September 21, 2026 05:19
Abdul-Muqadim-Arbisoft
moved this from Pending Triage
to In review
in Tutor project management
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
3 participants
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.
This PR adds dynamic theming for Indigo, which allows a user to customize their own theme.
Users can now choose between Light and Dark presets and customise five core colors from their Profile settings. Their preferences are saved per user, per preset, and follow them across devices.
What changed
indigo_themeDjango app and/api/indigo/v1/theme/API.INDIGO_ENABLE_DYNAMIC_THEMEruntime flag, enabled by default.