BuildingDashboard.vue

<script setup>
import BuildingData from '@/components/BuildingData.vue'
import BuildingEvaluation from '@/components/BuildingEvaluation.vue'
</script>

<template>
  <div class="building-dashboard">
    <BuildingEvaluation />
    <BuildingData />
    <router-view></router-view>
  </div>
</template>

<style scoped>
.building-dashboard {
  overflow-y: auto;
  flex: 1;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: var(--grid-layout);
}

@media (min-width: 48em) {
  .building-dashboard {
    overflow: hidden;
    padding: var(--spacing);
    grid-template-columns: var(--grid-layout);
    grid-template-rows: 1fr;
  }
}
</style>