feat(admin): add tooltip to rebuild content button

Pure CSS tooltip appears on hover, inverted color scheme
(white-on-dark / dark-on-light) matching admin aesthetic.
This commit is contained in:
xfy 2026-06-12 10:50:18 +08:00
parent 67e23d672c
commit c62cf5a239

View File

@ -61,29 +61,34 @@ pub fn PostsPage(page: i32) -> Element {
"文章管理" "文章管理"
} }
div { class: "flex items-center gap-3", div { class: "flex items-center gap-3",
button { div { class: "group relative",
class: if rebuilding() { button {
"px-4 py-2 rounded-full text-sm font-medium cursor-not-allowed text-gray-400 dark:text-[#666] border border-gray-300 dark:border-[#444]" class: if rebuilding() {
} else { "px-4 py-2 rounded-full text-sm font-medium cursor-not-allowed text-gray-400 dark:text-[#666] border border-gray-300 dark:border-[#444]"
"px-4 py-2 rounded-full text-sm font-medium cursor-pointer text-gray-700 dark:text-[#b0b0b1] border border-gray-300 dark:border-[#444] hover:border-gray-900 dark:hover:border-[#dadadb] hover:text-gray-900 dark:hover:text-[#dadadb] transition-all" } else {
}, "px-4 py-2 rounded-full text-sm font-medium cursor-pointer text-gray-700 dark:text-[#b0b0b1] border border-gray-300 dark:border-[#444] hover:border-gray-900 dark:hover:border-[#dadadb] hover:text-gray-900 dark:hover:text-[#dadadb] transition-all"
disabled: rebuilding(), },
onclick: move |_| { disabled: rebuilding(),
rebuilding.set(true); onclick: move |_| {
rebuild_result.set(None); rebuilding.set(true);
spawn(async move { rebuild_result.set(None);
match rebuild_content_html(false).await { spawn(async move {
Ok(count) => { match rebuild_content_html(false).await {
rebuild_result.set(Some(format!("已重建 {count} 篇文章"))); Ok(count) => {
rebuild_result.set(Some(format!("已重建 {count} 篇文章")));
}
Err(e) => {
rebuild_result.set(Some(format!("失败: {e}")));
}
} }
Err(e) => { rebuilding.set(false);
rebuild_result.set(Some(format!("失败: {e}"))); });
} },
} if rebuilding() { "重建中..." } else { "重建内容" }
rebuilding.set(false); }
}); div { class: "pointer-events-none absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-3 py-1.5 text-xs font-medium whitespace-nowrap rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 bg-gray-900 dark:bg-white text-white dark:text-gray-900 shadow-lg",
}, "重建 content_html 为空的文章渲染缓存"
if rebuilding() { "重建中..." } else { "重建内容" } }
} }
Link { Link {
class: "px-4 py-2 bg-gray-900 dark:bg-[#dadadb] text-white dark:text-gray-900 rounded-full text-sm font-medium hover:opacity-80 transition-opacity cursor-pointer", class: "px-4 py-2 bg-gray-900 dark:bg-[#dadadb] text-white dark:text-gray-900 rounded-full text-sm font-medium hover:opacity-80 transition-opacity cursor-pointer",