From b7223ecdc8ae07dea8ad02dfb52f540e1a2ea179 Mon Sep 17 00:00:00 2001
From: Jeremy Myers <inernestmusic@gmail.com>
Date: Fri, 12 Dec 2025 12:48:27 -0500
Subject: [PATCH] Fix minor layer inputs wrapping issue

---
 src/components/CollapsibleSection.tsx    | 45 ++++++++++++++----------
 src/components/styles/layer-selector.css |  3 +-
 2 files changed, 28 insertions(+), 20 deletions(-)

diff --git a/src/components/CollapsibleSection.tsx b/src/components/CollapsibleSection.tsx
index ab22f9e..e3ef094 100644
--- a/src/components/CollapsibleSection.tsx
+++ b/src/components/CollapsibleSection.tsx
@@ -43,25 +43,32 @@ function CollapsibleSection({
 
   if (expandedState.has(nodeId) || searchText.length > 0) {
     if ('band_id' in node) {
-      children = (node as BandResponse).layers.map((layer) => (
-        <label
-          key={'baselayer-label-' + layer.layer_id}
-          className="layer-selector-input-label"
-        >
-          <input
-            key={'baselayer-input-' + layer.layer_id}
-            type="radio"
-            id={String(layer.layer_id)}
-            value={layer.layer_id}
-            name="baselayer"
-            checked={layer.layer_id === activeBaselayerId}
-            onChange={() =>
-              onBaselayerChange(String(layer.layer_id), 'layerMenu')
-            }
-          />
-          {markMatchingSearchText(layer.name, matchedIds.has(layer.layer_id))}
-        </label>
-      ));
+      children = (
+        <div className="layer-inputs-container">
+          {(node as BandResponse).layers.map((layer) => (
+            <label
+              key={'baselayer-label-' + layer.layer_id}
+              className="layer-selector-input-label"
+            >
+              <input
+                key={'baselayer-input-' + layer.layer_id}
+                type="radio"
+                id={String(layer.layer_id)}
+                value={layer.layer_id}
+                name="baselayer"
+                checked={layer.layer_id === activeBaselayerId}
+                onChange={() =>
+                  onBaselayerChange(String(layer.layer_id), 'layerMenu')
+                }
+              />
+              {markMatchingSearchText(
+                layer.name,
+                matchedIds.has(layer.layer_id)
+              )}
+            </label>
+          ))}
+        </div>
+      );
     } else if ('map_id' in node) {
       children = (node as MapResponse).bands.map((band) => (
         <CollapsibleSection
diff --git a/src/components/styles/layer-selector.css b/src/components/styles/layer-selector.css
index dbf3972..6225208 100644
--- a/src/components/styles/layer-selector.css
+++ b/src/components/styles/layer-selector.css
@@ -148,7 +148,8 @@ input[type='radio']:disabled {
   margin-right: 15px;
 }
 
-.layer-selector-input-label:first-of-type {
+.layer-inputs-container {
+  margin: 0;
   margin-left: 10px;
 }