From d2dbb1d8e6d4417494b374e6418cd5a2d1d7da42 Mon Sep 17 00:00:00 2001
From: you <you@example.com>
Date: Sat, 21 Mar 2026 08:24:36 +0000
Subject: [PATCH] fix: region dropdown matches btn-icon style, says 'All
 Regions'

- border-radius 6px (rectangle) instead of 16px (pill)
- Same padding/font-size as btn-icon
- Removed redundant 'Region:' label from dropdown mode
- Default label: 'All Regions' instead of 'All'
---
 public/index.html       | 4 ++--
 public/region-filter.js | 7 +++----
 public/style.css        | 6 +++---
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/public/index.html b/public/index.html
index 27674a5a..23ba6603 100644
--- a/public/index.html
+++ b/public/index.html
@@ -22,7 +22,7 @@
   <meta name="twitter:title" content="MeshCore Analyzer">
   <meta name="twitter:description" content="Real-time MeshCore LoRa mesh network analyzer — live packet visualization, node tracking, channel decryption, and route analysis.">
   <meta name="twitter:image" content="https://raw.githubusercontent.com/Kpa-clawbot/meshcore-analyzer/master/public/og-image.png">
-  <link rel="stylesheet" href="style.css?v=1774354800">
+  <link rel="stylesheet" href="style.css?v=1774355100">
   <link rel="stylesheet" href="home.css">
   <link rel="stylesheet" href="live.css?v=1774058575">
   <link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"
@@ -80,7 +80,7 @@
 
   <script src="vendor/qrcode.js"></script>
   <script src="roles.js?v=1774290000"></script>
-  <script src="region-filter.js?v=1774354500"></script>
+  <script src="region-filter.js?v=1774355100"></script>
   <script src="app.js?v=1774052279"></script>
   <script src="home.js?v=1774042199"></script>
   <script src="packets.js?v=1774354500"></script>
diff --git a/public/region-filter.js b/public/region-filter.js
index c072240c..40eb75fe 100644
--- a/public/region-filter.js
+++ b/public/region-filter.js
@@ -87,11 +87,11 @@
 
   /** Build summary label for dropdown trigger */
   function dropdownLabel(codes) {
-    if (!_selected) return 'All';
+    if (!_selected) return 'All Regions';
     var sel = Array.from(_selected);
-    if (sel.length === 0) return 'All';
+    if (sel.length === 0) return 'All Regions';
     if (sel.length <= 2) return sel.map(function (c) { return _regions[c] || c; }).join(', ');
-    return sel.length + ' selected';
+    return sel.length + ' Regions';
   }
 
   /** Render pill bar mode (≤4 regions) */
@@ -121,7 +121,6 @@
   function renderDropdown(container, codes) {
     var allSelected = !_selected;
     var html = '<div class="region-dropdown-wrap" role="group" aria-label="Region filter">';
-    html += '<span class="region-filter-label">Region:</span>';
     html += '<button class="region-dropdown-trigger" aria-haspopup="listbox" aria-expanded="false">' +
       dropdownLabel(codes) + ' ▾</button>';
     html += '<div class="region-dropdown-menu" role="listbox" aria-label="Select regions" hidden>';
diff --git a/public/style.css b/public/style.css
index 988ad65d..19a8c9ec 100644
--- a/public/style.css
+++ b/public/style.css
@@ -1467,9 +1467,9 @@ tr[data-hops]:hover { background: rgba(59,130,246,0.1); }
 }
 .region-dropdown-wrap { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 8px 0; }
 .region-dropdown-trigger {
-  display: inline-flex; align-items: center; padding: 4px 12px; border-radius: 16px;
-  font-size: 12px; font-weight: 500; cursor: pointer; border: 1.5px solid var(--border);
-  background: transparent; color: var(--text); transition: all 0.15s;
+  display: inline-flex; align-items: center; padding: 6px 10px; border-radius: 6px;
+  font-size: 14px; font-weight: 500; cursor: pointer; border: 1px solid var(--border);
+  background: none; color: var(--text); transition: all 0.15s;
 }
 .region-dropdown-trigger:hover { border-color: var(--accent); color: var(--accent); }
 .region-dropdown-menu {