This commit is contained in:
Tom Moor
2020-05-20 23:48:37 -07:00
parent 3487eb7857
commit 4ef82d5476
2 changed files with 14 additions and 4 deletions

View File

@ -26,7 +26,11 @@ const DropdownMenuItem = ({
{...rest} {...rest}
> >
{selected !== undefined && ( {selected !== undefined && (
<CheckmarkIcon color={selected === false ? 'transparent' : undefined} /> <React.Fragment>
<CheckmarkIcon
color={selected === false ? 'transparent' : undefined}
/>&nbsp;
</React.Fragment>
)} )}
{children} {children}
</MenuItem> </MenuItem>

View File

@ -9,7 +9,10 @@ import type { Toast } from '../types';
const UI_STORE = 'UI_STORE'; const UI_STORE = 'UI_STORE';
class UiStore { class UiStore {
// theme represents the users UI preference (defaults to system)
@observable theme: 'light' | 'dark' | 'system'; @observable theme: 'light' | 'dark' | 'system';
// systemTheme represents the system UI theme (Settings -> General in macOS)
@observable systemTheme: 'light' | 'dark'; @observable systemTheme: 'light' | 'dark';
@observable activeModalName: ?string; @observable activeModalName: ?string;
@observable activeModalProps: ?Object; @observable activeModalProps: ?Object;
@ -30,15 +33,18 @@ class UiStore {
// no-op Safari private mode // no-op Safari private mode
} }
let colorSchemeQueryList = window.matchMedia( // system theme listeners
const colorSchemeQueryList = window.matchMedia(
'(prefers-color-scheme: dark)' '(prefers-color-scheme: dark)'
); );
const setSystemTheme = event => { const setSystemTheme = event => {
this.systemTheme = event.matches ? 'dark' : 'light'; this.systemTheme = event.matches ? 'dark' : 'light';
}; };
setSystemTheme(colorSchemeQueryList); setSystemTheme(colorSchemeQueryList);
if (colorSchemeQueryList.addListener) {
colorSchemeQueryList.addListener(setSystemTheme); colorSchemeQueryList.addListener(setSystemTheme);
}
// persisted keys // persisted keys
this.tocVisible = data.tocVisible; this.tocVisible = data.tocVisible;