[优化] 界面优化

atsf_server/web/features/performance/components/performance-page.tsx

@@ -762,7 +762,6 @@ export function PerformancePage() {
                             </ResourceField>
                             <ToggleField
                                 label="multi_accept"
-                                description=""
                                 tooltip={performanceFieldTooltips.multi_accept}
                                 checked={performanceFields.OpenRestyEventsMultiAcceptEnabled}
                                 onChange={(checked) =>

atsf_server/web/features/shared/components/resource-primitives.tsx

@@ -180,13 +180,13 @@ export function ToggleField({
         onChange={(event) => onChange(event.target.checked)}
         className="mt-1 h-4 w-4 rounded border-[var(--border-default)] accent-[var(--brand-primary)]"
       />
-      <span className="space-y-1">
+      <span className="flex flex-col">
         <span className="flex items-center gap-2 text-sm font-medium text-[var(--foreground-primary)]">
           <span>{label}</span>
           {tooltip ? <FieldTooltip content={tooltip} /> : null}
         </span>
         {description ? (
-          <span className="block text-xs leading-5 text-[var(--foreground-secondary)]">
+          <span className="mt-1 block text-xs leading-5 text-[var(--foreground-secondary)]">
             {description}
           </span>
         ) : null}

atsf_server/web/features/websites/components/website-detail-page.tsx

@@ -12,17 +12,9 @@ import { LoadingState } from '@/components/feedback/loading-state';
 import {PageHeader} from '@/components/layout/page-header';
 import {AppCard} from '@/components/ui/app-card';
 import {StatusBadge} from '@/components/ui/status-badge';
-import {
+import {deleteManagedDomain, getManagedDomains,} from '@/features/managed-domains/api/managed-domains';
-  deleteManagedDomain,
+import {getProxyRoutes,} from '@/features/proxy-routes/api/proxy-routes';
-  getManagedDomains,
+import {deleteTlsCertificate, getTlsCertificates,} from '@/features/tls-certificates/api/tls-certificates';
-} from '@/features/managed-domains/api/managed-domains';
-import {
-  getProxyRoutes,
-} from '@/features/proxy-routes/api/proxy-routes';
-import {
-  deleteTlsCertificate,
-  getTlsCertificates,
-} from '@/features/tls-certificates/api/tls-certificates';
 import {CertificateDetailModal} from '@/features/websites/components/certificate-detail-modal';
 import {CertificateEditorModal} from '@/features/websites/components/certificate-editor-modal';
 import {CertificateImportModal} from '@/features/websites/components/certificate-import-modal';
@@ -34,11 +26,7 @@ import {
     getMatchTypeMeta,
     isRouteRelatedToManagedDomain,
 } from '@/features/websites/utils';
-import {
+import {DangerButton, PrimaryButton, SecondaryButton,} from '@/features/shared/components/resource-primitives';
-  DangerButton,
-  PrimaryButton,
-  SecondaryButton,
-} from '@/features/shared/components/resource-primitives';
 import {formatDateTime} from '@/lib/utils/date';
 
 type FeedbackState = {
@@ -290,7 +278,8 @@ export function WebsiteDetailPage({ websiteId }: { websiteId: string }) {
                 <div className="grid gap-6 xl:grid-cols-[1.05fr_0.95fr]">
                     <AppCard title="网站信息" description="当前网站的基础配置与托管信息。">
                         <div className="grid gap-4 md:grid-cols-2">
-              <div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
+                            <div
+                                className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
                                 <p className="text-xs uppercase tracking-[0.18em] text-[var(--foreground-muted)]">
                                     域名
                                 </p>
@@ -298,7 +287,8 @@ export function WebsiteDetailPage({ websiteId }: { websiteId: string }) {
                                     {website.domain}
                                 </p>
                             </div>
-              <div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
+                            <div
+                                className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
                                 <p className="text-xs uppercase tracking-[0.18em] text-[var(--foreground-muted)]">
                                     创建时间
                                 </p>
@@ -306,7 +296,8 @@ export function WebsiteDetailPage({ websiteId }: { websiteId: string }) {
                                     {formatDateTime(website.created_at)}
                                 </p>
                             </div>
-              <div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4 md:col-span-2">
+                            <div
+                                className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4 md:col-span-2">
                                 <p className="text-xs uppercase tracking-[0.18em] text-[var(--foreground-muted)]">
                                     备注
                                 </p>
@@ -316,18 +307,9 @@ export function WebsiteDetailPage({ websiteId }: { websiteId: string }) {
                             </div>
                         </div>
                     </AppCard>
-
                     <AppCard
                         title="证书信息"
                         description="当前网站绑定的默认证书信息。若还没有证书，可直接添加后回填。"
-            action={
-              <PrimaryButton
-                type="button"
-                onClick={() => setIsCertificateImportOpen(true)}
-              >
-                添加
-              </PrimaryButton>
-            }
                     >
                         {certificate ? (
                             <div className="space-y-4">
@@ -343,20 +325,13 @@ export function WebsiteDetailPage({ websiteId }: { websiteId: string }) {
                                     <p>到期时间：{formatDateTime(certificate.not_after)}</p>
                                     <p>备注：{certificate.remark || '暂无备注'}</p>
                                 </div>
-                <div className="flex flex-wrap gap-2">
+                                <div className="flex flex-wrap gap-3">
                                     <SecondaryButton
                                         type="button"
                                         onClick={() => setIsCertificateDetailOpen(true)}
                                     >
                                         查看
                                     </SecondaryButton>
-                  <SecondaryButton
-                    type="button"
-                    onClick={() => setIsCertificateEditorOpen(true)}
-                  >
-                    编辑
-                  </SecondaryButton>
-                </div>
                                     <DangerButton
                                         type="button"
                                         onClick={handleDeleteCertificate}
@@ -365,6 +340,7 @@ export function WebsiteDetailPage({ websiteId }: { websiteId: string }) {
                                         删除
                                     </DangerButton>
                                 </div>
+                            </div>
                         ) : (
                             <EmptyState
                                 title="未绑定证书"

atsf_server/web/features/websites/components/websites-page.tsx

@@ -119,7 +119,7 @@ export function WebsitesPage() {
 
         <AppCard
           title="网站列表"
-          description="查看网站绑定的证书、启用状态和更新时间。进入详情页可继续查看关联规则并编辑网站。"
+          description="查看网站绑定的证书、启用状态和更新时间。"
         >
           {managedDomainsQuery.isLoading ? (
             <LoadingState />
@@ -181,7 +181,7 @@ export function WebsitesPage() {
                         </div>
                       </div>
 
-                      <div className="flex flex-col gap-2">
+                      <div className="flex flex-row gap-2">
                         <Link
                           href={`/website/detail?id=${domain.id}`}
                           className="inline-flex items-center justify-center rounded-2xl border border-[var(--border-default)] bg-[var(--control-background)] px-4 py-3 text-sm font-medium text-[var(--foreground-primary)] transition hover:bg-[var(--control-background-hover)]"