From 04ed9999ca37deb063e9e4fcf031fb07bab61e5a Mon Sep 17 00:00:00 2001 From: tugcekucukoglu Date: Mon, 11 Mar 2024 17:20:41 +0300 Subject: [PATCH] Layout config updated --- index.html | 2 +- src/layout/AppConfig.vue | 607 ++++++++++++++++++------------- src/layout/AppLayout.vue | 3 +- src/layout/composables/layout.js | 11 +- 4 files changed, 363 insertions(+), 260 deletions(-) diff --git a/index.html b/index.html index 38b4931..a55b027 100644 --- a/index.html +++ b/index.html @@ -6,7 +6,7 @@ Sakai Vue - + diff --git a/src/layout/AppConfig.vue b/src/layout/AppConfig.vue index c05460b..4964d53 100644 --- a/src/layout/AppConfig.vue +++ b/src/layout/AppConfig.vue @@ -1,10 +1,6 @@ diff --git a/src/layout/AppLayout.vue b/src/layout/AppLayout.vue index 6dc0c9c..70aaed3 100644 --- a/src/layout/AppLayout.vue +++ b/src/layout/AppLayout.vue @@ -27,8 +27,7 @@ const containerClass = computed(() => { 'layout-static-inactive': layoutState.staticMenuDesktopInactive.value && layoutConfig.menuMode.value === 'static', 'layout-overlay-active': layoutState.overlayMenuActive.value, 'layout-mobile-active': layoutState.staticMenuMobileActive.value, - 'p-input-filled': layoutConfig.inputStyle.value === 'filled', - 'p-ripple-disabled': !layoutConfig.ripple.value + 'p-ripple-disabled': layoutConfig.ripple.value === false }; }); const bindOutsideClickListener = () => { diff --git a/src/layout/composables/layout.js b/src/layout/composables/layout.js index 141a381..2b678d2 100644 --- a/src/layout/composables/layout.js +++ b/src/layout/composables/layout.js @@ -1,11 +1,11 @@ import { toRefs, reactive, computed } from 'vue'; const layoutConfig = reactive({ - ripple: false, + ripple: true, darkTheme: false, inputStyle: 'outlined', menuMode: 'static', - theme: 'lara-light-indigo', + theme: 'aura-light-green', scale: 14, activeMenuItem: null }); @@ -20,11 +20,6 @@ const layoutState = reactive({ }); export function useLayout() { - const changeThemeSettings = (theme, darkTheme) => { - layoutConfig.darkTheme = darkTheme; - layoutConfig.theme = theme; - }; - const setScale = (scale) => { layoutConfig.scale = scale; }; @@ -49,5 +44,5 @@ export function useLayout() { const isDarkTheme = computed(() => layoutConfig.darkTheme); - return { layoutConfig: toRefs(layoutConfig), layoutState: toRefs(layoutState), changeThemeSettings, setScale, onMenuToggle, isSidebarActive, isDarkTheme, setActiveMenuItem }; + return { layoutConfig: toRefs(layoutConfig), layoutState: toRefs(layoutState), setScale, onMenuToggle, isSidebarActive, isDarkTheme, setActiveMenuItem }; }