<template>
  <nav
    class="home-nav fixed top-0 left-0 right-0 z-50 bg-white/80 backdrop-blur-md shadow-sm"
  >
    <div class="container mx-auto px-6 py-4 flex justify-between items-center">
      <div class="text-xl font-bold text-blue-600">ZW多人语音合成</div>

      <ul class="flex items-center space-x-6">
        <li class="text-gray-600 hover:text-blue-500 transition cursor-pointer">
          产品列表
        </li>

        <li class="text-gray-600 hover:text-blue-500 transition cursor-pointer">
          关于我们
        </li>

        <Button type="primary">登录</Button>
      </ul>
    </div>
  </nav>

  <div>  我是导航栏</div>
</template>
<script lang="ts" setup>
import { Button } from 'ant-design-vue';

defineOptions({
  name: 'HomeNav',
});
</script>
<style lang="sass" scoped>
.home-nav{

}
</style>
