twotalesanimation
40b99f3add
Deploy / deploy (push) Successful in 3m19s
At phone width the sidebar stayed 240px wide, leaving pages a ~135px strip. Below md it is now hidden behind a menu button in the header and opens as a drawer (closes on navigation, backdrop, X or Escape); from md up the sidebar is unchanged. Page wrappers use p-4 on phones and keep p-6/p-8 from md. Shot detail: on phones the thumbnail takes the full width with the details below it instead of pushing them off screen, the action buttons wrap, and the tab bar scrolls sideways. Desktop sizing is kept as it was. Every change is behind a md: breakpoint, so the desktop layout is the same. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
33 lines
1003 B
TypeScript
33 lines
1003 B
TypeScript
import { auth } from "@/auth";
|
|
import { redirect } from "next/navigation";
|
|
import { Sidebar } from "@/components/layout/Sidebar";
|
|
import { Header } from "@/components/layout/Header";
|
|
import { MobileNavProvider } from "@/components/layout/MobileNav";
|
|
|
|
export default async function DashboardLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
const session = await auth();
|
|
if (!session?.user) redirect("/login");
|
|
|
|
return (
|
|
<MobileNavProvider>
|
|
<div className="flex h-screen bg-zinc-950 overflow-hidden print:block print:h-auto print:overflow-visible">
|
|
<div className="print:hidden">
|
|
<Sidebar />
|
|
</div>
|
|
<div className="flex-1 flex flex-col overflow-hidden print:block print:overflow-visible">
|
|
<div className="print:hidden">
|
|
<Header />
|
|
</div>
|
|
<main className="flex-1 overflow-auto print:overflow-visible">
|
|
{children}
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</MobileNavProvider>
|
|
);
|
|
}
|