mirror of
https://github.com/jimeh/commonflow.org.git
synced 2026-02-19 05:46:40 +00:00
wip: add icons to navbar links
This commit is contained in:
@@ -11,9 +11,9 @@ interface Props {
|
||||
const { version } = Astro.props;
|
||||
|
||||
const navItems = [
|
||||
{ id: "about", label: "About" },
|
||||
{ id: "spec", label: "Spec" },
|
||||
{ id: "faq", label: "FAQ" },
|
||||
{ id: "about", label: "About", icon: "heroicons:information-circle" },
|
||||
{ id: "spec", label: "Spec", icon: "heroicons:document-text" },
|
||||
{ id: "faq", label: "FAQ", icon: "heroicons:question-mark-circle" },
|
||||
];
|
||||
---
|
||||
|
||||
@@ -52,14 +52,15 @@ const navItems = [
|
||||
navItems.map((item) => (
|
||||
<a
|
||||
href={`#${item.id}`}
|
||||
class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
|
||||
rounded-lg transition-colors cursor-pointer
|
||||
class="nav-link inline-flex items-center gap-1.5 px-4 py-2 text-sm
|
||||
font-medium rounded-lg transition-colors cursor-pointer
|
||||
text-gray-600 dark:text-neutral-400
|
||||
hover:bg-gray-100 hover:text-gray-950
|
||||
dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
|
||||
data-nav-link
|
||||
data-section-id={item.id}
|
||||
>
|
||||
<Icon name={item.icon} class="w-4 h-4" />
|
||||
{item.label}
|
||||
</a>
|
||||
))
|
||||
@@ -112,11 +113,12 @@ const navItems = [
|
||||
navItems.map((item) => (
|
||||
<a
|
||||
href={`#${item.id}`}
|
||||
class="nav-link block py-2 text-gray-600 dark:text-neutral-400
|
||||
hover:text-sky-600"
|
||||
class="nav-link flex items-center justify-center gap-1.5 py-2
|
||||
text-gray-600 dark:text-neutral-400 hover:text-sky-600"
|
||||
data-nav-link
|
||||
data-section-id={item.id}
|
||||
>
|
||||
<Icon name={item.icon} class="w-4 h-4" />
|
||||
{item.label}
|
||||
</a>
|
||||
))
|
||||
|
||||
Reference in New Issue
Block a user