3pp-mirror/docusaurus
1
0
Fork 0
mirror of https://github.com/facebook/docusaurus.git synced 2025-07-21 10:37:51 +02:00
Code Issues Projects Releases Packages Wiki Activity

fix(website): update colors correctly when palette is only customized in one color mode (#6448)

Browse source
This commit is contained in:
Joshua Chen 2022-01-23 14:29:32 +08:00 • committed by GitHub
parent ab1dada1aa
commit d0b4aaffed
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

19
website/src/theme/Toggle.tsx
View file

@ -13,6 +13,11 @@ import {
darkStorage,
type ColorState,
updateDOMColors,
LIGHT_PRIMARY_COLOR,
DARK_PRIMARY_COLOR,
LIGHT_BACKGROUND_COLOR,
DARK_BACKGROUND_COLOR,
COLOR_SHADES,
} from '@site/src/utils/colorUtils';
// The ColorGenerator modifies the DOM styles. The styles are persisted in
@ -27,12 +32,14 @@ export default function Toggle(props: Props): JSX.Element {
props.onChange(e);
const isDarkMode = e.target.checked;
const storage = isDarkMode ? darkStorage : lightStorage;
const colorState = JSON.parse(
storage.get() ?? 'null',
) as ColorState | null;
if (colorState) {
updateDOMColors(colorState);
}
const colorState: ColorState = JSON.parse(storage.get() ?? 'null') ?? {
baseColor: isDarkMode ? DARK_PRIMARY_COLOR : LIGHT_PRIMARY_COLOR,
background: isDarkMode
? DARK_BACKGROUND_COLOR
: LIGHT_BACKGROUND_COLOR,
shades: COLOR_SHADES,
};
updateDOMColors(colorState);
}}
/>
);