import { Img, Txt, Layout, makeScene2D } from "@motion-canvas/2d";
import { beginSlide } from "@motion-canvas/core";
import { theme } from "../theme";

import xkcd from "../../public/img/xkcd.png";

export default makeScene2D(function* (view) {
  yield view.add(
    <>
      <Layout
        layout
        direction="column"
        textAlign="center"
        alignItems="center"
        gap={100}
      >
        <Txt fontFamily={theme.font} fill={theme.text.hex}>
          Compiling The Lambda Calculus{" "}
          <Txt fontFamily={theme.font} fill={theme.blue.hex}>
            {"=> λ"}
          </Txt>
        </Txt>
        <Img scale={1.4} src={xkcd}></Img>
        <Txt
          fontFamily={theme.font}
          fill={theme.flamingo.hex}
          fontStyle="italic"
          fontSize={40}
        >
          #2453
        </Txt>
      </Layout>
    </>
  );
  yield* beginSlide("Title");
});
