feat: add Header component

This commit is contained in:
TerryM
2026-05-12 16:28:30 +08:00
parent 213d6c49bc
commit 316dbe3c78
2 changed files with 30 additions and 1 deletions

View File

@@ -0,0 +1,28 @@
---
---
<header class="fixed top-0 left-0 w-full h-[78px] bg-[rgba(248,243,238,0.84)] border-b border-border-light backdrop-blur-sm z-50 flex items-center justify-center">
<div class="w-[1280px] flex items-center">
<div class="flex-1">
<a href="/" class="flex items-center gap-2 w-fit">
<img src="/assets/logo-icon.png" alt="Talk Pro icon" class="h-[42px] w-[53px] object-cover" />
<img src="/assets/logo-wordmark.png" alt="Talk Pro" class="h-6" />
</a>
</div>
<nav class="flex items-center gap-7 font-bold text-[14px] text-text-secondary tracking-[-0.09px]">
<a href="#" class="hover:text-text-primary transition-colors">Home</a>
<a href="#" class="hover:text-text-primary transition-colors">Features</a>
<a href="#" class="hover:text-text-primary transition-colors">Product</a>
<a href="#" class="hover:text-text-primary transition-colors">Privacy</a>
<a href="#" class="hover:text-text-primary transition-colors">About</a>
</nav>
<div class="flex-1 flex justify-end">
<button class="bg-brand text-white font-bold text-[14px] px-[22px] py-[13px] rounded-[17px] hover:opacity-90 transition-opacity">
Download
</button>
</div>
</div>
</header>
<div class="h-[78px]"></div>