Skip to content

Add alternate code highlighting themes + a switcher #1

@AmeliaBR

Description

@AmeliaBR

Solarized Dark fails WCAG AA color contrast.

Probably want four options:

  • Solarized Light
  • Solarized Dark
  • a high-contrast light
  • a high-contrast dark

Need to:

  • Add CSS files for alternate color schemes (need to remember where I found the Pygments-compatible CSS file)
  • Write a short JS utility to
    • inject a select drop-down with the stylesheet options (& maybe style each option so it gives a preview of the colors)
    • save the user's selection choice in local storage
    • check for local storage settings on page load
    • swap the URL on the relevant stylesheet <link> if a stored setting is detected on load, or if the selected option changes
  • Add the JS to every page that uses syntax-highlighted code (and regret, once again, that I didn't spend the time to create a proper build & template system)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions