tethys.backend/resources/js/Layouts/LayoutAuthenticated.vue
2023-03-17 16:13:37 +01:00

38 lines
1.1 KiB
Vue

<script lang="ts" setup>
import { LayoutService } from '@/Stores/layout';
import { StyleService } from '@/Stores/style';
import NavBar from '@/Components/NavBar.vue';
import AsideMenu from '@/Components/AsideMenu.vue';
import FooterBar from '@/Components/FooterBar.vue';
const styleService = StyleService();
const layoutService = LayoutService();
// defineProps({
// user: {
// type: Object,
// default: () => ({}),
// }
// });
</script>
<template>
<div
:class="{
'dark': styleService.darkMode,
'overflow-hidden lg:overflow-visible': layoutService.isAsideMobileExpanded,
}"
>
<div
:class="{ 'ml-60 lg:ml-0': layoutService.isAsideMobileExpanded }"
class="pt-14 xl:pl-60 min-h-screen w-screen transition-position lg:w-auto bg-gray-50 dark:bg-slate-800 dark:text-slate-100"
>
<NavBar :class="{ 'ml-60 lg:ml-0': layoutService.isAsideMobileExpanded }" />
<AsideMenu />
<slot></slot>
<FooterBar />
</div>
</div>
</template>