40 lines
808 B
Vue
40 lines
808 B
Vue
<template>
|
|
<div id="app" class="flex flex-col min-h-screen">
|
|
<MainNavigationBar class="flex-none" />
|
|
<RouterView class="flex-auto" v-slot="{ Component }">
|
|
<Transition mode="out-in" name="app">
|
|
<component :is="Component"></component>
|
|
</Transition>
|
|
</RouterView>
|
|
<Footer class="flex-none" />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import * as log from 'loglevel';
|
|
|
|
import MainNavigationBar from '@/components/MainNavigationBar.vue';
|
|
import Footer from '@/components/Footer.vue';
|
|
import {onMounted} from 'vue';
|
|
|
|
log.debug('App created');
|
|
|
|
onMounted(() => {
|
|
log.debug('App mounted');
|
|
});
|
|
|
|
</script>
|
|
|
|
<style lang="postcss" scoped>
|
|
.app-enter-active,
|
|
.app-leave-active {
|
|
transition: opacity 0.3s ease;
|
|
}
|
|
|
|
.app-enter-from,
|
|
.app-leave-to {
|
|
opacity: 0;
|
|
}
|
|
|
|
</style>
|