Add a dark theme for syntax highlighting.

Review Request #13775 — Created April 23, 2024 and submitted

Information

Review Board
release-7.x

Reviewers

This updates our syntax highlighting to render well in dark mode, when
placed on a dark background.

The dark theme mirrors the light theme generally, but leans more on
purples, reds, cyans, and oranges as the main colors. This looks good on
a dark background, and on the insert/delete/replace lines (which are
defined in this change but not yet used in the diff viewer).

Some old CSS selectors have been removed in the process (from a time
when we rendered some syntax highlighting client-side), and others have
been added (to try to better align Pygments and CodeMirror styling).

There was a greater plan to make diff themes more pluggable. This work
exists in a branch, but is no longer in scope for Review Board 7.
However, some of the naming in this change prepares for that eventual
support.

As of this change, code is almost impossible to read in the diff viewer
on dark mode, due to the bright colors in the diff viewer. The next
change will add the necessary styling to correct this.

Tested in CodeMirror on light and dark modes, with a variety of code
samples that tested every syntax-highlighted token supported in both
Pygments and CodeMirror.

Tested in the diff viewer as well. Right now, it's unusable, but I've
also tested with the in-progress diff viewer changes.

Summary ID
Add a dark theme for syntax highlighting.
This updates our syntax highlighting to render well in dark mode, when placed on a dark background. The dark theme mirrors the light theme generally, but leans more on purples, reds, cyans, and oranges as the main colors. This looks good on a dark background, and on the insert/delete/replace lines (which are defined in this change but not yet used in the diff viewer). Some old CSS selectors have been removed in the process (from a time when we rendered some syntax highlighting client-side), and others have been added (to try to better align Pygments and CodeMirror styling). There was a greater plan to make diff themes more pluggable. This work exists in a branch, but is no longer in scope for Review Board 7. However, some of the naming in this change prepares for that eventual support. As of this change, code is almost impossible to read in the diff viewer on dark mode, due to the bright colors in the diff viewer. The next change will add the necessary styling to correct this.
2de4804b7b023154bca65081ae2e2b7d0baf5399

david
  1. Ship It!
  2. 
      
maubin
  1. Ship It!
  2. 
      
chipx86
Review request changed

Status: Closed (submitted)

Change Summary:

Pushed to release-7.x (1b3af88)
Loading...