import React from "react";

import { Link } from "../link";

const navList = [
  { title: "Home", href: "#01" },
  { title: "Персонажи", href: "#02" },
  { title: "Локации", href: "#03" },
  { title: "Эризоды", href: "#04" },
];

export function NavPanel() {
  return (
    <nav className="nav">
      <ul>
        {navList.map((element, index) => (
          <li key={element.href}>
            <Link contrast={Boolean(index)} href={element.href}>{element.title}</Link>
          </li>
        ))}
      </ul>
    </nav>
  );
}