import { Sheet, Typography } from "@mui/joy"
import Link from "next/link"

export default function Header() {
  return (
    <Sheet
      variant="solid"
      sx={{
        flexDirection: "row",
        display: "flex",
        justifyContent: "space-between",
        alignItems: "center",
      }}
    >
      <Typography level="h1" padding={2} variant="solid">
        <Link href="/">MTG Visual Search</Link>
      </Typography>
      <Typography level="h4" padding={2} variant="solid" textAlign="right">
        <Link href="about">About</Link>
      </Typography>
    </Sheet>
  )
}