From 8b94c5e0bd8f7c707819755ecff160de7fc16e9c Mon Sep 17 00:00:00 2001
From: Stan Grams <sjg@haxx.space>
Date: Sun, 1 Mar 2026 20:03:57 +0100
Subject: [PATCH] [feat](trx-frontend-http): move bookmark axis between
 waterfall and waveform

Relocate #spectrum-bookmark-axis from inside .spectrum-wrap to the
flex gap between .overview-strip (waterfall) and #spectrum-panel
(waveform). Give it z-index:5 so labels sit above the signal-overlay-
canvas (BW/freq selector, z-index:4). Drop the now-unneeded
#spectrum-freq-axis.bm-axis-open border-radius hack and the
corresponding JS class toggle.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Signed-off-by: Stan Grams <sjg@haxx.space>
---
 .../trx-frontend/trx-frontend-http/assets/web/app.js   |  2 --
 .../trx-frontend-http/assets/web/index.html            |  2 +-
 .../trx-frontend-http/assets/web/style.css             | 10 +++-------
 3 files changed, 4 insertions(+), 10 deletions(-)

diff --git a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
index 010d8e3..29ae983 100644
--- a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
+++ b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/app.js
@@ -4295,7 +4295,6 @@ function drawSpectrum(data) {
 
 function updateBookmarkAxis(range) {
   const axisEl = document.getElementById("spectrum-bookmark-axis");
-  const freqAxisEl = document.getElementById("spectrum-freq-axis");
   if (!axisEl) return;
 
   const _bmRef = typeof bmList !== "undefined" ? bmList : null;
@@ -4305,7 +4304,6 @@ function updateBookmarkAxis(range) {
 
   const hasVisible = visBookmarks.length > 0;
   axisEl.classList.toggle("bm-axis-visible", hasVisible);
-  if (freqAxisEl) freqAxisEl.classList.toggle("bm-axis-open", hasVisible);
 
   if (!hasVisible) {
     if (axisEl.dataset.bmKey) { axisEl.innerHTML = ""; axisEl.dataset.bmKey = ""; }
diff --git a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html
index 25872cc..e8a7cb6 100644
--- a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html
+++ b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/index.html
@@ -78,12 +78,12 @@
         <div id="rds-ps-overlay" aria-live="polite" aria-label="RDS station name"></div>
         <div id="aprs-bar-overlay" aria-live="polite" aria-label="Recent APRS frames"></div>
       </div>
+      <div id="spectrum-bookmark-axis"></div>
       <div id="spectrum-panel" style="display:none;">
         <div class="spectrum-wrap">
           <canvas id="spectrum-canvas"></canvas>
           <div id="spectrum-tooltip"></div>
           <div id="spectrum-freq-axis"></div>
-          <div id="spectrum-bookmark-axis"></div>
         </div>
         <div id="spectrum-controls">
           <div id="spectrum-bw-row">
diff --git a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
index fb4987e..22939e7 100644
--- a/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
+++ b/src/trx-client/trx-frontend/trx-frontend-http/assets/web/style.css
@@ -1516,20 +1516,16 @@ button:focus-visible, input:focus-visible, select:focus-visible {
   top: 2px;
   font-weight: 700;
 }
-#spectrum-freq-axis.bm-axis-open {
-  border-radius: 0;
-  border-bottom-color: transparent;
-}
 #spectrum-bookmark-axis {
   position: relative;
+  z-index: 5;
   height: 0;
   overflow: hidden;
   width: 100%;
   font-size: 0.68rem;
   background: var(--bg-secondary);
-  border-radius: 0 0 6px 6px;
-  border: 1px solid var(--border);
-  border-top: none;
+  border-top: 1px solid var(--border);
+  border-bottom: 1px solid var(--border);
   transition: height 80ms ease;
 }
 #spectrum-bookmark-axis.bm-axis-visible {