<script setup lang="ts"></script>

<template>
  <n-layout class="layout" position="absolute" has-sider>
    <Sider />

    <n-layout>
      <n-layout-header>
        <Header />
      </n-layout-header>

      <n-layout-content>
        <div class="layout-content-main">
          <Main />
        </div>
      </n-layout-content>
    </n-layout>
  </n-layout>
</template>
<style scoped lang="scss">
.layout {
  display: flex;
  flex: auto;
  flex-direction: row;

  &-content-main {
    flex: auto;
    min-height: calc(100vh - 50px);
    padding: 10px;
    background: #f5f7f9;
  }
}
</style>
