fixing safe zone paddings (attempt 2)

This commit is contained in:
corgifist 2025-07-25 20:21:08 +03:00
parent 6691d4b23f
commit 5a7c627cd6
3 changed files with 74 additions and 72 deletions

View File

@ -251,12 +251,13 @@ export default function Home(): ReactNode {
return (
<div className="p-5 w-full h-full">
<div className="pt-safe">
<div className="flex flex-row items-center gap-2 overscroll-none">
<SidebarTrigger size="lg" />
<h2 className="font-bold break-keep text-xl sm:text-2xl md:text-3xl lg:text-4xl leading-none">Project Library</h2>
{projects && <Label className="text-muted-foreground text-sm">(Found {projects.length} projects)</Label>}
</div>
<div className="flex flex-row items-center justify-between sticky top-0 bg-background gap-2 mt-3 pb-2 pt-safe-or-2 w-full overscroll-none z-50">
<div className="flex flex-row items-center justify-between sticky top-0 bg-background gap-2 mt-3 pb-2 pt-2 w-full overscroll-none z-50">
<div className="flex flex-row items-center gap-2">
<Dialog>
<DialogTrigger asChild>
@ -296,6 +297,7 @@ export default function Home(): ReactNode {
<Search placeholder="Search Projects" value={search} onChange={(e) => setSearch(e.target.value)} />
</div>
</div>
</div>
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4 mt-5">
{projects && projects.map((project) => <ProjectContainer key={project.uuid} project={project} />)}
</div>

View File

@ -32,7 +32,7 @@ const items: DashboardItem[] = [
export const Dashboard = (): ReactNode => {
return (
<Sidebar className="ml-safe">
<Sidebar className="pl-safe">
<SidebarHeader className="flex justify-center items-center mt-safe-or-2">
<Link href="/">
<ClipFusionLogo width="30" height="30">

View File

@ -187,7 +187,7 @@ function Sidebar({
data-sidebar="sidebar"
data-slot="sidebar"
data-mobile="true"
className="bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden"
className={cn("bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden", className)}
style={
{
"--sidebar-width": SIDEBAR_WIDTH_MOBILE,
@ -199,7 +199,7 @@ function Sidebar({
<SheetTitle>Sidebar</SheetTitle>
<SheetDescription>Displays the mobile sidebar.</SheetDescription>
</SheetHeader>
<div className={cn("flex h-full w-full flex-col", className)}>{children}</div>
<div className="flex h-full w-full flex-col">{children}</div>
</SheetContent>
</Sheet>
)