feat: WGU theme

[xitij2000]

Implements the theme for the WGU Instance.

private-ref: https://tasks.opencraft.com/browse/BB-10703

[Kelketek]

@xitij2000 Gave this a brief code lookover. I see this is a PR against master, which I'm guessing you don't plan to actually merge into.

Can you create a branch that is up to date with master (after merging your dev enhancements) and then reconfigure/reopen this PR against that?

[xitij2000]

@Kelketek I've fixed the issues you highlighted and created a release branch for this instead of master.

[Kelketek]

@xitij2000 Zoux/WGU are pretty eager to see the results on this one so they can try it out. They agreed it would be fine to deploy today and risk inaccessibility/needing to spend an hour rolling back without access.

I attempted to roll it out, but it didn't work. Could you take a look there? It might be something in the configuration of the instance right now.

I have a feeling they're eager enough that they'll be fine with you testing on the instance so long as you give them warning and are ready to roll back in case something breaks that affects authoring.

[xitij2000]

@xitij2000 Zoux/WGU are pretty eager to see the results on this one so they can try it out. They agreed it would be fine to deploy today and risk inaccessibility/needing to spend an hour rolling back without access.

I attempted to roll it out, but it didn't work. Could you take a look there? It might be something in the configuration of the instance right now.

I have a feeling they're eager enough that they'll be fine with you testing on the instance so long as you give them warning and are ready to roll back in case something breaks that affects authoring.

I've redeployed, the issue was that the theme branch in grove.yml should stay release/teak but the one in config.yml should be set to this one.

[Kelketek]

@xitij2000

I've redeployed, the issue was that the theme branch in grove.yml should stay release/teak but the one in config.yml should be set to this one.

That's very confusing-- why is that?

[xitij2000]

@xitij2000

I've redeployed, the issue was that the theme branch in grove.yml should stay release/teak but the one in config.yml should be set to this one.

That's very confusing-- why is that?

Grove is deploying the theme for edx-platform which has a very different format. For a while both the platform and MFEs were using a somewhat compatible theme so we could use a single repo for both. However with tokens that is no longer the case. We can potentially host the code in the same place but the edx-platform side of the UI is mostly going away so we use the older release of edx-simple-theme for edx-platform and the latest release for MFEs.

[github-actions]

PR preview deployed: https://open-craft.github.io/edx-simple-theme/pr/53/

[samuelallan72]

We also need to consider how to handle the main body text size - I'm not sure what the final outcome will be though - the designs have a mix of font sizes.

[samuelallan72]

@xitij2000 do you have a plan for overriding the font family? Or should we hardcode overrides either in the exemplar blocks or in the theme css here? cc @Kelketek

[samuelallan72]

As in, with this, the font family is still "Inter" for me

and

Looks like the lms forced styles are overriding the theme rules...

[samuelallan72]

This is similar to previous issues we had with injected styling in the studio editor, so I also commented on FAL-4347 (comment)

[xitij2000]

This todo is just for upstreaming to paragon, it's already applied to display classes through overrides here:

https://github.com/open-craft/edx-simple-theme/pull/53/changes#diff-266181d9542bd6fbcacd17a0d2564e93455f7e46b892a8ac84fd40e3184d28c5R62-R68

I think you should never hardcode any values, especially since there is a much better alternative which is to use a new token. i.e. var(--myblock-display-font) or similar which can default to a paragon variable but still allow overriding with a correct value later.

[samuelallan72]

@xitij2000 do you know why the token variables aren't loading in the preview of blocks in studio? The css variables are displaying as unset for the blocks, but I see the core and light css theme files being successfully requested. It works fine in the LMS.

[xitij2000]

@samuelallan72 I think @tecoholic posted this elsewhere (and I posted on the ticket) but it's because currently the blocks are loading the styles from a relative path which doesn't resolve in studio. I'm looking for a solution for this that won't involve bigger changes.

[Kelketek]

@xitij2000 Would you be up for cherry-picking 8b32497? I don't want to step on you since you're actively working.

[xitij2000]

@xitij2000 Would you be up for cherry-picking 8b32497? I don't want to step on you since you're actively working.

Done.

[xitij2000]

@farhaanbukhsh @Kelketek I think we should merge this now and i can continue making adjustments in other PRs. It's become pretty load-bearning at this point.