From 69488bb1bac95a670281eb6c23305bbd1941b29e Mon Sep 17 00:00:00 2001
From: Nico <Nico>
Date: Thu, 4 Jun 2026 06:41:12 -0700
Subject: [PATCH] fix: size mobile map actions for touch

---
 .../src/styles/pages/LocationMapManager.css   |  4 ++--
 frontend/tests/location-map-manager.spec.ts   | 21 ++++++++++++++++++-
 2 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/frontend/src/styles/pages/LocationMapManager.css b/frontend/src/styles/pages/LocationMapManager.css
index 0635f01..7c8ae10 100644
--- a/frontend/src/styles/pages/LocationMapManager.css
+++ b/frontend/src/styles/pages/LocationMapManager.css
@@ -500,7 +500,7 @@
 }
 
 .location-map-layer-reset {
-  min-height: 36px;
+  min-height: 40px;
   padding: 0.35rem 0.65rem;
   border: 1px solid var(--color-border-light);
   border-radius: 999px;
@@ -564,7 +564,7 @@
 
 .location-map-secondary-actions button {
   flex: 1 1 82px;
-  min-height: 38px;
+  min-height: 40px;
   padding: 0.45rem 0.58rem;
   background: rgba(21, 40, 59, 0.78);
   color: #dbeafe;
diff --git a/frontend/tests/location-map-manager.spec.ts b/frontend/tests/location-map-manager.spec.ts
index 3a74180..b427394 100644
--- a/frontend/tests/location-map-manager.spec.ts
+++ b/frontend/tests/location-map-manager.spec.ts
@@ -2628,6 +2628,22 @@ test("mobile editor uses bottom sheet controls instead of desktop object toolbar
   expect(secondaryActionBox).not.toBeNull();
   if (!primaryActionBox || !secondaryActionBox) throw new Error("Mobile action groups were not measurable");
   expect(primaryActionBox.y).toBeLessThan(secondaryActionBox.y);
+  const secondaryActionButtons = secondaryActions.getByRole("button");
+  const secondaryActionButtonCount = await secondaryActionButtons.count();
+  for (let index = 0; index < secondaryActionButtonCount; index += 1) {
+    const actionButtonBox = await secondaryActionButtons.nth(index).boundingBox();
+    expect(actionButtonBox).not.toBeNull();
+    if (!actionButtonBox) throw new Error("Mobile secondary action was not measurable");
+    expect(actionButtonBox.height).toBeGreaterThanOrEqual(40);
+  }
+  await page.getByRole("button", { name: "Layers" }).click();
+  await page.getByRole("button", { name: "Pins" }).click();
+  const resetLayersButtonBox = await page.getByRole("button", { name: "Reset layer filters" }).boundingBox();
+  expect(resetLayersButtonBox).not.toBeNull();
+  if (!resetLayersButtonBox) throw new Error("Mobile layer reset button was not measurable");
+  expect(resetLayersButtonBox.height).toBeGreaterThanOrEqual(40);
+  await page.getByRole("button", { name: "Reset layer filters" }).click();
+  await page.getByRole("button", { name: "Layers" }).click();
   await expect(page.locator(".location-map-pin")).toHaveCount(0);
 
   const canvasBox = await page.locator(".location-map-canvas-shell").boundingBox();
@@ -2659,15 +2675,18 @@ test("mobile editor uses bottom sheet controls instead of desktop object toolbar
   await expect(selectedSecondaryActions.getByRole("button", { name: "Preview Draft" })).toHaveCount(0);
   await expect(page.getByRole("button", { name: "Bought" })).toHaveCount(0);
   const selectedPrimaryBox = await selectedPrimaryActions.boundingBox();
+  const selectedSecondaryButtonBox = await selectedSecondaryActions.getByRole("button", { name: "Add Area" }).boundingBox();
   const labelBox = await labelInput.boundingBox();
   const firstFieldRowBox = await fieldRows.first().boundingBox();
   expect(selectedPrimaryBox).not.toBeNull();
+  expect(selectedSecondaryButtonBox).not.toBeNull();
   expect(labelBox).not.toBeNull();
   expect(firstFieldRowBox).not.toBeNull();
-  if (!selectedPrimaryBox || !labelBox || !firstFieldRowBox) {
+  if (!selectedPrimaryBox || !selectedSecondaryButtonBox || !labelBox || !firstFieldRowBox) {
     throw new Error("Selected object draft actions were not measurable");
   }
   expect(selectedPrimaryBox.y).toBeLessThan(labelBox.y);
+  expect(selectedSecondaryButtonBox.height).toBeGreaterThanOrEqual(40);
   expect(firstFieldRowBox.height).toBeLessThanOrEqual(54);
   await page.getByRole("button", { name: "View" }).click();
   await expect(page.getByRole("textbox", { name: "Label" })).toHaveCount(0);