style: enhance UI aesthetics with vibrant glows, solid cards, hover lift animations, and active nav styling

This commit is contained in:
Hitonabi
2026-06-25 23:02:31 +02:00
parent f1e0503c73
commit 8d5885d683
6 changed files with 123 additions and 21 deletions
+5 -2
View File
@@ -53,8 +53,11 @@ export default function App() {
return (
<div className="flex h-full relative">
{/* Background Aurora Ambient Effects */}
<div className="fixed inset-0 -z-50 pointer-events-none overflow-hidden bg-[hsl(222,24%,7%)]">
<div className="absolute inset-0 opacity-25 animate-aurora bg-gradient-to-tr from-teal-500/15 via-indigo-500/10 to-purple-500/15 blur-[120px]" />
<div className="fixed inset-0 -z-50 pointer-events-none overflow-hidden bg-[hsl(224,30%,6%)]">
<div className="absolute inset-0 opacity-35 animate-aurora bg-gradient-to-tr from-teal-500/20 via-indigo-500/15 to-purple-500/20 blur-[130px]" />
<div className="absolute top-[-10%] left-[-10%] h-[50%] w-[50%] rounded-full bg-teal-500/15 blur-[160px]" />
<div className="absolute bottom-[-10%] right-[-10%] h-[50%] w-[50%] rounded-full bg-purple-500/15 blur-[160px]" />
<div className="absolute top-[30%] right-[20%] h-[40%] w-[40%] rounded-full bg-indigo-500/10 blur-[140px]" />
</div>
<CommandPalette onNavigate={setView} />