<template>
  <div class="app-layout">
    <app-header></app-header>
    <div class="app-layout-container">
      <app-aside></app-aside>
      <app-main></app-main>
    </div>
  </div>
</template>

<script>
import AppHeader from './Header.vue'
import AppAside from './Aside.vue'
import AppMain from './Main.vue'

export default {
  name: 'AppLayout',
  components: { AppHeader, AppAside, AppMain }
}
</script>

<style>
.app-layout {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background-color: #ededed;
}
.app-layout-container {
  flex: 1;
  display: flex;
}
</style>
