Update control panel layout + add new action bar (#1756)

This commit is contained in:
Luke Vella 2025-06-05 11:18:28 +01:00 committed by GitHub
parent 87b8c76492
commit 1146586e14
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
16 changed files with 307 additions and 185 deletions

View file

@ -1,3 +1,5 @@
import { SidebarTrigger } from "@rallly/ui/sidebar";
export function FullWidthLayout({ children }: { children: React.ReactNode }) {
return <div>{children}</div>;
}
@ -6,8 +8,13 @@ export function FullWidthLayoutHeader({
children,
}: { children: React.ReactNode }) {
return (
<header className="sticky top-0 z-10 rounded-t-lg border-b bg-background/90 px-6 py-4 backdrop-blur-sm">
{children}
<header className="sticky top-0 z-10 rounded-t-lg border-b bg-background/90 px-3 py-4 backdrop-blur-sm md:px-6">
<div className="flex items-center gap-4">
<div className="md:hidden">
<SidebarTrigger />
</div>
<div className="flex-1">{children}</div>
</div>
</header>
);
}
@ -15,7 +22,7 @@ export function FullWidthLayoutHeader({
export function FullWidthLayoutContent({
children,
}: { children: React.ReactNode }) {
return <main className="p-6">{children}</main>;
return <main className="p-3 pb-44 md:px-6 md:pt-6">{children}</main>;
}
export function FullWidthLayoutTitle({
@ -23,9 +30,9 @@ export function FullWidthLayoutTitle({
icon,
}: { children: React.ReactNode; icon?: React.ReactNode }) {
return (
<div className="flex items-center gap-2">
<div className="flex items-center gap-2.5">
{icon}
<h1 className="font-semibold text-xl">{children}</h1>
<h1 className="font-bold text-xl">{children}</h1>
</div>
);
}