Skip to content

Add light mode to web lab 2 #67214

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

Open
wants to merge 5 commits into
base: staging
Choose a base branch
from
Open

Conversation

molly-moen
Copy link
Contributor

This adds light mode as an option to Web Lab 2. Very minimal work was needed here, as Web Lab 2 and Python Lab share most of their components. The changes needed were:

  • Where we were checking if the level was python lab to decide if we should use the user theme, now also check for web lab 2. I made a helper method on the backend and a constant on the frontend to make this easier to manage as we add more themeable labs.
  • Update the html preview component to be properly themed; it had a black bar at the top and a black border (which I think was a default for the iframe).
  • Add a light theme error message underline to the codemirror theme, so it looks the same in light and dark mode (I overrode dark mode in Add js files as an option in Web Lab 2, with js linting #67193 because it was very hard to see. The default is a background image for the underline in codemirror, rather than an underline style).

Screen shot

Screenshot 2025-07-18 at 12 56 49 PM

Links

Testing story

Tested locally.

PR Checklist:

  • Tests provide adequate coverage
  • Privacy and Security impacts have been assessed
  • Code is well-commented
  • New features are translatable or updates will not break translations
  • Relevant documentation has been added or updated
  • User impact is well-understood and desirable
  • Pull Request is labeled appropriately
  • Follow-up work items (including potential tech debt) are tracked and linked

@molly-moen molly-moen requested review from fisher-alice and a team July 18, 2025 20:01
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.

1 participant