fix(components): improve components design and user experience

This commit is contained in:
2026-03-15 02:01:54 +08:00
parent 49e1f0080f
commit a35426c5c8
6 changed files with 55 additions and 38 deletions

View File

@@ -104,7 +104,7 @@ export function Navbar() {
return (
<>
<header className="border-b border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 px-8 py-6 flex items-center justify-between transition-colors">
<header className="sticky top-0 z-50 border-b border-slate-200/80 dark:border-slate-800/80 bg-white/70 dark:bg-slate-900/70 backdrop-blur-md px-8 py-6 flex items-center justify-between transition-colors">
<div
className="flex items-center gap-2 cursor-pointer"
onClick={() => navigate("/")}
@@ -196,7 +196,7 @@ export function Navbar() {
</header>
{showLogoutModal && (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-black/50 px-4" onClick={() => setShowLogoutModal(false)}>
<div className="fixed inset-0 z-60 flex items-center justify-center bg-black/50 px-4" onClick={() => setShowLogoutModal(false)}>
<div className="w-full max-w-sm rounded-lg bg-white p-6 shadow-lg dark:bg-slate-900 border dark:border-slate-800" onClick={(e) => e.stopPropagation()}>
<h2 className="mb-2 text-lg font-bold text-slate-900 dark:text-white">
{t.confirmLogoutTitle || "Confirm Logout"}
@@ -210,7 +210,7 @@ export function Navbar() {
onClick={() => setShowLogoutModal(false)}
className="dark:text-white"
>
{t.cancel || "Cancel"}
{t.actions?.cancel || "Cancel"}
</Button>
<Button
variant="destructive"