Files
playzer/apps/frontend/src/components/layout.tsx

32 lines
884 B
TypeScript

import { Background } from '@/components/background';
import { useIsMobile } from '@/hooks/use-mobile';
import { useLocation } from '@tanstack/react-router';
import type { ReactNode } from 'react';
import { Header } from './header';
interface LayoutProps {
children: ReactNode;
}
export function Layout({ children }: LayoutProps) {
const isMobile = useIsMobile();
const location = useLocation();
const isMobileHome = isMobile && location.pathname === '/';
return (
<div className="relative min-h-dvh overflow-x-hidden bg-background text-foreground">
<Background />
{!isMobileHome && <Header />}
<main
className={
isMobileHome
? 'relative z-10 mx-auto w-full max-w-7xl'
: 'relative z-10 mx-auto w-full max-w-7xl px-3 py-6 sm:px-6 lg:px-8'
}
>
{children}
</main>
</div>
);
}