From 81188a4569a22d6bbab6a9e79e896481b1799ad0 Mon Sep 17 00:00:00 2001 From: Stijnvandenbroek Date: Fri, 6 Mar 2026 14:12:43 +0000 Subject: [PATCH] feat: improve website styling --- frontend/index.html | 6 ++++ frontend/src/main.tsx | 15 +++++--- frontend/src/views/CompareView.tsx | 56 +++++++++++++++++++++++------- 3 files changed, 59 insertions(+), 18 deletions(-) diff --git a/frontend/index.html b/frontend/index.html index 8bb1df2..b965c38 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -11,6 +11,12 @@ to { opacity: 1; transform: translateY(0); } } .animate-fade-in { animation: fadeIn 0.3s ease-out; } + + @keyframes slideInUp { + from { opacity: 0; transform: translateY(20px) scale(0.95); } + to { opacity: 1; transform: translateY(0) scale(1); } + } + .animate-slide-in-up { animation: slideInUp 0.35s cubic-bezier(0.21, 1.02, 0.73, 1) forwards; } diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx index 0f9d0e6..1ed17b8 100644 --- a/frontend/src/main.tsx +++ b/frontend/src/main.tsx @@ -13,8 +13,8 @@ function Nav() { className={({ isActive }) => `px-4 py-2 rounded-lg text-sm font-medium transition-colors ${ isActive - ? "bg-indigo-600 text-white" - : "text-slate-600 hover:bg-slate-200" + ? "bg-white/20 text-white shadow-sm backdrop-blur-sm" + : "text-indigo-100 hover:bg-white/10 hover:text-white" }` } > @@ -23,10 +23,15 @@ function Nav() { ); return ( -