import Image from "next/image";

export function DesktopLanding() {
  return (
    <div
      id="landing section container"
      className="w-screen h-screen flex flex-col"
    >
      <div className="mt-15 w-full flex flex-col">
        <h1 className=" xl:text-[200px] text-[48px] md:text-[128px]">
          Blueberry OS
        </h1>
      </div>
    </div>
  );
}

export function MobileLanding() {
  return (
    <div
      id="landing section container"
      className="w-screen h-screen flex flex-col"
    >
      <div className="mt-15 w-full flex flex-col items-center">
        <Image
          src="/logo.png"
          alt="logo"
          width={1024}
          height={1024}
          className="dark:invert w-75 md:w-100 xl:w-200"
        />
        <h1 className="xl:text-[140px] text-[50px] md:text-[100px]">
          Blueberry OS
        </h1>
      </div>
    </div>
  );
}