Support dark mode. - #49
Open
drgrice1 wants to merge 1 commit into
Open
Conversation
There isn't much needed to support dark mode. The cursor needs to use the `currentcolor` instead of a forced black. That just works in both color modes. Empty blocks need a slightly darker background color to contrast better with white text. This uses the `light-dark` css function which is an approach that is generally agnostic to the approach the MathQuill library user uses for dark mode as long as that involves setting the `color-scheme` for the page or elements. That function is polyfilled via `postcss` and `@csstools/postcss-light-dark-function` for older browsers. Also add the `autoprefixer`. This is somewhat unrelated, but should be added in any case so that any browser specific prefixes that may be needed are automatically added. The `input-test.html` has a dark mode added. It only works via the browser setting. There is no color scheme chooser. Developers can use the developer tools to easily change modes. This is a development test page after all.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
There isn't much needed to support dark mode.
The cursor needs to use the
currentcolorinstead of a forced black. That just works in both color modes.Empty blocks need a slightly darker background color to contrast better with white text. This uses the
light-darkcss function which is an approach that is generally agnostic to the approach the MathQuill library user uses for dark mode as long as that involves setting thecolor-schemefor the page or elements. That function is polyfilled viapostcssand@csstools/postcss-light-dark-functionfor older browsers.Also add the
autoprefixer. This is somewhat unrelated, but should be added in any case so that any browser specific prefixes that may be needed are automatically added.The
input-test.htmlhas a dark mode added. It only works via the browser setting. There is no color scheme chooser. Developers can use the developer tools to easily change modes. This is a development test page after all.