Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: update MFE to use dynamically injected theme #27

Merged
merged 2 commits into from
Aug 6, 2024

Conversation

ArturGaspar
Copy link
Member

@ArturGaspar ArturGaspar commented Jul 24, 2024

Description

Updates the MFE to use alpha version of frontend build, platform and paragon to support runtime theming.

Supporting information

https://openedx.atlassian.net/wiki/spaces/BPL/pages/3770744958/Migrating+MFEs+to+Paragon+design+tokens+and+CSS+variables

Testing instructions

  1. Clone https://github.com/open-craft/edx-simple-theme and check out branch artur/design-tokens-update.
  2. Build it (npm ci && npm run build).
  3. Run a local server from the dist directory (e.g. python3 -m http.server 9100, use same port for brandOverride in MFE_CONFIG below).
  4. Set MFE_CONFIG as in example Tutor plugin below.
  5. Go to a course in the learning MFE
  6. See that theming works.
  7. Check that http://localhost:9100/light.min.css was loaded.
Example Tutor plugin to set MFE_CONFIG
name: mfe_config
version: 0.1.0
patches:
  mfe-lms-common-settings: |
    MFE_CONFIG.update({
        "PARAGON_THEME_URLS": {
            "core": {
                "urls": {
                    "default": "https://cdn.jsdelivr.net/npm/@openedx/paragon@23.0.0-alpha.1/dist/core.min.css",
                    "brandOverride": "https://cdn.jsdelivr.net/npm/@edx/brand-edx.org@2.2.0-alpha.17/dist/core.min.css"
                }
            },
            "variants": {
                "light": {
                    "urls": {
                        "default": "https://cdn.jsdelivr.net/npm/@openedx/paragon@23.0.0-alpha.1/dist/light.min.css",
                        "brandOverride": "http://localhost:9100/light.min.css"
                    },
                    "default": True,
                    "dark": False
                }
            }
        }
    })

Deadline

ASAP

Other information

Internal-ref: https://tasks.opencraft.com/browse/BB-9023

@ArturGaspar ArturGaspar force-pushed the artur/asu-moe/redwood-css branch 3 times, most recently from 691089c to e9fae6f Compare July 29, 2024 15:54
Copy link
Member

@0x29a 0x29a left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

Updates the MFE to use alpha version of frontend build, platform and paragon to
support runtime theming.
@ArturGaspar ArturGaspar marked this pull request as ready for review August 6, 2024 00:07
@ArturGaspar ArturGaspar merged commit 75eddd9 into asu-moe/redwood-css Aug 6, 2024
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants