43 lines
1.5 KiB
JavaScript
43 lines
1.5 KiB
JavaScript
import styles from './index.module.scss'
|
|
import ActiveLink from '../ActiveLink'
|
|
import { Svg } from 'react-optimized-image'
|
|
|
|
export default function HeaderNav() {
|
|
return (
|
|
<header className={styles.header}>
|
|
<nav className={styles.nav}>
|
|
<div className={styles.navPart1}>
|
|
<ActiveLink href="/" activeClassName={styles.active}><a className={styles.link}>Home</a></ActiveLink>
|
|
<ActiveLink href="/posts" activeClassName={styles.active}><a className={styles.link}>Posts</a></ActiveLink>
|
|
<ActiveLink href="/tools" activeClassName={styles.active}><a className={styles.link}>Toolbox</a></ActiveLink>
|
|
</div>
|
|
<div className={styles.navPart2}>
|
|
<a
|
|
href="https://social.treehouse.systems/@lukegb"
|
|
className={styles.link}
|
|
aria-label="Mastodon"
|
|
rel="me"
|
|
>
|
|
<Svg src={require('./assets/mastodon.svg')} viewBox="0 0 16 16" />
|
|
</a>
|
|
<a
|
|
href="https://twitter.com/lukegb"
|
|
className={styles.link}
|
|
aria-label="Twitter"
|
|
rel="me"
|
|
>
|
|
<Svg src={require('./assets/iconmonstr-twitter-1.svg')} viewBox="0 0 24 24" />
|
|
</a>
|
|
<a
|
|
href="https://github.com/lukegb"
|
|
className={styles.link}
|
|
aria-label="GitHub"
|
|
rel="me"
|
|
>
|
|
<Svg src={require('./assets/iconmonstr-github-1.svg')} viewBox="0 0 24 24" />
|
|
</a>
|
|
</div>
|
|
</nav>
|
|
</header>
|
|
)
|
|
}
|