<template>
<div class="body theme" >
  <Head />
  <div class="aside-con card">
    <Aside />
  </div>
      <router-view class="main-view" />
  </div>
</template>

<script>
import Head from './head'
import Aside from './aside'

export default {
  components: {
    Head,
    Aside
  },
  computed: {
   
  },
  mounted () {
  }
}
</script>

<style scoped>
.body{
  width: 100%;
  height: 100%;
}
.aside-con {
  width: 15rem;
  position: fixed;
  height: calc(100% - 8rem);
  margin: 1.875rem 1.25rem 1.875rem 1.875rem;
  border-radius: .625rem;
  overflow: hidden;
  background-color: #ccc;
}
.main-view{
  margin: 1.875rem 1.875rem 0 18.25rem;
  width: calc(100% - 20.125rem);
  height: calc(100% - 8rem);
  overflow: hidden;
}
</style>
