mirrors/it-tools
1
0
Fork 0
mirror of https://github.com/CorentinTh/it-tools.git synced 2025-04-24 16:56:14 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

fix(sider): default collapsed value

Browse source
This commit is contained in:
Corentin Thomasset 2022-04-23 00:43:42 +02:00
parent b12cbe4124
commit b22aa941f5
No known key found for this signature in database
GPG key ID: DBD997E935996158
1 changed files with 4 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/stores/style.store.ts
View file

@ -1,22 +1,14 @@
import { useMediaQuery, useStorage, whenever } from '@vueuse/core'; import { useMediaQuery, useStorage } from '@vueuse/core';
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import type { Ref } from 'vue'; import { watch, type Ref } from 'vue';
export const useStyleStore = defineStore('style', { export const useStyleStore = defineStore('style', {
state: () => { state: () => {
const isDarkTheme = useStorage('isDarkTheme', true) as Ref<boolean>; const isDarkTheme = useStorage('isDarkTheme', true) as Ref<boolean>;
const isSmallScreen = useMediaQuery('(max-width: 700px)'); const isSmallScreen = useMediaQuery('(max-width: 700px)');
const isMenuCollapsed = useStorage('isMenuCollapsed', !isSmallScreen.value) as Ref<boolean>; const isMenuCollapsed = useStorage('isMenuCollapsed', isSmallScreen.value) as Ref<boolean>;
whenever( watch(isSmallScreen, (v) => (isMenuCollapsed.value = v));
() => !isSmallScreen.value,
() => (isMenuCollapsed.value = false),
);
whenever(
() => isSmallScreen.value,
() => (isMenuCollapsed.value = true),
);
return { return {
isDarkTheme, isDarkTheme,