mirror of
https://github.com/mastodon/mastodon.git
synced 2026-08-20 06:44:27 -05:00
Enable theming via new HTML element attributes (#37477)
This commit is contained in:
@@ -1,16 +1,17 @@
|
||||
(function (element) {
|
||||
const {userTheme} = element.dataset;
|
||||
const {colorScheme, contrast} = element.dataset;
|
||||
|
||||
const colorSchemeMediaWatcher = window.matchMedia('(prefers-color-scheme: dark)');
|
||||
const contrastMediaWatcher = window.matchMedia('(prefers-contrast: more)');
|
||||
|
||||
const updateColorScheme = () => {
|
||||
const useDarkMode = userTheme === 'system' ? colorSchemeMediaWatcher.matches : userTheme !== 'mastodon-light';
|
||||
element.dataset.mode = useDarkMode ? 'dark' : 'light';
|
||||
const useDarkMode = colorScheme === 'auto' ? colorSchemeMediaWatcher.matches : colorScheme === 'dark';
|
||||
|
||||
element.dataset.colorScheme = useDarkMode ? 'dark' : 'light';
|
||||
};
|
||||
|
||||
const updateContrast = () => {
|
||||
const useHighContrast = userTheme === 'contrast' || contrastMediaWatcher.matches;
|
||||
const useHighContrast = contrast === 'high' || contrastMediaWatcher.matches;
|
||||
|
||||
element.dataset.contrast = useHighContrast ? 'high' : 'default';
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user