Updates tabbed layouts for phones

This commit is contained in:
2025-07-26 13:33:14 -07:00
parent c7083a9b56
commit 3310be9e9b

View File

@@ -18,15 +18,17 @@ export function TabbedLayout({
<div className="grow p-2 flex flex-col gap-2">
<div className="flex flex-row gap-2">{navigation}</div>
<div>{title}</div>
<div className="flex flex-row justify-start grow">
<div className="shrink-0 grow-0 w-40 p-0">{tabs}</div>
<div className="flex flex-col md:flex-row justify-start grow">
<div className="shrink-0 grow-0 md:w-40 p-0 flex flex-row flex-wrap md:flex-col md:flex-nowrap">
{tabs}
</div>
<div
className={`grow p-2 bg-slate-800 border-t border-b border-r border-slate-700`}
className={`grow p-2 bg-slate-800 border-t border-b border-r border-slate-700 ${flyout && "hidden"} md:block`}
>
{content}
</div>
{flyout && (
<div className="w-md p-2 bg-slate-800 border border-slate-700">
<div className="grow md:w-md p-2 bg-slate-800 border border-slate-700">
{flyout}
</div>
)}