timmypidashev/web
1
0
Fork 0
mirror of https://github.com/timmypidashev/web.git synced 2026-04-14 11:03:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Change header flair to underline from bubble

Browse Source
This commit is contained in:
Timothy Pidashev
2024-03-18 22:12:39 -07:00
parent fbcc0385a4
commit 62fdbf1fc1
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/web/src/components/header.jsx
View File

@@ -43,16 +43,16 @@ function Header() {
onClick={() => setActiveTab(tab.id)}
className={`${
activeTab === tab.id ? "" : "hover:text-white/60"
} relative rounded-full px-3 py-1.5 text-sm font-medium text-white outline-sky-400 transition focus-visible:outline-2`}
} relative rounded-full px-3 py-1.5 text-sm font-medium text-light-foreground dark:text-dark-foreground outline-sky-400 transition focus-visible:outline-2`}
style={{
WebkitTapHighlightColor: "transparent",
}}
>
{activeTab === tab.id && (
<motion.span
layoutId="bubble"
className="absolute inset-0 z-10 bg-white mix-blend-difference"
style={{ borderRadius: 9999 }}
<motion.div
layoutId="underline"
className="absolute inset-x-0 bottom-0 h-1 bg-light-green-1 dark:bg-dark-green-1"
style={{ marginLeft: "0.75em", marginRight: "0.75em", borderRadius: 9999 }}
transition={{ type: "spring", bounce: 0.2, duration: 0.6 }}
/>
)}