self-hosted/it-tools
self-hosted/it-tools
1
0
Fork 0
mirror of https://github.com/CorentinTh/it-tools synced 2024-07-08 03:25:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

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
Show Stats 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 type { Ref } from 'vue';
import { watch, type Ref } from 'vue';
export const useStyleStore = defineStore('style', {
state: () => {
const isDarkTheme = useStorage('isDarkTheme', true) as Ref<boolean>;
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(
() => !isSmallScreen.value,
() => (isMenuCollapsed.value = false),
);
whenever(
() => isSmallScreen.value,
() => (isMenuCollapsed.value = true),
);
watch(isSmallScreen, (v) => (isMenuCollapsed.value = v));
return {
isDarkTheme,