website/_components/navbar.tsx

35 lines
964 B
TypeScript
Raw Normal View History

export default function({ nav }) {
const defaultIcon = "https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/question-mark.svg";
const iconStyle = {
filter: "var(--filter-green)",
};
2023-07-26 09:50:04 -04:00
return (
<nav className="navbar">
<ul className="navbar-list">
<li className="navbar-list-item home">
<a href="/">
<img
src="https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/home.svg"
className="icon"
style={iconStyle}
/>
</a>
2023-07-26 09:50:04 -04:00
</li>
{nav.menu().children.map(navItem => (
<li className="navbar-list-item">
<a href={`/${navItem.slug}`} title={navItem.data.title}>
<img
src={navItem.data.nav_icon || defaultIcon}
className="icon"
style={iconStyle}
/>
</a>
</li>
))}
2023-07-26 09:50:04 -04:00
</ul>
</nav>
);
}