ViewBare.vue

<template>
  <div class="view-bare">
    <app-navbar/>

    <div id="wrapper">
      <slot></slot>
    </div>

    <app-footer/>
  </div>
</template>

<script>
// @ is an alias to /src
import AppNavbar from '@/components/AppNavbar'
import AppFooter from '@/components/AppFooter'

export default {
  name: 'view-default',
  components: {
    AppNavbar,
    AppFooter
  }
}
</script>

<style lang="scss" scoped>
.view-bare {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  justify-content: space-between;
}

#wrapper {
  margin: 0 auto;
}
</style>