From 8d854b703e277697c6e224ab6f33a89e9faa559a Mon Sep 17 00:00:00 2001 From: Kyle Pope Date: Thu, 12 Mar 2026 13:59:15 +0800 Subject: [PATCH] Fix calendar view visual inconsistencies with glassmorphism FullCalendar backgrounds were opaque while the toolbar used semi-transparent glassmorphism cards, creating a patchy look. Now all FC elements match: - Page background: transparent (ambient shows through grid) - Column headers: semi-transparent (0.65 opacity) - Neutral background: semi-transparent (0.65 opacity) - More-popover: semi-transparent with backdrop blur Co-Authored-By: Claude Opus 4.6 --- frontend/src/index.css | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/frontend/src/index.css b/frontend/src/index.css index 2dd32db..83ce23f 100644 --- a/frontend/src/index.css +++ b/frontend/src/index.css @@ -93,8 +93,8 @@ --fc-event-bg-color: hsl(var(--accent-color)); --fc-event-border-color: hsl(var(--accent-color)); --fc-event-text-color: hsl(0 0% 98%); - --fc-page-bg-color: hsl(0 0% 3.9%); - --fc-neutral-bg-color: hsl(0 0% 8%); + --fc-page-bg-color: transparent; + --fc-neutral-bg-color: hsl(0 0% 8% / 0.65); --fc-neutral-text-color: hsl(0 0% 98%); --fc-list-event-hover-bg-color: hsl(0 0% 10%); --fc-today-bg-color: hsl(var(--accent-color) / 0.08); @@ -144,7 +144,7 @@ } .fc .fc-col-header-cell { - background-color: hsl(0 0% 8%); + background-color: hsl(0 0% 8% / 0.65); border-color: var(--fc-border-color); } @@ -195,7 +195,9 @@ /* ── FullCalendar "+more" popover fixes ── */ .fc .fc-more-popover { - background-color: hsl(0 0% 8%); + background-color: hsl(0 0% 8% / 0.85); + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px); border-color: hsl(0 0% 14.9%); border-radius: 0.5rem; min-width: 220px; @@ -203,7 +205,7 @@ } .fc .fc-more-popover .fc-popover-header { - background-color: hsl(0 0% 11%); + background-color: hsl(0 0% 11% / 0.8); color: hsl(0 0% 98%); padding: 8px 12px; border-radius: 0.5rem 0.5rem 0 0;