dvirlabs/invy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui: event name as main header title + fix stat box background color

Browse Source
This commit is contained in:
dvirlabs 2026-03-01 19:29:42 +02:00
parent 54af21477f
commit e589792137
3 changed files with 26 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/EventList.css
View File

@ -138,7 +138,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
background: var(--color-background-tertiary); background: var(--color-background);
border: 1px solid var(--color-border); border: 1px solid var(--color-border);
border-radius: 8px; border-radius: 8px;
padding: 0.5rem 0.25rem; padding: 0.5rem 0.25rem;

20
frontend/src/components/GuestList.css
View File

@ -47,19 +47,35 @@
font-size: 1.8rem; font-size: 1.8rem;
} }
.header-event-title {
margin: 0;
color: var(--color-text);
font-size: 1.8rem;
font-weight: 700;
line-height: 1.2;
}
.header-event-subtitle {
font-size: 0.85rem;
color: var(--color-text-secondary);
font-weight: 500;
letter-spacing: 0.03em;
text-transform: uppercase;
}
.header-title { .header-title {
flex: 1; flex: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
gap: 0.15rem; gap: 0.1rem;
} }
/* keep old .header-event-name as fallback */
.header-event-name { .header-event-name {
font-size: 1rem; font-size: 1rem;
color: var(--color-primary); color: var(--color-primary);
font-weight: 600; font-weight: 600;
letter-spacing: 0.01em;
} }
.header-actions { .header-actions {

10
frontend/src/components/GuestList.jsx
View File

@ -331,9 +331,13 @@ function GuestList({ eventId, onBack, onShowMembers }) {
<div className="guest-list-header"> <div className="guest-list-header">
<button className="btn-back" onClick={onBack}>{he.backToEvents}</button> <button className="btn-back" onClick={onBack}>{he.backToEvents}</button>
<div className="header-title"> <div className="header-title">
<h2>{he.guestManagement}</h2> {eventData?.name ? (
{eventData?.name && ( <>
<span className="header-event-name">{eventData.name}</span> <h2 className="header-event-title">{eventData.name}</h2>
<span className="header-event-subtitle">{he.guestManagement}</span>
</>
) : (
<h2>{he.guestManagement}</h2>
)} )}
</div> </div>
<div className="header-actions"> <div className="header-actions">