import Link from "next/link";
import Image from "next/image";

function MyLink(
  { href, label }: { href: string, label: string }
) {
  return (
    <Link className="font-bold" href={href}>{label}</Link>
  )
}
export function Navbar() {
  return (
    <div className="flex justify-between items-center w-full h-16 px-8 bg-[#35786f] text-white">
      <Link href={'/'} className="text-xl flex">
        <Image
          src={'/favicon.ico'}
          alt="logo"
          width="32"
          height="32"
          className="rounded-4xl">
        </Image>
        <span className="font-bold">学语言</span>
      </Link>
      <div className="flex gap-4 text-xl">
        <MyLink href="/changelog.txt" label="关于"></MyLink>
        <MyLink href="https://github.com/GoddoNebianU/learn-languages" label="源码"></MyLink>
      </div>
    </div>
  );
}