From 7b03827d3a453cb42bd17dc6b17204b9f9a61087 Mon Sep 17 00:00:00 2001
From: Vixalie <vixalie@outlook.com>
Date: Mon, 28 Jul 2025 08:34:28 +0800
Subject: [PATCH] =?UTF-8?q?refactor(Layout):=20=E4=BC=98=E5=8C=96=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=E7=BB=84=E4=BB=B6=E5=B9=B6=E6=B7=BB=E5=8A=A0=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E6=A1=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 移除了 WindowDragHandle 组件
- 调整了 NavigateLink 组件的样式
- 重构了 Layout 组件的 header，添加了搜索框和按钮
- 优化了内容区域的样式
---
 src/Layout.tsx | 24 ++++++++++--------------
 1 file changed, 10 insertions(+), 14 deletions(-)

diff --git a/src/Layout.tsx b/src/Layout.tsx
index fae8e2c..252ebfa 100644
--- a/src/Layout.tsx
+++ b/src/Layout.tsx
@@ -1,15 +1,6 @@
 import { Icon } from '@iconify-icon/solid';
 import { A } from '@solidjs/router';
-import { Component, ParentComponent } from 'solid-js';
-import { Portal } from 'solid-js/web';
-
-const WindowDragHandle: Component = () => {
-  return (
-    <Portal>
-      <div class="fixed inset-x-0 top-0 h-8 z-10" data-tauri-drag-region />
-    </Portal>
-  );
-};
+import { ParentComponent } from 'solid-js';
 
 interface NavigationLinkProps {
   href: string;
@@ -20,7 +11,7 @@ const NavigateLink: ParentComponent<NavigationLinkProps> = (props) => {
     <A
       href={props.href}
       class="hover:text-primary-hover"
-      activeClass="text-primary-active"
+      activeClass="text-primary-focus"
       inactiveClass="text-on-surface">
       <div class="flex flex-col justify-center items-center gap-2">{props.children}</div>
     </A>
@@ -30,9 +21,15 @@ const NavigateLink: ParentComponent<NavigationLinkProps> = (props) => {
 const Layout: ParentComponent = (props) => {
   return (
     <main class="flex flex-col items-stretch gap-0 size-full">
-      <header class="h-8 flex flex-row items-center pl-18 py-4">
+      <header class="flex flex-row items-center py-2 px-4">
         <span class="z-20 text-title-lg italic">ComfyUI Resources</span>
         <div class="grow" />
+        <div class="flex flex-row items-stretch">
+          <input type="text" readOnly class="bg-swatch-neutral-40" />
+          <button class="icon">
+            <Icon icon="tabler:folder-open" class="text-[14px] stroke-1" />
+          </button>
+        </div>
       </header>
       <div class="flex flex-row items-stretch gap-0 grow overflow-hidden">
         <nav class="flex flex-col items-center gap-6 overflow-hidden w-24 py-4">
@@ -57,9 +54,8 @@ const Layout: ParentComponent = (props) => {
             <span class="text-body-sm">Settings</span>
           </NavigateLink>
         </nav>
-        <div class="grow overflow-hidden">{props.children}</div>
+        <div class="grow overflow-hidden p-2">{props.children}</div>
       </div>
-      <WindowDragHandle />
     </main>
   );
 };