kevin/baron-sso
1
0
Fork 0
forked from baron/baron-sso
Code Pull Requests Activity

style: move search bar to header in list pages

Browse Source 
- Align search bar and filters with the title and subtitle in UserListPage and TenantListPage by moving them to the CardHeader.
This commit is contained in:
조찬영
2026-05-06 14:49:03 +09:00
parent 6d05bb212b
commit 71de98e0d9
2 changed files with 11 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
adminfront/src/features/tenants/routes/TenantListPage.tsx
View File

@@ -474,7 +474,7 @@ function TenantListPage() {
</header> </header>
<Card className="bg-[var(--color-panel)] flex-1 flex flex-col min-h-0 overflow-hidden"> <Card className="bg-[var(--color-panel)] flex-1 flex flex-col min-h-0 overflow-hidden">
<CardHeader className="flex flex-row items-center justify-between flex-shrink-0"> <CardHeader className="flex flex-wrap items-end justify-between gap-4 flex-shrink-0">
<div> <div>
<CardTitle> <CardTitle>
{t("ui.admin.tenants.registry.title", "Tenant Registry")} {t("ui.admin.tenants.registry.title", "Tenant Registry")}
@@ -485,9 +485,8 @@ function TenantListPage() {
})} })}
</CardDescription> </CardDescription>
</div> </div>
</CardHeader>
<CardContent className="flex-1 flex flex-col min-h-0 pt-0"> <div className="flex items-end gap-4">
<div className="mb-6 flex flex-wrap items-end gap-4 flex-shrink-0">
<div className="relative flex-1 min-w-[240px] max-w-sm"> <div className="relative flex-1 min-w-[240px] max-w-sm">
<label className="text-xs font-medium text-muted-foreground mb-1.5 block"> <label className="text-xs font-medium text-muted-foreground mb-1.5 block">
{t("ui.admin.tenants.list.search_label", "테넌트 검색")} {t("ui.admin.tenants.list.search_label", "테넌트 검색")}
@@ -506,6 +505,8 @@ function TenantListPage() {
</div> </div>
</div> </div>
</div> </div>
</CardHeader>
<CardContent className="flex-1 flex flex-col min-h-0 pt-0">
{(errorMsg || fallbackError) && ( {(errorMsg || fallbackError) && (
<div className="mb-4 rounded-lg border border-destructive/40 bg-destructive/10 px-3 py-2 text-sm text-destructive flex-shrink-0"> <div className="mb-4 rounded-lg border border-destructive/40 bg-destructive/10 px-3 py-2 text-sm text-destructive flex-shrink-0">

11
adminfront/src/features/users/UserListPage.tsx
View File

@@ -465,10 +465,10 @@ function UserListPage() {
</header> </header>
<Card className="flex-1 flex flex-col min-h-0 bg-[var(--color-panel)] overflow-hidden"> <Card className="flex-1 flex flex-col min-h-0 bg-[var(--color-panel)] overflow-hidden">
<CardHeader className="flex flex-row items-center justify-between flex-shrink-0"> <CardHeader className="flex flex-wrap items-end justify-between gap-4 flex-shrink-0">
<div> <div>
<CardTitle> <CardTitle>
{t("ui.admin.users.list.registry.title", "User Registry")} {t("ui.admin.users.list.registry.title", "사용자 레지스트리")}
</CardTitle> </CardTitle>
<CardDescription> <CardDescription>
{t( {t(
@@ -478,9 +478,8 @@ function UserListPage() {
)} )}
</CardDescription> </CardDescription>
</div> </div>
</CardHeader>
<CardContent className="flex-1 flex flex-col min-h-0 pt-0"> <div className="flex items-end gap-4">
<div className="mb-6 flex flex-wrap items-end gap-4 flex-shrink-0">
<div className="relative flex-1 min-w-[240px] max-w-sm"> <div className="relative flex-1 min-w-[240px] max-w-sm">
<label className="text-xs font-medium text-muted-foreground mb-1.5 block"> <label className="text-xs font-medium text-muted-foreground mb-1.5 block">
{t("ui.admin.users.list.search_label", "사용자 검색")} {t("ui.admin.users.list.search_label", "사용자 검색")}
@@ -530,6 +529,8 @@ function UserListPage() {
{t("ui.common.search", "검색")} {t("ui.common.search", "검색")}
</Button> </Button>
</div> </div>
</CardHeader>
<CardContent className="flex-1 flex flex-col min-h-0 pt-0">
{(errorMsg || fallbackError) && ( {(errorMsg || fallbackError) && (
<div className="mb-4 rounded-lg border border-destructive/40 bg-destructive/10 px-3 py-2 text-sm text-destructive flex-shrink-0"> <div className="mb-4 rounded-lg border border-destructive/40 bg-destructive/10 px-3 py-2 text-sm text-destructive flex-shrink-0">