From 54af21477fab4142c8f43cae5425e43d4f1976f0 Mon Sep 17 00:00:00 2001
From: dvirlabs <dvirlabs@gmail.com>
Date: Sun, 1 Mar 2026 19:20:47 +0200
Subject: [PATCH] ui: theme-aware stat boxes on event cards + event name title
 in guest list

---
 frontend/src/components/EventList.css | 11 ++++++++---
 frontend/src/components/GuestList.css | 14 ++++++++++++++
 frontend/src/components/GuestList.jsx |  7 ++++++-
 3 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/EventList.css b/frontend/src/components/EventList.css
index b797577..872d3c7 100644
--- a/frontend/src/components/EventList.css
+++ b/frontend/src/components/EventList.css
@@ -138,19 +138,24 @@
   display: flex;
   flex-direction: column;
   align-items: center;
+  background: var(--color-background-tertiary);
+  border: 1px solid var(--color-border);
+  border-radius: 8px;
+  padding: 0.5rem 0.25rem;
 }
 
 .stat-label {
-  font-size: 0.8rem;
+  font-size: 0.75rem;
   color: var(--color-text-secondary);
   text-transform: uppercase;
   margin-bottom: 0.25rem;
+  text-align: center;
 }
 
 .stat-value {
-  font-size: 1.5rem;
+  font-size: 1.4rem;
   font-weight: bold;
-  color: var(--color-primary);
+  color: var(--color-text);
 }
 
 .event-card-actions {
diff --git a/frontend/src/components/GuestList.css b/frontend/src/components/GuestList.css
index d6e2551..bedf483 100644
--- a/frontend/src/components/GuestList.css
+++ b/frontend/src/components/GuestList.css
@@ -45,7 +45,21 @@
   margin: 0;
   color: var(--color-text);
   font-size: 1.8rem;
+}
+
+.header-title {
   flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 0.15rem;
+}
+
+.header-event-name {
+  font-size: 1rem;
+  color: var(--color-primary);
+  font-weight: 600;
+  letter-spacing: 0.01em;
 }
 
 .header-actions {
diff --git a/frontend/src/components/GuestList.jsx b/frontend/src/components/GuestList.jsx
index ef3fc64..b698426 100644
--- a/frontend/src/components/GuestList.jsx
+++ b/frontend/src/components/GuestList.jsx
@@ -330,7 +330,12 @@ function GuestList({ eventId, onBack, onShowMembers }) {
     <div className="guest-list-container">
       <div className="guest-list-header">
         <button className="btn-back" onClick={onBack}>{he.backToEvents}</button>
-        <h2>{he.guestManagement}</h2>
+        <div className="header-title">
+          <h2>{he.guestManagement}</h2>
+          {eventData?.name && (
+            <span className="header-event-name">{eventData.name}</span>
+          )}
+        </div>
         <div className="header-actions">
           {/* <button className="btn-members" onClick={onShowMembers}>
             {he.manageMembers}