feat: improve app ui and project metadata

apps/web/components/style/RefineView.tsx

@@ -1,9 +1,12 @@
 "use client";
 
-import { useRefine } from "@/lib/style/useRefine";
+import { CheckCircle2, X } from "lucide-react";
 import { useEffect } from "react";
 
 import { ThinkingIndicator } from "@/components/ThinkingIndicator";
+import { Button } from "@/components/ui/Button";
+import { Badge } from "@/components/ui/Badge";
+import { useRefine } from "@/lib/style/useRefine";
 
 interface RefineViewProps {
   projectId: string;
@@ -46,15 +49,17 @@ export function RefineView({
         <button
           type="button"
           onClick={onClose}
-          className="text-ink-soft hover:text-cinnabar"
+          className="rounded border border-transparent p-1 text-ink-soft hover:border-line hover:text-cinnabar"
           aria-label="关闭回炉对比"
         >
-          ✕
+          <X className="h-4 w-4" aria-hidden="true" />
         </button>
       </div>
 
       {segment.trim().length === 0 ? (
-        <p className="text-overdue">该段在终稿中为空，请先在终稿中保留该段正文。</p>
+        <Badge variant="warning">
+          该段在终稿中为空，请先在终稿中保留该段正文。
+        </Badge>
       ) : refiner.status === "refining" ? (
         <p className="text-info">
           <ThinkingIndicator label="回炉中" />
@@ -76,24 +81,21 @@ export function RefineView({
             </p>
           </div>
           <div className="flex gap-2">
-            <button
-              type="button"
+            <Button
               onClick={() => {
                 if (refiner.result) {
                   onAdopt(refiner.result.original, refiner.result.refined);
                 }
               }}
-              className="rounded bg-cinnabar px-3 py-1.5 text-panel hover:opacity-90"
+              variant="primary"
+              size="sm"
             >
+              <CheckCircle2 className="h-4 w-4" aria-hidden="true" />
               采纳合入正文
-            </button>
-            <button
-              type="button"
-              onClick={onClose}
-              className="rounded border border-line px-3 py-1.5 text-ink hover:border-cinnabar"
-            >
+            </Button>
+            <Button onClick={onClose} variant="secondary" size="sm">
               放弃
-            </button>
+            </Button>
           </div>
         </div>
       ) : null}