From 3831d1af01773ac678e3969e71b847aab56dbd86 Mon Sep 17 00:00:00 2001 From: xfy Date: Fri, 17 Jul 2026 10:28:39 +0800 Subject: [PATCH] =?UTF-8?q?feat(header):=20=E6=90=9C=E7=B4=A2=E5=85=A5?= =?UTF-8?q?=E5=8F=A3=E6=94=B9=E4=B8=BA=E5=9B=BE=E6=A0=87=E6=8C=89=E9=92=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 将前台 Header 文本导航中的「搜索」项移除，改在 Header 右侧（主题切换按钮 左边）以放大镜图标 Link 呈现。样式与 ThemeToggle 对齐（圆形 padding、 currentColor 图标），适配明暗主题。 - nav.rs: 导航项列表去掉 Search，更新文档注释 - header.rs: 新增 SearchIconLink 组件（SVG 内联，fill=currentColor） - frontend_layout.rs: right_content 在 ThemeToggle 前插入 SearchIconLink --- ...24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg | 1 + src/components/frontend_layout.rs | 3 ++- src/components/header.rs | 27 +++++++++++++++++++ src/components/nav.rs | 8 ++---- 4 files changed, 32 insertions(+), 7 deletions(-) create mode 100644 public/icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg diff --git a/public/icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg b/public/icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg new file mode 100644 index 0000000..b78a3fe --- /dev/null +++ b/public/icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/frontend_layout.rs b/src/components/frontend_layout.rs index 3b9ec2a..15c1462 100644 --- a/src/components/frontend_layout.rs +++ b/src/components/frontend_layout.rs @@ -6,7 +6,7 @@ use dioxus::prelude::*; use crate::components::footer::Footer; -use crate::components::header::Header; +use crate::components::header::{Header, SearchIconLink}; use crate::components::nav::use_nav_items; use crate::components::skeletons::archive_skeleton::ArchiveSkeleton; use crate::components::skeletons::delayed_skeleton::DelayedSkeleton; @@ -56,6 +56,7 @@ pub fn FrontendLayout() -> Element { max_width: "max-w-4xl", nav_items, right_content: rsx! { + SearchIconLink {} ThemeToggle {} }, } diff --git a/src/components/header.rs b/src/components/header.rs index 1726d5e..91b7501 100644 --- a/src/components/header.rs +++ b/src/components/header.rs @@ -170,3 +170,30 @@ fn MobileNavItem( } } } + +/// 搜索图标链接：置于 Header 右侧（主题切换左边），点击跳转搜索页。 +/// +/// 样式与 `ThemeToggle` 对齐（圆形 padding + currentColor 图标），保持右侧 +/// 图标组视觉一致。SVG 来自 `public/icons/search_24dp_E3E3E3_FILL0_wght400_GRAD0_opsz24.svg`， +/// 改用 `fill: "currentColor"` 以适配明暗主题。 +#[component] +pub fn SearchIconLink() -> Element { + rsx! { + Link { + class: "p-2 rounded-full text-paper-secondary hover:text-paper-accent transition-colors duration-200", + to: Route::Search {}, + aria_label: "搜索", + title: "搜索", + svg { + xmlns: "http://www.w3.org/2000/svg", + height: "24px", + view_box: "0 -960 960 960", + width: "24px", + fill: "currentColor", + path { + d: "M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z", + } + } + } + } +} diff --git a/src/components/nav.rs b/src/components/nav.rs index 68e2a35..34ea133 100644 --- a/src/components/nav.rs +++ b/src/components/nav.rs @@ -10,7 +10,8 @@ use crate::router::Route; /// 参数： /// - `route`：当前路由 /// -/// 返回：包含首页、归档、标签、搜索、关于的导航配置数组。 +/// 返回：包含首页、归档、标签、关于的导航配置数组。 +/// 搜索以图标形式置于 Header 右侧（主题切换左边），不在此文本导航中。 pub fn use_nav_items(route: Route) -> Vec { vec![ NavItemConfig { @@ -28,11 +29,6 @@ pub fn use_nav_items(route: Route) -> Vec { label: "标签", is_active: matches!(route, Route::Tags {}) || matches!(route, Route::TagDetail { .. }), }, - NavItemConfig { - route: Route::Search {}, - label: "搜索", - is_active: matches!(route, Route::Search {}), - }, NavItemConfig { route: Route::About {}, label: "关于",