From 7a3cde057511f7dff9303bac52f523bf651abde0 Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Tue, 24 Jun 2025 01:59:05 +0100
Subject: [PATCH] fix: resolve CSS global selector placement errors
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Fix :global() selector placement in nested SCSS
- Move nested selectors out to comply with Svelte CSS rules
- :global() can only be at start or end of selector, not middle

Fixes compilation error when viewing albums on public site

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 src/routes/photos/[slug]/+page.svelte | 37 ++++++++++++++-------------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/src/routes/photos/[slug]/+page.svelte b/src/routes/photos/[slug]/+page.svelte
index 14131d1..87fe1c5 100644
--- a/src/routes/photos/[slug]/+page.svelte
+++ b/src/routes/photos/[slug]/+page.svelte
@@ -390,11 +390,12 @@
 		:global(ol) {
 			margin: 0 0 $unit-3x;
 			padding-left: $unit-3x;
+		}
 
-			li {
-				margin-bottom: $unit;
-				line-height: 1.7;
-			}
+		:global(ul li),
+		:global(ol li) {
+			margin-bottom: $unit;
+			line-height: 1.7;
 		}
 
 		:global(blockquote) {
@@ -411,10 +412,10 @@
 			color: $red-60;
 			text-decoration: underline;
 			transition: color 0.2s ease;
+		}
 
-			&:hover {
-				color: $red-50;
-			}
+		:global(a:hover) {
+			color: $red-50;
 		}
 
 		:global(code) {
@@ -442,19 +443,19 @@
 		:global(figure) {
 			margin: $unit-4x 0;
 			text-align: center;
+		}
 
-			img {
-				max-width: 100%;
-				height: auto;
-				border-radius: $card-corner-radius;
-			}
+		:global(figure img) {
+			max-width: 100%;
+			height: auto;
+			border-radius: $card-corner-radius;
+		}
 
-			figcaption {
-				margin-top: $unit;
-				font-size: 0.875rem;
-				color: $grey-40;
-				line-height: 1.5;
-			}
+		:global(figure figcaption) {
+			margin-top: $unit;
+			font-size: 0.875rem;
+			color: $grey-40;
+			line-height: 1.5;
 		}
 
 		// Gallery styles