From a7aab01f051487327e5ce52b6a8905208c546e8c Mon Sep 17 00:00:00 2001
From: "Somhairle H. Marisol" <muqiu-han@outlook.com>
Date: Fri, 18 Sep 2026 15:49:44 +0800
Subject: [变更性质] feat(frontend) [新增功能] 12 页面组件全量
 shadcn：Card/Button/Table/Tabs/Select/Alert；375 底部 Tab Bar 改用 Tabs
 组件实现 [实现方案] 页面级手写 class
 全部移除（.btn/.banner/table.data/.badge/.tabs/.metric-row/.m-tile/.hint
 等改为 shadcn + tailwind
 工具类）；Modal/DatasetWizard/DatasetCard/DiffView/CodeEditor/Status/Layout
 同步 [影响范围] src/pages/*.svelte、src/components/*.svelte
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/Page.svelte | 22 ++++------------------
 1 file changed, 4 insertions(+), 18 deletions(-)

(limited to 'frontend/src/components/Page.svelte')

diff --git a/frontend/src/components/Page.svelte b/frontend/src/components/Page.svelte
index a9549bb..22aa78e 100644
--- a/frontend/src/components/Page.svelte
+++ b/frontend/src/components/Page.svelte
@@ -11,27 +11,13 @@
   let { title, subtitle, actions, children, wide }: Props = $props();
 </script>
 
-<header class="page-head">
+<header class="flex flex-wrap justify-between items-start gap-4 mb-4">
   <div>
-    <h1>{title}</h1>
-    {#if subtitle}<p class="hint">{subtitle}</p>{/if}
+    <h1 class="text-xl font-semibold">{title}</h1>
+    {#if subtitle}<p class="text-sm text-muted-foreground mt-0.5">{subtitle}</p>{/if}
   </div>
   {#if actions}{@render actions?.()}{/if}
 </header>
-<div class="page-body" class:wide>
+<div class={wide ? '' : 'max-w-3xl'}>
   {@render children?.()}
 </div>
-
-<style>
-  .page-head {
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start;
-    gap: 1rem;
-    margin-bottom: 1.1rem;
-    flex-wrap: wrap;
-  }
-  .page-head .hint { margin-top: 0.2rem; }
-  .page-body { max-width: 780px; }
-  .page-body.wide { max-width: none; }
-</style>
-- 
cgit v1.2.3