fix(webui): tighten automation toolbar layout

This commit is contained in:
chengyongru
2026-06-16 00:42:25 +08:00
parent e6957de622
commit 8f1fe7337c
10 changed files with 35 additions and 33 deletions
+26 -24
View File
@@ -3477,42 +3477,44 @@ function AutomationsSettings({
return ( return (
<div className="space-y-4"> <div className="space-y-4">
<section className="rounded-[24px] border border-border/45 bg-card/80 p-3 shadow-[0_22px_70px_rgba(15,23,42,0.055)] backdrop-blur-xl"> <section className="rounded-[24px] border border-border/45 bg-card/80 p-3 shadow-[0_22px_70px_rgba(15,23,42,0.055)] backdrop-blur-xl sm:p-4">
<div className="flex flex-col gap-3 xl:flex-row xl:items-center xl:justify-between"> <div className="flex flex-col gap-3">
<div className="flex min-w-0 flex-wrap gap-1 rounded-[16px] bg-muted/50 p-1"> <div className="-mx-1 overflow-x-auto px-1 pb-0.5">
{summaryOptions.map((option) => ( <div className="inline-flex min-w-max items-center gap-1 rounded-[16px] bg-muted/50 p-1">
<button {summaryOptions.map((option) => (
key={option.value} <button
type="button" key={option.value}
onClick={() => onFilterChange(option.value)} type="button"
className={cn( onClick={() => onFilterChange(option.value)}
"inline-flex h-8 items-center gap-2 rounded-[12px] px-3 text-[12px] font-medium text-muted-foreground transition-colors", className={cn(
filter === option.value && "bg-background text-foreground shadow-sm", "inline-flex h-8 shrink-0 items-center gap-2 whitespace-nowrap rounded-[12px] px-3 text-[12px] font-medium text-muted-foreground transition-colors",
)} filter === option.value && "bg-background text-foreground shadow-sm",
> )}
<span>{option.label}</span> >
<span className="min-w-5 rounded-full bg-background/75 px-1.5 py-0.5 text-center text-[11px] tabular-nums text-muted-foreground"> <span>{option.label}</span>
{option.count} <span className="min-w-5 shrink-0 rounded-full bg-background/75 px-1.5 py-0.5 text-center text-[11px] tabular-nums text-muted-foreground">
</span> {option.count}
</button> </span>
))} </button>
))}
</div>
</div> </div>
<div className="flex min-w-0 flex-col gap-2 sm:flex-row sm:items-center sm:justify-end"> <div className="grid min-w-0 gap-2 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-center">
<div className="relative min-w-0 sm:w-[24rem]"> <div className="relative min-w-0">
<Search className="pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground/70" /> <Search className="pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground/70" />
<Input <Input
value={query} value={query}
onChange={(event) => onQueryChange(event.target.value)} onChange={(event) => onQueryChange(event.target.value)}
placeholder={tx("settings.automations.search", "Search automation, message, session, or cron expression")} placeholder={tx("settings.automations.search", "Search automations")}
className="h-9 rounded-[13px] border-border/45 bg-background/85 pl-9 text-[13px] shadow-sm" className="h-9 w-full rounded-[13px] border-border/45 bg-background/85 pl-9 text-[13px] shadow-sm"
/> />
</div> </div>
<DropdownMenu> <DropdownMenu>
<DropdownMenuTrigger asChild> <DropdownMenuTrigger asChild>
<button <button
type="button" type="button"
className="inline-flex h-9 items-center justify-center gap-1.5 rounded-[13px] border border-border/45 bg-background/85 px-3 text-[12px] font-medium text-muted-foreground shadow-sm transition-colors hover:bg-muted/70 hover:text-foreground" className="inline-flex h-9 min-w-[8.5rem] items-center justify-center gap-1.5 whitespace-nowrap rounded-[13px] border border-border/45 bg-background/85 px-3 text-[12px] font-medium text-muted-foreground shadow-sm transition-colors hover:bg-muted/70 hover:text-foreground sm:w-auto"
> >
<ArrowUpDown className="h-3.5 w-3.5" aria-hidden /> <ArrowUpDown className="h-3.5 w-3.5" aria-hidden />
<span>{sortLabel[sort]}</span> <span>{sortLabel[sort]}</span>
+1 -1
View File
@@ -493,7 +493,7 @@
"updated": "Updated", "updated": "Updated",
"name": "Name" "name": "Name"
}, },
"search": "Search automation, message, session, or cron expression", "search": "Search automations",
"queue": "Queue", "queue": "Queue",
"loading": "Loading automations...", "loading": "Loading automations...",
"noMatches": "No automations match this view.", "noMatches": "No automations match this view.",
+1 -1
View File
@@ -493,7 +493,7 @@
"updated": "Actualizada", "updated": "Actualizada",
"name": "Nombre" "name": "Nombre"
}, },
"search": "Buscar tarea, mensaje, sesión o expresión cron", "search": "Buscar automatizaciones",
"queue": "Cola", "queue": "Cola",
"loading": "Cargando automatizaciones...", "loading": "Cargando automatizaciones...",
"noMatches": "No hay automatizaciones que coincidan con esta vista.", "noMatches": "No hay automatizaciones que coincidan con esta vista.",
+1 -1
View File
@@ -493,7 +493,7 @@
"updated": "Mise à jour", "updated": "Mise à jour",
"name": "Nom" "name": "Nom"
}, },
"search": "Rechercher une tâche, un message, une session ou une expression cron", "search": "Rechercher des automatisations",
"queue": "File", "queue": "File",
"loading": "Chargement des automatisations...", "loading": "Chargement des automatisations...",
"noMatches": "Aucune automatisation ne correspond à cette vue.", "noMatches": "Aucune automatisation ne correspond à cette vue.",
+1 -1
View File
@@ -493,7 +493,7 @@
"updated": "Diperbarui", "updated": "Diperbarui",
"name": "Nama" "name": "Nama"
}, },
"search": "Cari tugas, pesan, sesi, atau ekspresi cron", "search": "Cari otomatisasi",
"queue": "Antrean", "queue": "Antrean",
"loading": "Memuat otomasi...", "loading": "Memuat otomasi...",
"noMatches": "Tidak ada otomasi yang cocok dengan tampilan ini.", "noMatches": "Tidak ada otomasi yang cocok dengan tampilan ini.",
+1 -1
View File
@@ -493,7 +493,7 @@
"updated": "更新日時", "updated": "更新日時",
"name": "名前" "name": "名前"
}, },
"search": "タスク、メッセージ、セッション、cron 式を検索", "search": "自動化を検索",
"queue": "キュー", "queue": "キュー",
"loading": "自動タスクを読み込み中...", "loading": "自動タスクを読み込み中...",
"noMatches": "この表示に一致する自動タスクはありません。", "noMatches": "この表示に一致する自動タスクはありません。",
+1 -1
View File
@@ -493,7 +493,7 @@
"updated": "업데이트", "updated": "업데이트",
"name": "이름" "name": "이름"
}, },
"search": "작업, 메시지, 세션 또는 cron 식 검색", "search": "자동화 검색",
"queue": "대기열", "queue": "대기열",
"loading": "자동화를 불러오는 중...", "loading": "자동화를 불러오는 중...",
"noMatches": "이 보기와 일치하는 자동화가 없습니다.", "noMatches": "이 보기와 일치하는 자동화가 없습니다.",
+1 -1
View File
@@ -493,7 +493,7 @@
"updated": "Đã cập nhật", "updated": "Đã cập nhật",
"name": "Tên" "name": "Tên"
}, },
"search": "Tìm tác vụ, tin nhắn, phiên hoặc biểu thức cron", "search": "Tìm tự động hóa",
"queue": "Hàng đợi", "queue": "Hàng đợi",
"loading": "Đang tải tự động hóa...", "loading": "Đang tải tự động hóa...",
"noMatches": "Không có tự động hóa phù hợp với chế độ xem này.", "noMatches": "Không có tự động hóa phù hợp với chế độ xem này.",
+1 -1
View File
@@ -493,7 +493,7 @@
"updated": "更新时间", "updated": "更新时间",
"name": "名称" "name": "名称"
}, },
"search": "搜索任务、消息、会话或 cron 表达式", "search": "搜索自动任务",
"queue": "任务队列", "queue": "任务队列",
"loading": "正在加载自动任务...", "loading": "正在加载自动任务...",
"noMatches": "当前视图没有匹配的自动任务。", "noMatches": "当前视图没有匹配的自动任务。",
+1 -1
View File
@@ -493,7 +493,7 @@
"updated": "更新時間", "updated": "更新時間",
"name": "名稱" "name": "名稱"
}, },
"search": "搜尋任務、訊息、會話或 cron 表達式", "search": "搜尋自動任務",
"queue": "任務佇列", "queue": "任務佇列",
"loading": "正在載入自動任務...", "loading": "正在載入自動任務...",
"noMatches": "目前檢視沒有符合的自動任務。", "noMatches": "目前檢視沒有符合的自動任務。",