Refactor: Simplify collapsed sidebar UI

This commit is contained in:
gpt-engineer-app[bot]
2025-10-28 15:56:06 +00:00
parent 832f53a126
commit 575ccd013b
5 changed files with 50 additions and 65 deletions

View File

@@ -229,18 +229,16 @@ export default function Designers() {
)} )}
> >
<div className="sticky top-24"> <div className="sticky top-24">
{sidebarCollapsed ? ( {sidebarCollapsed ? (
<Card className="p-2"> <Button
<Button variant="ghost"
variant="ghost" className="w-full"
className="w-full" onClick={() => setSidebarCollapsed(false)}
onClick={() => setSidebarCollapsed(false)} title="Show filters"
title="Show filters" >
> <PanelLeftOpen className="w-5 h-5" />
<PanelLeftOpen className="w-5 h-5" /> </Button>
</Button> ) : (
</Card>
) : (
<Card> <Card>
<CardHeader className="flex flex-row items-center justify-between pb-2"> <CardHeader className="flex flex-row items-center justify-between pb-2">
<CardTitle className="text-base">Filters</CardTitle> <CardTitle className="text-base">Filters</CardTitle>

View File

@@ -242,18 +242,16 @@ export default function Manufacturers() {
)} )}
> >
<div className="sticky top-24"> <div className="sticky top-24">
{sidebarCollapsed ? ( {sidebarCollapsed ? (
<Card className="p-2"> <Button
<Button variant="ghost"
variant="ghost" className="w-full"
className="w-full" onClick={() => setSidebarCollapsed(false)}
onClick={() => setSidebarCollapsed(false)} title="Show filters"
title="Show filters" >
> <PanelLeftOpen className="w-5 h-5" />
<PanelLeftOpen className="w-5 h-5" /> </Button>
</Button> ) : (
</Card>
) : (
<Card> <Card>
<CardHeader className="flex flex-row items-center justify-between pb-2"> <CardHeader className="flex flex-row items-center justify-between pb-2">
<CardTitle className="text-base">Filters</CardTitle> <CardTitle className="text-base">Filters</CardTitle>

View File

@@ -300,18 +300,16 @@ const Operators = () => {
)} )}
> >
<div className="sticky top-24"> <div className="sticky top-24">
{sidebarCollapsed ? ( {sidebarCollapsed ? (
<Card className="p-2"> <Button
<Button variant="ghost"
variant="ghost" className="w-full"
className="w-full" onClick={() => setSidebarCollapsed(false)}
onClick={() => setSidebarCollapsed(false)} title="Show filters"
title="Show filters" >
> <PanelLeftOpen className="w-5 h-5" />
<PanelLeftOpen className="w-5 h-5" /> </Button>
</Button> ) : (
</Card>
) : (
<Card> <Card>
<CardHeader className="flex flex-row items-center justify-between pb-2"> <CardHeader className="flex flex-row items-center justify-between pb-2">
<CardTitle className="text-base">Filters</CardTitle> <CardTitle className="text-base">Filters</CardTitle>

View File

@@ -500,23 +500,16 @@ export default function Parks() {
)} )}
> >
<div className="sticky top-24"> <div className="sticky top-24">
{sidebarCollapsed ? ( {sidebarCollapsed ? (
<Card className="p-2"> <Button
<Button variant="ghost"
variant="ghost" className="w-full"
className="w-full" onClick={() => setSidebarCollapsed(false)}
onClick={() => setSidebarCollapsed(false)} title="Show filters"
title="Show filters" >
> <PanelLeftOpen className="w-5 h-5" />
<PanelLeftOpen className="w-5 h-5" /> </Button>
</Button> ) : (
{activeFilterCount > 0 && (
<Badge variant="secondary" className="w-full mt-2 justify-center">
{activeFilterCount}
</Badge>
)}
</Card>
) : (
<Card> <Card>
<CardHeader className="flex flex-row items-center justify-between pb-2"> <CardHeader className="flex flex-row items-center justify-between pb-2">
<CardTitle className="text-base">Filters</CardTitle> <CardTitle className="text-base">Filters</CardTitle>

View File

@@ -250,18 +250,16 @@ export default function Rides() {
)} )}
> >
<div className="sticky top-24"> <div className="sticky top-24">
{sidebarCollapsed ? ( {sidebarCollapsed ? (
<Card className="p-2"> <Button
<Button variant="ghost"
variant="ghost" className="w-full"
className="w-full" onClick={() => setSidebarCollapsed(false)}
onClick={() => setSidebarCollapsed(false)} title="Show filters"
title="Show filters" >
> <PanelLeftOpen className="w-5 h-5" />
<PanelLeftOpen className="w-5 h-5" /> </Button>
</Button> ) : (
</Card>
) : (
<Card> <Card>
<CardHeader className="flex flex-row items-center justify-between pb-2"> <CardHeader className="flex flex-row items-center justify-between pb-2">
<CardTitle className="text-base">Filters</CardTitle> <CardTitle className="text-base">Filters</CardTitle>