<script setup>
import { useRouter } from "vue-router";
import { NButton, NIcon, NSpace } from "naive-ui";
import ChevronForward from '@/assets/svgs/ChevronForward.svg'
import ChevronBack from '@/assets/svgs/ChevronBack.svg'

const router = useRouter()

</script>
<template>
  <NSpace id="nav" justify="end">
    <n-button circle size="small" @click="router.back()" >
      <template #icon>
        <!-- <n-icon>
          <ChevronBack />
        </n-icon> -->
        <!-- <n-icon> -->
          <svg-icon name="ChevronBack" class="" />
        <!-- </n-icon> -->
      </template>
    </n-button>
    <n-button circle size="small" @click="router.forward()">
      <template #icon>
        <!-- <n-icon>
          <ChevronForward />
        </n-icon> -->
        <!-- <n-icon> -->
          <svg-icon name="ChevronForward" class="" />
        <!-- </n-icon> -->
      </template>
    </n-button>
  </NSpace>
</template>
<style lang="less" scoped>
#nav {
  width: 150px;
  // text-align: right;
  // padding-top: 10px;
}
</style>
