Files
gander/frontend/src/components/Layout/DynamicPageContent.tsx
2025-02-27 01:44:44 +00:00

42 lines
1.1 KiB
TypeScript

import React from "react";
import Navbar from "../Navigation/Navbar";
import { useSidebar } from "../../context/SidebarContext";
import Footer from "./Footer";
interface DynamicPageContentProps extends React.HTMLProps<HTMLDivElement> {
children: React.ReactNode;
navbarVariant?: "home" | "no-searchbar" | "default";
className?: string;
contentClassName?: string;
style?: React.CSSProperties;
}
const DynamicPageContent: React.FC<DynamicPageContentProps> = ({
children,
navbarVariant = "default",
className = "",
contentClassName = "",
style,
}) => {
const { showSideBar } = useSidebar();
return (
<div
className={`${className} bg-[url(/images/background-pattern.svg)]`}
style={style}
>
<Navbar variant={navbarVariant} />
<div
id="content"
className={`min-w-[850px] ${
showSideBar ? "w-[85vw] translate-x-[15vw]" : "w-[100vw]"
} items-start pb-[12vh] transition-all duration-[500ms] ease-in-out ${contentClassName}`}
>
{children}
</div>
</div>
);
};
export default DynamicPageContent;