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 80930d1..c394673 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
@@ -116,96 +116,101 @@
-
-
-
-
-
-
-
+
+
-
-
-
-
-
-
WFM
-
-
-
Transmit / Power
-
-
-
-
-
-
-
Signal
-
-
-
-
-
-
-
-
-
-
TX Limit — units depend on rig (percentage/watts)
-
-
-
-
-
-
-
-
Audio
-
-
-
-
-
-
-
Off
-
-
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 250a0d6..f725e72 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
@@ -93,6 +93,30 @@ body {
line-height: 1.2;
}
.status { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1.1rem 1rem; }
+.controls-tray-shell {
+ min-width: 0;
+}
+.controls-tray-scroll {
+ width: 100%;
+ min-width: 0;
+ overflow-x: auto;
+ overflow-y: hidden;
+ padding-bottom: 0.2rem;
+}
+.controls-tray {
+ display: grid;
+ gap: 0.95rem;
+ width: max(100%, 58rem);
+ min-width: 0;
+ padding: 0.95rem 1rem 1rem;
+ border: 1px solid color-mix(in srgb, var(--border-light) 85%, transparent);
+ border-radius: 1rem;
+ background:
+ linear-gradient(180deg,
+ color-mix(in srgb, var(--surface) 88%, transparent),
+ color-mix(in srgb, var(--btn-bg) 76%, transparent));
+ box-shadow: inset 0 1px 0 color-mix(in srgb, #ffffff 12%, transparent);
+}
input.status-input, select.status-input { width: 100%; padding: 0.45rem 0.5rem; font-size: 1rem; border: 1px solid var(--border-light); border-radius: 6px; background: var(--input-bg); color: var(--text); }
#mode { height: var(--control-height); }
#freq { font-family: 'DSEG14 Classic', monospace; font-size: 2rem; padding: 0.5rem 0.6rem; letter-spacing: 0.05em; text-align: center; }
@@ -354,8 +378,10 @@ small { color: var(--text-muted); }
grid-template-columns: auto minmax(0, 1fr) auto;
align-items: center;
column-gap: 1rem;
- margin-bottom: 0.5rem;
+ margin-bottom: -0.45rem;
padding: 0.25rem 0 0.15rem;
+ position: relative;
+ z-index: 2;
}
.header-text {
width: auto;
@@ -365,7 +391,10 @@ small { color: var(--text-muted); }
.title { font-size: 1.4rem; font-weight: 700; display: inline-flex; align-items: center; gap: 0.35rem; }
.overview-strip {
width: 100%;
- margin: 0.35rem 0 0.95rem;
+ margin: 0 0 0.95rem;
+ padding-top: 0.8rem;
+ position: relative;
+ z-index: 1;
}
.overview-toolbar {
display: flex;
@@ -677,6 +706,7 @@ button:focus-visible, input:focus-visible, select:focus-visible {
.card { padding: 0.7rem 0.7rem 1rem; }
button { min-height: 2.8rem; font-size: 0.95rem; }
input.status-input, select.status-input { font-size: 1.1rem; }
+ .controls-tray { width: max(100%, 52rem); padding-left: 0.85rem; padding-right: 0.85rem; }
.freq-inline { gap: 0.5rem; }
.freq-inline { flex-wrap: wrap; }
.header-text { width: auto; min-width: 0; flex: 0 1 auto; }