foster/website
1
0
Fork 0
Code Issues 8 Pull requests Activity

Generate navigation items using the nav plugin

Browse source 
The `nav_icon` page data specifies which icon will be displayed in
the nav entry.
This commit is contained in:
Foster Hangdaan 2023-08-04 22:00:39 -04:00
parent a2980f4a0a
commit f04758c971
Signed by: foster
GPG key ID: E48D7F49A852F112
3 changed files with 16 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

33
_components/navbar.tsx
View file

@ -1,4 +1,6 @@
export default function() {
export default function({ nav }) {
const defaultIcon = "https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/question-mark.svg";
const iconStyle = {
filter: "var(--filter-blue)",
};
@ -15,24 +17,17 @@ export default function() {
/>
</a>
</li>
<li className="navbar-list-item">
<a href="/gpg-key" title="GPG Key">
<img
src="https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/key.svg"
className="icon"
style={iconStyle}
/>
</a>
</li>
<li className="navbar-list-item">
<a href="/resume" title="Resume">
<img
src="https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/file-cv.svg"
className="icon"
style={iconStyle}
/>
</a>
</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>
))}
</ul>
</nav>
);

1
gpg-key.md
View file

@ -1,6 +1,7 @@
---
title: GPG Key
description: Information about my public GPG key and how to obtain it.
nav_icon: https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/key.svg
---
> I do not use keyservers. This is the only place where I provide my public key. A key claiming to be mine somewhere else is definitely a fake.

1
resume.md
View file

@ -1,6 +1,7 @@
---
title: Resume
description: My experience, skills, education, etc.
nav_icon: https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/file-cv.svg
---
## Experience