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

export default function About() {
  return (
    <Sheet sx={{ maxWidth: 700, margin: "auto" }}>
      <Typography padding={1} level="h3">
        About this site
      </Typography>
      <Typography padding={1}>
        Inspired by a fried's need to build a deck using cards featuring chairs,
        this search engine helps you find Magic: The Gathering cards by their
        artwork.
      </Typography>
      <Typography padding={1}>
        Azure Cognitive Services was used to analyze the images and generate
        captions, which are then compared against the search query. Card data
        and images are from{" "}
        <a style={{ textDecoration: "underline" }} href="https://scryfall.com/">
          Scryfall
        </a>
        .
      </Typography>
      <Typography padding={1}>
        This site was built by{" "}
        <a
          style={{ textDecoration: "underline" }}
          href="https://hobbs.zone/henry.html"
        >
          Henry Hobbs
        </a>
        . Site source is available{" "}
        <a
          style={{ textDecoration: "underline" }}
          href="https://git.hobbs.zone/henry/mtg-visual-search"
        >
          here
        </a>{" "}
        and the scripts used to generate the card data are available{" "}
        <a
          style={{ textDecoration: "underline" }}
          href="https://git.hobbs.zone/henry/mtg-chair-ai"
        >
          here
        </a>
        .
      </Typography>
      <Typography padding={1}>
        Questions? Feature requests? Cards out of date? Email me at{" "}
        <a style={{ textDecoration: "underline" }} href="mailto:mtg@hobbs.zone">
          mtg@hobbs.zone
        </a>
        .
      </Typography>
    </Sheet>
  )
}
