Generate navigation items using the nav
plugin
The `nav_icon` page data specifies which icon will be displayed in the nav entry.
This commit is contained in:
parent
a2980f4a0a
commit
f04758c971
3 changed files with 16 additions and 19 deletions
|
@ -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 = {
|
const iconStyle = {
|
||||||
filter: "var(--filter-blue)",
|
filter: "var(--filter-blue)",
|
||||||
};
|
};
|
||||||
|
@ -15,24 +17,17 @@ export default function() {
|
||||||
/>
|
/>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<li className="navbar-list-item">
|
{nav.menu().children.map(navItem => (
|
||||||
<a href="/gpg-key" title="GPG Key">
|
<li className="navbar-list-item">
|
||||||
<img
|
<a href={`/${navItem.slug}`} title={navItem.data.title}>
|
||||||
src="https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/key.svg"
|
<img
|
||||||
className="icon"
|
src={navItem.data.nav_icon || defaultIcon}
|
||||||
style={iconStyle}
|
className="icon"
|
||||||
/>
|
style={iconStyle}
|
||||||
</a>
|
/>
|
||||||
</li>
|
</a>
|
||||||
<li className="navbar-list-item">
|
</li>
|
||||||
<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>
|
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
);
|
);
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
---
|
---
|
||||||
title: GPG Key
|
title: GPG Key
|
||||||
description: Information about my public GPG key and how to obtain it.
|
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.
|
> 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,6 +1,7 @@
|
||||||
---
|
---
|
||||||
title: Resume
|
title: Resume
|
||||||
description: My experience, skills, education, etc.
|
description: My experience, skills, education, etc.
|
||||||
|
nav_icon: https://static.fosterhangdaan.com/icons/tabler-icons/latest/svg/file-cv.svg
|
||||||
---
|
---
|
||||||
|
|
||||||
## Experience
|
## Experience
|
||||||
|
|
Loading…
Reference in a new issue