From 36c901fa29ff8e90cc4e2aa5de03031da3519f03 Mon Sep 17 00:00:00 2001 From: XxFran10xX Date: Sun, 27 Sep 2026 17:57:28 +0000 Subject: [PATCH] Draw large settlement icons at 90 map pixels. The 120px tier was still larger than the settlements next to it. Co-authored-by: Cursor --- frontend/app/lib/map/chronicleGifFrame.test.ts | 4 ++-- frontend/app/lib/mapMarkers.test.ts | 6 +++--- frontend/app/lib/mapMarkers.ts | 3 +-- frontend/app/lib/settlementMarkers.test.ts | 5 ++--- 4 files changed, 8 insertions(+), 10 deletions(-) diff --git a/frontend/app/lib/map/chronicleGifFrame.test.ts b/frontend/app/lib/map/chronicleGifFrame.test.ts index 47e8dfe5..da32abae 100644 --- a/frontend/app/lib/map/chronicleGifFrame.test.ts +++ b/frontend/app/lib/map/chronicleGifFrame.test.ts @@ -102,14 +102,14 @@ describe("chronicleGifMarkerLayout", () => { expect(layout.iconY + layout.iconSize / 2).toBeCloseTo(540); }); - it("scales a large settlement bigger than a small one", () => { + it("draws a large settlement icon at 90 map pixels", () => { const t = chronicleGifTransform(MAP, MAP, 1080); const small = chronicleGifMarkerLayout(t, marker())!; const large = chronicleGifMarkerLayout( t, marker({ markerSize: "large" }) )!; - expect(large.iconSize).toBeGreaterThan(small.iconSize); + expect(large.iconSize).toBeCloseTo(small.iconSize * (90 / 100)); expect(large.fontSize).toBeGreaterThan(small.fontSize); }); diff --git a/frontend/app/lib/mapMarkers.test.ts b/frontend/app/lib/mapMarkers.test.ts index eb2349fd..877bd9f4 100644 --- a/frontend/app/lib/mapMarkers.test.ts +++ b/frontend/app/lib/mapMarkers.test.ts @@ -46,10 +46,10 @@ describe("mapMarkers", () => { expect(resolveMarkerImageSrc("battle", "small")).toBe("/battle.png"); }); - it("draws a large settlement icon at 75% of the original 160px", () => { + it("draws a large settlement icon at 90px", () => { const layout = markerLayout(100, 200, "large", "settlement"); - expect(layout.iconSize).toBe(120); - expect(layout.size).toBe(120); + expect(layout.iconSize).toBe(90); + expect(layout.size).toBe(90); }); it("markerLayout centers icon on map coords", () => { diff --git a/frontend/app/lib/mapMarkers.ts b/frontend/app/lib/mapMarkers.ts index f0511a15..c455adb9 100644 --- a/frontend/app/lib/mapMarkers.ts +++ b/frontend/app/lib/mapMarkers.ts @@ -8,8 +8,7 @@ export const MARKER_HOVER_TRANSITION = "transform 150ms ease-out"; export const MARKER_VISIBILITY_TRANSITION = "opacity 200ms ease-out"; export const MARKER_SMALL_PX = 100; -/** 75% of the original 160px large settlement icon. */ -export const MARKER_LARGE_PX = 120; +export const MARKER_LARGE_PX = 90; export const MARKER_LABEL_FONT_SMALL = 48; export const MARKER_LABEL_FONT_LARGE = 72; export const MARKER_LABEL_GAP = 2; diff --git a/frontend/app/lib/settlementMarkers.test.ts b/frontend/app/lib/settlementMarkers.test.ts index 0b63b426..155fd014 100644 --- a/frontend/app/lib/settlementMarkers.test.ts +++ b/frontend/app/lib/settlementMarkers.test.ts @@ -32,9 +32,8 @@ describe("settlementMarkers", () => { it("markerDimensions returns tier sizes", () => { expect(markerDimensions("large").fontSize).toBe(SETTLEMENT_LABEL_FONT_LARGE); - expect(markerDimensions("small").size).toBeLessThan( - markerDimensions("large").size - ); + expect(markerDimensions("large").size).toBe(90); + expect(markerDimensions("small").size).toBe(100); }); it("shouldShowSettlementMarker gates on screen font size", () => {