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",
button {
class: if rebuilding() {
"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]"
} 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 |_| {
rebuilding.set(true);
rebuild_result.set(None);
spawn(async move {
match rebuild_content_html(false).await {
Ok(count) => {
rebuild_result.set(Some(format!("已重建 {count} 篇文章")));
div { class: "group relative",
button {
class: if rebuilding() {
"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]"
} 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 |_| {
rebuilding.set(true);
rebuild_result.set(None);
spawn(async move {
match rebuild_content_html(false).await {
Ok(count) => {
rebuild_result.set(Some(format!("已重建 {count} 篇文章")));
}
Err(e) => {
rebuild_result.set(Some(format!("失败: {e}")));
}
}
Err(e) => {
rebuild_result.set(Some(format!("失败: {e}")));
}
}
rebuilding.set(false);
});
},
if rebuilding() { "重建中..." } else { "重建内容" }
rebuilding.set(false);
});
},
if rebuilding() { "重建中..." } else { "重建内容" }
}
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 为空的文章渲染缓存"
}
}
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",