import { Container } from "components/Container";

import { Hero } from "../components/Hero";
import { Dates } from "../components/Dates";
import { Price } from "../components/Price";
import { CourseDetails } from "components/CourseDetails";

export default function Page() {
  return (
    <>
      <main>
        <Hero />
        <div className="bg-amber-500 h-8" />
        {/* <Dates /> */}
        <Container className="mt-12 md:grid md:grid-cols-5 md:gap-x-4 md:gap-y-4">
            <div className="md:col-span-3">
              <CourseDetails />
            </div>
            <div className="mt-8 md:col-span-2 md:mt-0">
              <Price />
            </div>
        </Container>
      </main>
    </>
  );
}