import Header from "../components/Header";
import { Outlet, useLocation } from "react-router";
import Footer from "../components/Footer";
import clsx from "clsx";

function DefaultLayout() {
  const { pathname } = useLocation();

  return (
    <div
      className={clsx(
        "min-h-dvh flex flex-col select-none",
        pathname.endsWith("/about") ? "bg-white" : "bg-[#F3F3F2]"
      )}
    >
      <Header />
      <div className="flex-1 flex flex-col justify-between">
        <Outlet />
      </div>
      <Footer />
    </div>
  );
}

export default DefaultLayout;