40 lines
734 B
TypeScript
40 lines
734 B
TypeScript
interface NavigationItem {
|
|
name: string;
|
|
href: string;
|
|
}
|
|
|
|
const items: NavigationItem[] = [
|
|
{ name: "Home", href: "/" },
|
|
{ name: "About", href: "/about" },
|
|
];
|
|
|
|
export default function Navigation() {
|
|
return (
|
|
<nav
|
|
style={{
|
|
display: "flex",
|
|
alignItems: "center",
|
|
margin: "auto",
|
|
gap: "$2",
|
|
}}
|
|
>
|
|
{items.map((item) => (
|
|
<a
|
|
style={{
|
|
_hover: {
|
|
backgroundColor: "$gray.900",
|
|
},
|
|
fontWeight: "$semibold",
|
|
paddingY: "$2",
|
|
paddingX: "$4",
|
|
borderRadius: "$md",
|
|
}}
|
|
href={item.href}
|
|
>
|
|
{item.name}
|
|
</a>
|
|
))}
|
|
</nav>
|
|
);
|
|
}
|