Grayscale/nanobot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(webui): improve visual consistency (#5249)

Browse Source
This commit is contained in:
chengyongru
2026-08-05 13:24:45 +08:00
committed by GitHub
parent a54d5d14cb
commit 9098ffd38f
33 changed files with 578 additions and 646 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webui/src/components/settings/channels/ChannelSetupPanel.tsx
+11 -11
View File
@@ -80,7 +80,7 @@ export function ChannelCatalogRow({
aria-pressed={selected}
onClick={onSelect}
className={cn(
"group flex w-full min-w-0 items-center gap-3 rounded-[14px] border border-transparent px-3 py-3 text-left transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border/80",
"group flex w-full min-w-0 items-center gap-3 rounded-[14px] px-3 py-3 text-left transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-border/80",
selected ? "bg-background" : "hover:bg-muted",
)}
>
@@ -194,7 +194,7 @@ export function ChannelSetupPanel({
<Button
type="button"
size="sm"
variant="outline"
variant="secondary"
disabled={enableBusy}
onClick={() => onAction("enable", feature.name)}
className="mt-2 h-8 rounded-full px-3 text-[12px] font-semibold"
@@ -396,13 +396,13 @@ function ChannelSetupSurface({
return (
<form
className="mt-5 overflow-hidden rounded-[16px] bg-background/55"
className="mt-5 space-y-5"
onSubmit={(event) => {
event.preventDefault();
if (mode === "credentials") void saveCredentialSettings();
}}
>
<section className="px-4 py-4">
<section>
<div className="flex flex-wrap items-center justify-between gap-2">
<div className="text-[13px] font-semibold text-foreground">
{tx("settings.channels.requiredSetup", "Required setup")}
@@ -444,8 +444,8 @@ function ChannelSetupSurface({
<Button
type="button"
size="sm"
variant="outline"
className="h-8 rounded-full border-border/65 bg-background/80 px-3 text-[12px] font-semibold hover:bg-muted/70"
variant="secondary"
className="h-8 rounded-full bg-background/80 px-3 text-[12px] font-semibold hover:bg-background"
onClick={() =>
setNotice(
tx(
@@ -461,7 +461,7 @@ function ChannelSetupSurface({
<Button
type="button"
size="sm"
variant="outline"
variant="secondary"
className="h-8 rounded-full px-3 text-[12px] font-semibold"
onClick={copyCommand}
>
@@ -498,8 +498,8 @@ function ChannelSetupSurface({
<Button
type="submit"
size="sm"
variant="outline"
className="h-8 rounded-full border-border/65 bg-background/80 px-3 text-[12px] font-semibold hover:bg-muted/70"
variant="secondary"
className="h-8 rounded-full bg-background/80 px-3 text-[12px] font-semibold hover:bg-background"
disabled={saving}
>
{saving || validating ? (
@@ -527,7 +527,7 @@ function ChannelSetupSurface({
{notice ? (
<div
role="status"
className="border-t border-border/60 px-4 py-3 text-[12px] leading-5 text-muted-foreground"
className="rounded-[12px] bg-muted/55 px-3 py-2.5 text-[12px] leading-5 text-muted-foreground"
>
{notice}
</div>
@@ -540,7 +540,7 @@ function ChannelSetupSurface({
{validation?.checks.length ? <ChannelValidationChecks validation={validation} /> : null}
{hasAdvanced ? (
<details className="group border-t border-border/60 px-4 py-3 text-[12px] leading-5 text-muted-foreground">
<details className="group text-[12px] leading-5 text-muted-foreground">
<summary className="cursor-pointer list-none text-[12px] font-semibold text-foreground">
<span className="inline-flex items-center gap-1.5">
{tx("settings.channels.advanced", "Advanced")}