Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 | 8x 8x 17x 1x 1x | import React from "react";
import ReactGA from "react-ga4";
import { navigate, withPrefix } from "gatsby";
import NavItem from "./NavItem";
import ExternalLink from "@/components/ExternalLink";
import * as style from "./index.module.scss";
const NavbarClass = [
"navbar",
"navbar-expand-md",
"sticky-top",
style.customNavbar,
];
const Navbar = () => (
<nav
id="m-navbar"
className={`${NavbarClass.join(" ")} navbar-night`}
title="navbar"
>
<div className="container">
<button
type="button"
className={style.navbarBrand + " navbar-brand btn btn-default"}
data-testid="logo"
onClick={() => {
ReactGA.event({
category: "User",
action: "Click navbar logo",
});
navigate(withPrefix("/"));
}}
>
<img
src="/assets/logo3.svg"
alt=""
width="135"
height="45"
data-testid="logo-img"
/>
<h1 className="visually-hidden">
Japanese IT Developer's Blog tubone BOYAKI
</h1>
</button>
<button
className={style.navbarToggler + " navbar-toggler"}
type="button"
data-bs-toggle="collapse"
aria-label="navbar-toggler"
data-bs-target="#navbarSupportedContent"
>
<span className="icon-bars" />
</button>
<div
className="collapse navbar-collapse flex-row-reverse"
id="navbarSupportedContent"
role="navigation"
>
<ul className={style.navbarNav + " navbar-nav mr-2"}>
<li>
<NavItem url="/tags/" name="Tags" key="/tags/" />
</li>
<li>
<NavItem url="/about/" name="About" key="/about/" />
</li>
<li>
<ExternalLink
className="nav-btn btn btn-link"
title="Contact"
href="https://portfolio.tubone-project24.xyz/#contact"
/>
</li>
<li>
<ExternalLink
className="nav-btn btn btn-link"
title="Portfolio"
href="https://portfolio.tubone-project24.xyz"
/>
</li>
<li>
<ExternalLink
className="nav-btn btn btn-link"
title="Note"
href="https://note.tubone-project24.xyz"
/>
</li>
<li>
<ExternalLink
className="nav-btn btn btn-link"
title="FM"
href="https://tubone24.github.io/boyakifm/"
/>
</li>
</ul>
</div>
</div>
</nav>
);
export default Navbar;
|