From 374316944ecb2cebd5ba61dfde7435e3721caa07 Mon Sep 17 00:00:00 2001 From: Pen Anderson Date: Wed, 11 Mar 2026 10:04:30 -0500 Subject: [PATCH 1/4] Refactored inline styles. --- frontend/src/app.css | 6 +++ frontend/src/pages/Dashboard.svelte | 2 +- frontend/src/pages/Participants.svelte | 2 +- frontend/src/pages/ScheduleBoard.svelte | 4 +- frontend/src/pages/Settings.svelte | 53 ++++++++++++------------- frontend/src/pages/Users.svelte | 4 +- frontend/src/pages/Volunteers.svelte | 8 ++-- 7 files changed, 42 insertions(+), 37 deletions(-) diff --git a/frontend/src/app.css b/frontend/src/app.css index 70ec51c..0395a12 100644 --- a/frontend/src/app.css +++ b/frontend/src/app.css @@ -66,6 +66,9 @@ a:hover { color: var(--c-accent-h); } /* Cards */ .card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius-lg); padding: 1.25rem; } +.card + .card, .card + form, form + .card, form + form { margin-top: 1.5rem; } +.card-title { font-size: 0.95rem; font-weight: 700; margin-bottom: 1rem; } +.card-hint { font-size: 0.78rem; color: var(--c-muted); } /* Stats */ .stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; } @@ -106,6 +109,8 @@ input, select, textarea { input[type="checkbox"] { width: auto; } input:focus, select:focus, textarea:focus { outline: none; border-color: var(--c-accent); } input::placeholder { color: var(--c-muted); } +.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } +.form-grid .full { grid-column: 1 / -1; } .checkbox-label { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; cursor: pointer; } .checkbox-label-sm { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.82rem; cursor: pointer; color: var(--c-text); } @@ -131,6 +136,7 @@ tr:hover td { background: rgba(255,255,255,0.02); } padding: 0.18rem 0.55rem; border-radius: 99px; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; + margin-left: 0.3rem; } .badge-checked { background: rgba(34,197,94,0.15); color: var(--c-success); } .badge-confirmed { background: rgba(99,102,241,0.15); color: var(--c-accent-h); } diff --git a/frontend/src/pages/Dashboard.svelte b/frontend/src/pages/Dashboard.svelte index 9756b31..73800d6 100644 --- a/frontend/src/pages/Dashboard.svelte +++ b/frontend/src/pages/Dashboard.svelte @@ -160,7 +160,7 @@

Welcome, {session?.user?.preferred_name} - · {#each roles as r}{r}{/each} + · {#each roles as r}{r}{/each}

diff --git a/frontend/src/pages/Participants.svelte b/frontend/src/pages/Participants.svelte index 65eda24..0be1485 100644 --- a/frontend/src/pages/Participants.svelte +++ b/frontend/src/pages/Participants.svelte @@ -248,7 +248,7 @@ {#if showAdd && canManage}
-
+
diff --git a/frontend/src/pages/ScheduleBoard.svelte b/frontend/src/pages/ScheduleBoard.svelte index 6bea05e..a09bf0f 100644 --- a/frontend/src/pages/ScheduleBoard.svelte +++ b/frontend/src/pages/ScheduleBoard.svelte @@ -275,7 +275,7 @@ {#if showAdd && canManage}
-
+
-
+
@@ -192,7 +192,7 @@
-
+
@@ -211,11 +211,11 @@
-
-

SMTP Email

+
+

SMTP Email

-
-
+
+
@@ -243,22 +243,21 @@
- +
- -

Discourse SSO

-

+

Discourse SSO

+

Enable DiscourseConnect SSO so users can log in with their Discourse account. Set the same secret in your Discourse admin under Connect > discourse connect secret.

-
-
+
+
-
+
@@ -274,8 +273,8 @@ -
-

Test Email

+
+

Test Email

@@ -288,8 +287,8 @@
-
-

Volunteer Signup

+
+

Volunteer Signup

@@ -298,14 +297,14 @@ Note field is required -

+

Signup form: /volunteer-signup

-
-

Shift Signups

+
+

Shift Signups

Status: {shiftSignupsOpen ? 'Open' : 'Closed'} @@ -320,7 +319,7 @@
{#if !shiftSignupsOpen} -

+

Opening signups will email all confirmed volunteers their shift signup links.

{/if} @@ -328,8 +327,8 @@
-

Data Management

-

+

Data Management

+

Permanently delete all records of a given type. This cannot be undone.

diff --git a/frontend/src/pages/Users.svelte b/frontend/src/pages/Users.svelte index c1c3a58..e75364c 100644 --- a/frontend/src/pages/Users.svelte +++ b/frontend/src/pages/Users.svelte @@ -268,11 +268,11 @@ {u.preferred_name || u.email} {#if u.id === me} - you + you {/if}
{u.email} - {#each u.roles ?? [] as r}{roleLabel(r)}{/each} + {#each u.roles ?? [] as r}{roleLabel(r)}{/each} {deptNamesFor(u.department_ids || [])}
diff --git a/frontend/src/pages/Volunteers.svelte b/frontend/src/pages/Volunteers.svelte index fb92897..4bced77 100644 --- a/frontend/src/pages/Volunteers.svelte +++ b/frontend/src/pages/Volunteers.svelte @@ -181,7 +181,7 @@ {#if showAdd && canManage}
-
+
@@ -301,12 +301,12 @@ {v.name} {#if v.is_lead} - Co-Lead + Co-Lead {/if} {#if !v.participant_id} - No ticket + No ticket {:else if !participantHasTickets(v.participant_id)} - No ticket + No ticket {/if} {#if participant?.ticket_name && participant.ticket_name !== v.name}
Ticket: {participant.ticket_name}
From 6d4c49a223ece4c0dae2e74bc048b043e2b08571 Mon Sep 17 00:00:00 2001 From: Pen Anderson Date: Wed, 11 Mar 2026 10:22:54 -0500 Subject: [PATCH 2/4] Added autozoom fix. --- frontend/src/app.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/frontend/src/app.css b/frontend/src/app.css index 0395a12..546dc22 100644 --- a/frontend/src/app.css +++ b/frontend/src/app.css @@ -243,6 +243,7 @@ tr:hover td { background: rgba(255,255,255,0.02); } td { display: inline; padding: 0; border: none; } td:empty { display: none; } - /* Forms */ + /* Forms — 16px prevents iOS auto-zoom on focus */ + input, select, textarea { font-size: 16px; } .form-grid { grid-template-columns: 1fr !important; } } From d73a74965d2a04f432215dbd4065a81acb654944 Mon Sep 17 00:00:00 2001 From: Pen Anderson Date: Wed, 11 Mar 2026 10:31:50 -0500 Subject: [PATCH 3/4] Added datepicker fix. --- frontend/src/app.css | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend/src/app.css b/frontend/src/app.css index 546dc22..b61ed5e 100644 --- a/frontend/src/app.css +++ b/frontend/src/app.css @@ -107,6 +107,7 @@ input, select, textarea { transition: border-color var(--transition); } input[type="checkbox"] { width: auto; } +input[type="date"], input[type="time"], input[type="datetime-local"] { -webkit-appearance: none; appearance: none; min-height: 2.35rem; } input:focus, select:focus, textarea:focus { outline: none; border-color: var(--c-accent); } input::placeholder { color: var(--c-muted); } .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } From d64e93674e2960de61dc8968c5b8f742e67d548b Mon Sep 17 00:00:00 2001 From: Pen Anderson Date: Wed, 11 Mar 2026 12:26:33 -0500 Subject: [PATCH 4/4] Refactored styles. --- frontend/src/App.svelte | 1 + frontend/src/api.js | 4 +- frontend/src/app.css | 5 +- frontend/src/pages/Departments.svelte | 5 +- frontend/src/pages/Login.svelte | 6 ++- frontend/src/pages/ScheduleBoard.svelte | 64 +++++++++++++------------ frontend/src/pages/Settings.svelte | 15 ++++-- frontend/src/pages/Users.svelte | 2 +- frontend/src/pages/Volunteers.svelte | 7 ++- 9 files changed, 64 insertions(+), 45 deletions(-) diff --git a/frontend/src/App.svelte b/frontend/src/App.svelte index f680143..ac0957e 100644 --- a/frontend/src/App.svelte +++ b/frontend/src/App.svelte @@ -37,6 +37,7 @@ history.pushState(null, '', path) route = path mobileNavOpen = false + window.scrollTo(0, 0) } async function checkVersion() { diff --git a/frontend/src/api.js b/frontend/src/api.js index 31a517f..d15abc4 100644 --- a/frontend/src/api.js +++ b/frontend/src/api.js @@ -1,4 +1,4 @@ -import { db } from './db.js' +import { db, clearSession } from './db.js' async function getToken() { const session = await db.session.get(1) @@ -17,7 +17,7 @@ export async function apiFetch(path, options = {}) { const res = await fetch(path, { ...options, headers }) if (res.status === 401) { - await db.session.clear() + await clearSession() window.location.pathname = '/login' throw new Error('unauthorized') } diff --git a/frontend/src/app.css b/frontend/src/app.css index b61ed5e..3a685ae 100644 --- a/frontend/src/app.css +++ b/frontend/src/app.css @@ -111,6 +111,7 @@ input[type="date"], input[type="time"], input[type="datetime-local"] { -webkit-a input:focus, select:focus, textarea:focus { outline: none; border-color: var(--c-accent); } input::placeholder { color: var(--c-muted); } .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; } +.form-grid-3 { display: grid; grid-template-columns: 1fr 1fr auto; gap: 1rem; align-items: end; } .form-grid .full { grid-column: 1 / -1; } .checkbox-label { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; cursor: pointer; } .checkbox-label-sm { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.82rem; cursor: pointer; color: var(--c-text); } @@ -137,8 +138,8 @@ tr:hover td { background: rgba(255,255,255,0.02); } padding: 0.18rem 0.55rem; border-radius: 99px; font-size: 0.72rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; - margin-left: 0.3rem; } +* + .badge { margin-left: 0.3rem; } .badge-checked { background: rgba(34,197,94,0.15); color: var(--c-success); } .badge-confirmed { background: rgba(99,102,241,0.15); color: var(--c-accent-h); } .badge-registered { background: rgba(14,165,233,0.15); color: #0ea5e9; } @@ -246,5 +247,5 @@ tr:hover td { background: rgba(255,255,255,0.02); } /* Forms — 16px prevents iOS auto-zoom on focus */ input, select, textarea { font-size: 16px; } - .form-grid { grid-template-columns: 1fr !important; } + .form-grid, .form-grid-3 { grid-template-columns: 1fr !important; } } diff --git a/frontend/src/pages/Departments.svelte b/frontend/src/pages/Departments.svelte index 26164eb..863c4a1 100644 --- a/frontend/src/pages/Departments.svelte +++ b/frontend/src/pages/Departments.svelte @@ -101,7 +101,7 @@ {#if showAdd && canCreate}
-
+
@@ -112,7 +112,7 @@
- +
@@ -191,6 +191,7 @@