39 lines
1.0 KiB
Vue
39 lines
1.0 KiB
Vue
<template>
|
|
|
|
<div id="app" class="flex flex-col h-screen bg-gray-100 gap-4">
|
|
<!-- MenuBar всегда фиксирован сверху -->
|
|
<MenuBar class="w-full sticky hidden lg:block top-0 z-10"/>
|
|
<ToolBar class=" fixed visible lg:invisible bottom-0 z-10"/>
|
|
|
|
<!-- Контентная часть заполняет оставшееся пространство -->
|
|
<div class="flex-grow ">
|
|
|
|
<router-view />
|
|
</div>
|
|
<OverlayView class="w-full sticky invisible lg:visible top-0 z-10"/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import MenuBar from "./components/MenuBar.vue";
|
|
import OverlayView from "@/components/OverlayView.vue";
|
|
import ToolBar from "@/components/ToolBar.vue";
|
|
|
|
// @Options({
|
|
// components: {
|
|
// TransactionEditDrawer, SpeedDial,
|
|
// MenuBar,
|
|
// },
|
|
// })
|
|
// export default class App extends Vue {}
|
|
</script>
|
|
|
|
<style scoped>
|
|
/* Пример настройки высоты для поддержки flexbox */
|
|
#app {
|
|
min-height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
</style>
|