import { html } from "../html";
import { Image } from "./Image";

export const NavigationBar = () => html`
  <div class="navigation-bar">
    <div class="navigation-bar__inner">
      <a href="/" data-link class="navigation-bar__brand">
        <div class="navigation-bar__icon">
          ${Image("avatar", { size: 256 })}
        </div>
        <div class="navigation-bar__title" title="wiwaow!">willow!</div>
      </a>
      <nav class="navigation-bar__nav">
        <a href="/" data-link>home</a>
        <a href="/uses" data-link>uses</a>
        <a href="/projects" data-link>projects</a>
      </nav>
    </div>
  </div>
`;