fix(layout): adjust height and flex properties for improved layout responsiveness

This commit is contained in:
cfngc4594 2025-02-24 12:32:03 +08:00
parent 3b89e5de0e
commit bfb60aba6c
3 changed files with 8 additions and 8 deletions

View File

@ -6,9 +6,9 @@ interface AppLayoutProps {
export default function AppLayout({ children }: AppLayoutProps) { export default function AppLayout({ children }: AppLayoutProps) {
return ( return (
<div className="h-screen flex flex-col"> <div className="h-full flex flex-col">
<Banner /> <Banner />
<main className="flex flex-1 min-h-0"> <main className="flex-1">
{children} {children}
</main> </main>
</div> </div>

View File

@ -8,8 +8,8 @@ interface DescriptionLayoutProps {
export default function DescriptionLayout({ children }: DescriptionLayoutProps) { export default function DescriptionLayout({ children }: DescriptionLayoutProps) {
return ( return (
<Tabs defaultValue="description"> <Tabs defaultValue="description" className="h-full flex flex-col">
<ScrollArea className="h-11 flex items-center pt-1 px-1 bg-muted"> <ScrollArea className="h-9 flex-none bg-muted">
<TabsList className="gap-1 bg-transparent"> <TabsList className="gap-1 bg-transparent">
<TabsTrigger <TabsTrigger
value="description" value="description"
@ -25,7 +25,7 @@ export default function DescriptionLayout({ children }: DescriptionLayoutProps)
</TabsList> </TabsList>
<ScrollBar orientation="horizontal" /> <ScrollBar orientation="horizontal" />
</ScrollArea> </ScrollArea>
<TabsContent value="description" className="mt-0 border-t border-muted"> <TabsContent value="description" className="grow mt-0">
{children} {children}
</TabsContent> </TabsContent>
</Tabs> </Tabs>

View File

@ -8,8 +8,8 @@ interface WorkspaceLayoutProps {
export default function WorkspaceLayout({ children }: WorkspaceLayoutProps) { export default function WorkspaceLayout({ children }: WorkspaceLayoutProps) {
return ( return (
<Tabs defaultValue="code"> <Tabs defaultValue="code" className="h-full flex flex-col">
<ScrollArea className="h-11 flex items-center pt-1 px-1 bg-muted"> <ScrollArea className="h-9 flex-none bg-muted">
<TabsList className="gap-1 bg-transparent"> <TabsList className="gap-1 bg-transparent">
<TabsTrigger <TabsTrigger
value="code" value="code"
@ -25,7 +25,7 @@ export default function WorkspaceLayout({ children }: WorkspaceLayoutProps) {
</TabsList> </TabsList>
<ScrollBar orientation="horizontal" /> <ScrollBar orientation="horizontal" />
</ScrollArea> </ScrollArea>
<TabsContent value="code" className="mt-0 border-t border-muted"> <TabsContent value="code" className="grow mt-0">
{children} {children}
</TabsContent> </TabsContent>
</Tabs> </Tabs>