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

<template>
  <div id="page-header">
    <n-text class="nav-text">🌸 Nya Home ~</n-text>
    <router-link to="/" style="margin-left: auto">
      <n-button secondary type="tertiary" size="large">首页</n-button>
    </router-link>
    <router-link to="/chatroom">
      <n-button secondary type="tertiary" size="large">聊天室</n-button>
    </router-link>
    <router-link to="/marketplace">
      <n-button secondary type="tertiary" size="large">剧本市场</n-button>
    </router-link>
  </div>
</template>

<style scoped lang="scss">
div#page-header {
  padding: 4px;
  width: 100%;

  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 4px;

  .nav-text {
    font-size: 22px;
  }
}
</style>
