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

export default function Header() {
  return (
    <div className="flex items-center justify-between p-5 bg-background border-b border-border">
      <Link href="/" className="flex items-center">
        &emsp;&emsp;&emsp;&emsp;&emsp;&emsp;&emsp;

        <Image
          src="/icons/book-user.svg"
          width={60}
          height={60}
          alt="Picture of the author"
          priority
          className="object-contain"
        />
        &emsp;
        <span className="text-xl font-bold ext-orange-600 content-center">
          ATS Sample App
        </span>
      </Link>

      <div className="h-[43px] flex items-center justify-center">
        {/* TODO: add Github Source Link */}
        <Link
          href="#"
          className="rounded-md bg-gray-500 px-4 py-2 text-sm font-semibold text-white transition-colors hover:bg-gray-600"
        >
          Github Source
        </Link>
        &emsp;&emsp;&emsp;&emsp;&emsp;&emsp;
      </div>
    </div>
  );
}
