import { About } from '@/components/about'
import { Banner } from '@/components/banner'
import { CarouselComponent } from '@/components/corousel-component'
import { CourseCategory } from '@/components/course-category'
import { Differences } from '@/components/differences'
import { NavLinkCategory } from '@/components/nav-link-category'
import { SignUp } from '@/components/sign-up'
import { Button } from '@/components/ui/button'
import { Input } from '@/components/ui/input'
import { Search } from 'lucide-react'
import Link from 'next/link'

// import { ThemeSwitcher } from '@/components/theme-switcher'

export default function Home() {
  return (
    <>
      <main className="overflow-hidden">
        <Banner />

        {/* <ThemeSwitcher /> */}
        <div className="container flex flex-col">
          <NavLinkCategory />
          <div className="flex justify-center items-center w-full md:w-1/2 mx-auto mb-8">
            <Input placeholder="O que você quer aprender hoje?" />
            <Search size={24} />
          </div>
          <CarouselComponent />
          <Button
            variant="secondary"
            className="uppercase mx-auto my-8"
            asChild
          >
            <Link href="#">Ver todos os cursos</Link>
          </Button>
        </div>
        <CourseCategory />
        <Differences />
        <SignUp />
        <About.Root>
          <About.Globo>
            <p className="hidden md:block text-center">
              Nós, na <b>Indústria Criativa</b>, oferecemos serviços
              educacionais e assessoria profissional a instituições públicas e
              privadas. Nossa meta é conectar pessoas, empresas e instituições
              por meio do conhecimento técnico-científico aplicado aos negócios.
            </p>
            <Button className="uppercase">
              <Link href="/sobre">Saiba mais</Link>
            </Button>
          </About.Globo>
          <About.Companies className="hidden md:flex" />
        </About.Root>
      </main>
    </>
  )
}
