paulnicoue/app.vue

<template>

    <div class="app">
        <NuxtPage class="app__main" />
        <AppFooter class="app__footer" />
    </div>

</template>

<script setup>

    // --------------------------------------------------
    // DATA
    // --------------------------------------------------

    const pageTitleChunk = useRoute().meta.pageTitleChunk;

    // --------------------------------------------------
    // HEAD
    // --------------------------------------------------

    useAppHead(pageTitleChunk);
    
</script>

<style lang="scss">

    // --------------------------------------------------
    // STYLE
    // --------------------------------------------------

    .app {
        width: 100%;
        min-height: 100vh;
        min-height: 100svh;
        display: grid;
        grid:
            'app-main' 1fr
            'app-footer' auto
            / 100%;
        place-content: start center;
        place-items: center;
    
        &__main {
            grid-area: app-main;
        }

        &__footer {
            grid-area: app-footer;
        }
    }

</style>