From d9d4c9b38aaac58f6c360eebbdf0e6de7ccc9464 Mon Sep 17 00:00:00 2001
From: Max Kohler <hello@maxkohler.com>
Date: Tue, 19 Aug 2025 11:24:15 +0200
Subject: [PATCH 1/2] Add story

---
 .../MapStyle/SWRDataLabLight.stories.svelte   | 46 +++++++++++++++++++
 1 file changed, 46 insertions(+)

diff --git a/components/src/maplibre/MapStyle/SWRDataLabLight.stories.svelte b/components/src/maplibre/MapStyle/SWRDataLabLight.stories.svelte
index 8d5cbe52..38f8c365 100644
--- a/components/src/maplibre/MapStyle/SWRDataLabLight.stories.svelte
+++ b/components/src/maplibre/MapStyle/SWRDataLabLight.stories.svelte
@@ -37,7 +37,53 @@
 		</div>
 	</DesignTokens>
 </Story>
+<Story asChild name="fix/122">
+	<DesignTokens>
+		<div class="grid">
+			<div class="container">
+				<Map
+					showDebug
+					style={SWRDataLabLight()}
+					initialLocation={{ lng: 10.941447898724618, lat: 50.84067324785988, zoom: 5.5, pitch: 0 }}
+				>
+					<VectorTileSource
+						id="demo-source"
+						url={`https://static.datenhub.net/data/p118_correctiv_waermewende/heating_merged.versatiles?tiles/{z}/{x}/{y}`}
+						attribution="Demo attribution"
+					/>
 
+					<VectorLayer
+						type="fill"
+						id="demo-10km"
+						sourceId="demo-source"
+						sourceLayer="heating_10km_squares"
+						placeBelow="street-residential"
+						minZoom={5}
+						paint={{
+							'fill-color': [
+								'match',
+								['get', 'dominant_source'],
+								'Gas',
+								'#CCDCFF',
+								'Heizoel',
+								'#5BCFE1',
+								'Holz_Holzpellets',
+								'#499F73',
+								'Fernwaerme',
+								'#A86C07',
+								'Strom',
+								'#FFD584',
+								'gray'
+							],
+							'fill-opacity': 1
+						}}
+					/>
+					<AttributionControl position="bottom-left" />
+				</Map>
+			</div>
+		</div>
+	</DesignTokens>
+</Story>
 <Story asChild name="fix/118">
 	<DesignTokens>
 		<div class="grid">

From a1266550533f7b59e03326b0ca9cb06918e9afbe Mon Sep 17 00:00:00 2001
From: Max Kohler <hello@maxkohler.com>
Date: Tue, 19 Aug 2025 11:35:11 +0200
Subject: [PATCH 2/2] Iterate labels

---
 .../MapStyle/components/PlaceLabels.ts        | 26 +++++++++----------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/components/src/maplibre/MapStyle/components/PlaceLabels.ts b/components/src/maplibre/MapStyle/components/PlaceLabels.ts
index b4acb849..04d4e1bf 100644
--- a/components/src/maplibre/MapStyle/components/PlaceLabels.ts
+++ b/components/src/maplibre/MapStyle/components/PlaceLabels.ts
@@ -164,13 +164,13 @@ export default function makePlaceLabels() {
 			layout: {
 				'text-size': {
 					stops: [
-						[7, 14],
-						[15, 20]
+						[7, 15],
+						[15, 21]
 					]
 				}
 			},
 			paint: {
-				'text-color': tokens.label_primary
+				'text-color': tokens.label_secondary
 			}
 		},
 		{
@@ -182,12 +182,12 @@ export default function makePlaceLabels() {
 				'text-size': {
 					stops: [
 						[7, 15],
-						[14, 23]
+						[15, 21]
 					]
 				}
 			},
 			paint: {
-				'text-color': tokens.label_primary
+				'text-color': tokens.label_secondary
 			}
 		}
 	].map((el) => {
@@ -198,7 +198,7 @@ export default function makePlaceLabels() {
 			'source-layer': 'place_labels',
 			layout: {
 				'text-font': tokens.sans_regular,
-				'text-letter-spacing': 0.035,
+				'text-letter-spacing': 0.05,
 				'text-field': '{name_de}',
 				...el.layout
 			},
@@ -206,8 +206,8 @@ export default function makePlaceLabels() {
 			paint: {
 				'text-color': tokens.label_secondary,
 				'text-halo-color': tokens.background,
-				'text-halo-width': 2.5,
-				'text-halo-blur': 0,
+				'text-halo-width': 2,
+				'text-halo-blur': 0.5,
 				...el.paint
 			}
 		} as SymbolLayerSpecification;
@@ -221,21 +221,21 @@ export default function makePlaceLabels() {
 			maxzoom: 8,
 			layout: {
 				'text-field': '{name_de}',
-				'text-letter-spacing': 0.0825,
+				'text-letter-spacing': 0.085,
 				'text-font': tokens.sans_regular,
 				'text-transform': 'uppercase',
 				'text-size': {
 					stops: [
-						[4, 10],
-						[7, 17]
+						[4, 11],
+						[7, 18]
 					]
 				}
 			},
 			paint: {
 				'text-color': tokens.label_tertiary,
 				'text-halo-color': tokens.background,
-				'text-halo-width': 2,
-				'text-halo-blur': 0
+				'text-halo-width': 2.5,
+				'text-halo-blur': 0.5
 			}
 		}
 	].map((el) => {