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 #8

Merged
merged 5 commits into from
Jul 31, 2024

Conversation

ArturGaspar
Copy link
Member

@ArturGaspar ArturGaspar commented Jul 25, 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. If using tutor, enable the forum with tutor plugins enable forum.
  6. Go to a course and select the "Discussion" tab.
  7. See that theming works.
  8. 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

xitij2000 and others added 5 commits July 25, 2024 11:31
Updates the MFE to use alpha version of frontend build, platform and paragon to
support runtime theming.
Array.forEach() will return immediately instead of awaiting on the callbacks.
This was probably the intended selector, to test that SectionBase does not
render TopicStats where Topic does, but excluding where it is a descendant of
[data-testid="subsection-group"] (within which SectionBaseGroup does render a
TopicStats).
@ArturGaspar ArturGaspar force-pushed the artur/asu-moe/redwood-css branch from 088715d to 9a31bbc Compare July 29, 2024 11:12
@ArturGaspar ArturGaspar marked this pull request as ready for review July 29, 2024 11:15
@ArturGaspar ArturGaspar requested review from xitij2000 and 0x29a July 29, 2024 11:19
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.

👍

@ArturGaspar ArturGaspar merged commit 5a4f74b into asu-moe/redwood-css Jul 31, 2024
4 checks passed
@ArturGaspar ArturGaspar deleted the artur/asu-moe/redwood-css branch July 31, 2024 12:35
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