Versions Compared


  • This line was added.
  • This line was removed.
  • Formatting was changed.


  • Update the example theme to demonstrate all the use cases

    • This example theme should work for pattern library pages as well as for legacy pages
    • The process of implementing some of these (e.g. changing the font family) will expose the issues
  • Make extensive use of variables in Sass, rather than hard-coding colors, fonts etc into every file

    • This means that the variable can be overridden once, rather than having to override every file. 

    • These variables would themselves be documented so that their purpose is clear for theme authors

  • Update the pattern library documentation to include an example theme
  • Address any issues with theming the pattern library
  • Convert major pre-existing pages to the pattern library

  • Use the pattern library for all new front end features

  • Determine an approach for overriding JavaScript templates

    • A long term solution is to use HTTP/2 and then stop bundling JavaScript files

    • Maybe there could be a way to build theme versions of each JavaScript bundle (or at least those that have overridden templates)
  • Make an OEP that describes how to create themable front end interfaces
  • The default theme should be the only theme within edx-platform.  EdX should dogfood theming by applying's themes through the same mechanisms as the rest of the community.
  • Extend the set of themed variables to include settings needed to support WCAG 2.1 AA requirements.
  • Implement a Dark Mode (not necessarily High Contrast) with any theme.
  • Prompt the learner to automatically switch to Dark Mode if they have the OS in Dark Mode (once detection from the browser becomes possible).
  • Implement a toggle for Dark Mode in the LMS learner settings.
  • Implement a standard edX High Contrast theme (possibly independent of the Dark Mode of the regular theme, though they could be the same).
  • Prompt the learner to automatically switch to High Contrast theme if they are in High Contrast mode (Windows or Chrome).
  • Implement UI for learner customization of text and color attributes for Headings, paragraphs (particularly as needed for WCAG 2.1 conformance), interactive elements, and charts/infographics.