From 9f377d5d01dbbb4a78b8ba8b217b9ebc8982027f Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Thu, 18 Dec 2025 00:52:15 -0800
Subject: [PATCH] Unify page styling in gw-events database pages

---
 .../(app)/database/gw-events/+page.svelte     |  2 +-
 .../database/gw-events/[id]/+page.svelte      |  6 ++++--
 .../database/gw-events/[id]/edit/+page.svelte | 17 ++++++----------
 .../(app)/database/gw-events/new/+page.svelte | 20 ++++++-------------
 4 files changed, 17 insertions(+), 28 deletions(-)

diff --git a/src/routes/(app)/database/gw-events/+page.svelte b/src/routes/(app)/database/gw-events/+page.svelte
index 3407e150..340025d6 100644
--- a/src/routes/(app)/database/gw-events/+page.svelte
+++ b/src/routes/(app)/database/gw-events/+page.svelte
@@ -141,7 +141,7 @@
 	@use '$src/themes/typography' as typography;
 
 	.page {
-		padding: spacing.$unit-2x 0;
+		padding: 0;
 		margin: 0 auto;
 	}
 
diff --git a/src/routes/(app)/database/gw-events/[id]/+page.svelte b/src/routes/(app)/database/gw-events/[id]/+page.svelte
index 8e18f723..c40e814f 100644
--- a/src/routes/(app)/database/gw-events/[id]/+page.svelte
+++ b/src/routes/(app)/database/gw-events/[id]/+page.svelte
@@ -118,14 +118,16 @@
 
 <style lang="scss">
 	@use '$src/themes/colors' as colors;
+	@use '$src/themes/effects' as effects;
 	@use '$src/themes/layout' as layout;
 	@use '$src/themes/spacing' as spacing;
 	@use '$src/themes/typography' as typography;
 
 	.page {
 		background: white;
-		border-radius: layout.$card-corner;
-		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+		border: 0.5px solid rgba(0, 0, 0, 0.18);
+		border-radius: layout.$page-corner;
+		box-shadow: effects.$page-elevation;
 	}
 
 	.loading-state,
diff --git a/src/routes/(app)/database/gw-events/[id]/edit/+page.svelte b/src/routes/(app)/database/gw-events/[id]/edit/+page.svelte
index 27d9b8bc..f8929b51 100644
--- a/src/routes/(app)/database/gw-events/[id]/edit/+page.svelte
+++ b/src/routes/(app)/database/gw-events/[id]/edit/+page.svelte
@@ -67,9 +67,7 @@
 
 	// Validation
 	const canSave = $derived(
-		editData.eventNumber > 0 &&
-		editData.startDate !== '' &&
-		editData.endDate !== ''
+		editData.eventNumber > 0 && editData.startDate !== '' && editData.endDate !== ''
 	)
 
 	// Save changes
@@ -116,12 +114,7 @@
 				<Button variant="secondary" size="small" onclick={handleCancel}>Cancel</Button>
 			{/snippet}
 			{#snippet rightAccessory()}
-				<Button
-					variant="primary"
-					size="small"
-					onclick={handleSave}
-					disabled={!canSave || isSaving}
-				>
+				<Button variant="primary" size="small" onclick={handleSave} disabled={!canSave || isSaving}>
 					{isSaving ? 'Saving...' : 'Save'}
 				</Button>
 			{/snippet}
@@ -175,14 +168,16 @@
 
 <style lang="scss">
 	@use '$src/themes/colors' as colors;
+	@use '$src/themes/effects' as effects;
 	@use '$src/themes/layout' as layout;
 	@use '$src/themes/spacing' as spacing;
 	@use '$src/themes/typography' as typography;
 
 	.page {
 		background: white;
-		border-radius: layout.$card-corner;
-		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+		border: 0.5px solid rgba(0, 0, 0, 0.18);
+		border-radius: layout.$page-corner;
+		box-shadow: effects.$page-elevation;
 	}
 
 	.loading-state {
diff --git a/src/routes/(app)/database/gw-events/new/+page.svelte b/src/routes/(app)/database/gw-events/new/+page.svelte
index ff96c799..da80f282 100644
--- a/src/routes/(app)/database/gw-events/new/+page.svelte
+++ b/src/routes/(app)/database/gw-events/new/+page.svelte
@@ -109,32 +109,24 @@
 				type="select"
 				options={elementOptions}
 			/>
-			<DetailItem
-				label="Start date"
-				bind:value={editData.startDate}
-				editable={true}
-				type="date"
-			/>
-			<DetailItem
-				label="End date"
-				bind:value={editData.endDate}
-				editable={true}
-				type="date"
-			/>
+			<DetailItem label="Start date" bind:value={editData.startDate} editable={true} type="date" />
+			<DetailItem label="End date" bind:value={editData.endDate} editable={true} type="date" />
 		</DetailsContainer>
 	</section>
 </div>
 
 <style lang="scss">
 	@use '$src/themes/colors' as colors;
+	@use '$src/themes/effects' as effects;
 	@use '$src/themes/layout' as layout;
 	@use '$src/themes/spacing' as spacing;
 	@use '$src/themes/typography' as typography;
 
 	.page {
 		background: white;
-		border-radius: layout.$card-corner;
-		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+		border: 0.5px solid rgba(0, 0, 0, 0.18);
+		border-radius: layout.$page-corner;
+		box-shadow: effects.$page-elevation;
 	}
 
 	.error-banner {