asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: fix color mode tabs (#2541)

Browse Source
This commit is contained in:
Shahed Nasser
2022-11-03 19:53:39 +02:00
committed by GitHub
parent 3a727c6f68
commit e4e65812a6
1 changed files with 5 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
www/docs/src/theme/ColorModeToggle/index.js
View File

@@ -9,14 +9,13 @@ const allowedModes = [
'auto'
]
function ColorModeToggle({className, value, onChange}) {
function ColorModeToggle({className, onChange}) {
const isBrowser = useIsBrowser();
const {colorMode} = useColorMode();
const [storageColorMode, setStorageColorMode] = useState(colorMode)
const [storageColorMode, setStorageColorMode] = useState('light')
useEffect(() => {
if (isBrowser) {
const previousSelected = window.localStorage.getItem('selected-color-mode')
const previousSelected = window.localStorage.getItem('selected-color-mode') || window.localStorage.getItem('theme')
if (previousSelected && allowedModes.includes(previousSelected)) {
setStorageColorMode(previousSelected)
}
@@ -63,7 +62,7 @@ function ColorModeToggle({className, value, onChange}) {
<button
className={clsx(
'pill-button',
(colorMode === 'light' && storageColorMode === 'light') && 'active'
(storageColorMode === 'light') && 'active'
)}
onClick={() => handleColorModeChange('light')}
disabled={!isBrowser}
@@ -74,7 +73,7 @@ function ColorModeToggle({className, value, onChange}) {
<button
className={clsx(
'pill-button',
(colorMode === 'dark' && storageColorMode === 'dark') && 'active'
(storageColorMode === 'dark') && 'active'
)}
onClick={() => handleColorModeChange('dark')}
disabled={!isBrowser}