The filters were a 30rem column parked in the bottom-right corner, covering
a third of the map they filter. Lay them out horizontally instead: one row
per group -- label beside its control, thin rules between -- across the top
of the map, spanning ~87% of its width at 1600px and wrapping to a second
row as it narrows.
It starts clear of Leaflet's zoom buttons and stops short of the corner
controls, which stay outside it: the button that hides the filters cannot
live inside the thing it hides. The bottom-left band legend keeps its place.
The sentence explaining the two path toggles would have swallowed the bar,
so it moves to their tooltips and is shown inline only in the stacked
narrow-screen layout.
Signed-off-by: Stan Grams <sjg@haxx.space>
A message was three stacked lines — time and name, then MMSI and route,
then motion, distance, position and age — so a screen held eight of
them. It is one line now: time, vessel, message type, and what the
message says, opening in place for the MMSI, the channel frequency, the
route, the age, the fix and a jump to the map. Twenty-two fit where
eight did.
What a message says depends on what it is. Position reports give the
fix and the motion; the static and voyage reports that carry no fix give
the callsign and where the vessel is bound. Both fall back to whatever
fields are present rather than showing nothing.
The row vocabulary the APRS list introduced is no longer APRS-specific —
the classes are decode-line and decode-expanded now, shared by both, and
identity sits in fixed columns so the summaries line up down the list
instead of starting wherever the callsign happens to end. The three
summary cards above the list go the way of the APRS ones.
Signed-off-by: Stan Grams <sjg@haxx.space>
A frame was a card five lines tall — timestamp, a meta line, the
information field as it arrived on the air, three buttons, and a Details
panel repeating the four things already on the row — so five frames
filled the panel and the payload was left to be decoded by eye.
A frame is one line now: time, station, type, and what the frame says.
It opens in place for the path, the CRC, the raw field, its bytes and
the actions. Twenty-one frames fit where five did.
And the information field is read rather than echoed. Weather reports
give temperature, wind, humidity and pressure; telemetry gives its
sequence and channels; a message gives its addressee and text; a
position gives the fix, course and speed, and the comment the station
wrote. Anything that cannot be summarised falls back to the raw field,
which is in the expanded view either way.
HF APRS had a copy of the same forty lines of markup, differing by one
badge, so both now build their rows from one function in the shared
module — the CSS is shared between them and this would have broken it
otherwise. Both headers lose their three summary cards for a line of
counts beside the filters, which frees another fifth of the panel.
Signed-off-by: Stan Grams <sjg@haxx.space>
Reloading a second time sometimes showed history the first load did not,
and the safety valve is why: it called one function that both released
the buffered live decodes and tore the history worker down, so any load
where the replay had not finished inside twenty seconds — a large
backlog, a cold cache, a slow link — dropped whatever had not arrived,
without a word. A reload got another go at it, and the second one is
faster because everything is cached by then.
Those are two separate things now. At the timeout the live decodes are
released so the panels are not held back, the replay carries on, and the
progress says so. The fallback's error path retries once and then says
"Decode history unavailable" rather than leaving the operator to guess
whether there was anything to see.
The progress is no longer a scrim. It was fixed to the whole viewport
with a wash over the page — the waterfall, the decode panels, all of it —
for the length of the replay, which is exactly when there is something
worth watching. It is a corner card with a bar: indeterminate while the
payload is on the wire, then filling as N of M messages replay.
None of this was reachable from a test. /decode/history answers in CBOR
and the worker reads the body as CBOR unconditionally, but the fixture
served JSON, so every browser run had been exercising the client's retry
path and never its history path. It encodes CBOR now, including the
64-bit form the millisecond timestamps need, and decode-flow serves 1200
records and holds the client to restoring all of them on the first load,
showing progress while it does, and never covering the page with it.
Signed-off-by: Stan Grams <sjg@haxx.space>
Thirteen decoders in a horizontal strip needed a scroller on anything
but a wide window, and the open one was marked by a single underline
among thirteen. They are a list down the left now, all visible at once,
each keeping the state dot it already carried, with the panel for the
selected one filling the rest of the width.
No script changed: the sub-tab wiring, the aria roles, the decoder
picker and the state-dot observers all work on the same markup, so this
is layout only.
Below 760px the sidebar gives way to the picker that already existed
there. That path needed align-content: the tab panel fills the page
height and a grid stretches its rows to match, which handed the picker a
218px row and left a 189px gap under it.
The tab icon was the signal-strength bars, which is what the S-meter
shows two rows above it; a pulse train says digital modes instead.
Signed-off-by: Stan Grams <sjg@haxx.space>
The row carries three unrelated things — how loud it is, whether there
is any audio at all, and how much is arriving — and only the middle one
was named. Each is a group now: VOLUME over the two sliders, SQL on its
own switch, LEVEL over the meter, with a hairline between each.
The rules are drawn only while the row is one line, measured against the
row rather than the viewport: what fits depends on whether the rig
transmits and whether it has a squelch at all. A rule divides what sits
either side of it, so once a group wraps the wrap is the division and
the rule would just be a mark at the start of a line — which is what it
was at 900px before this. The labels carry the grouping on their own
below that width, and the groups stack whole on a phone.
Signed-off-by: Stan Grams <sjg@haxx.space>
Clicking SQL turns the squelch on and off. The label and the button
beside it said the same thing twice — one naming the control, the other
reading "On" or "Off" — where the name itself is the obvious target, and
the dot already carries the state: grey when off, green while the gate
passes, amber while it holds.
The pressed state is on the label, so the switch reads the same to a
screen reader as it looks.
Signed-off-by: Stan Grams <sjg@haxx.space>
The threshold is in dB, and since the squelch fix that is the scale the
spectrum axis and the S-meter are labelled in — so the control belongs
on the plot, at the level it gates. A dashed line spans the spectrum at
its threshold with a grip that reads it out, dragged like the bandwidth
edges, green while the signal is above it and amber while it gates.
Arrow keys move it a dB at a time for anyone not using a mouse.
The audio row keeps a compact version: the dB, an indicator lit from the
same meter the DSP compares against, Auto, and an enable toggle that no
longer doubles as the level. The slider ran 0-100% over that dB range,
which gave the operator a number with nothing on screen to relate it to,
and zero meant "disabled", so turning the squelch off to listen threw
the threshold away. Auto now says which level it picked.
Two things the browser could only show once it was on the plot: the grip
landed underneath the split control at the right edge, which swallowed
its pointer, and dragging to the foot of the axis hid the line — and the
grip with it — instead of pinning it where it could be dragged back.
The fixture could not exercise any of this: /audio answered 404, which
hides the audio row and the control inside it, and the status carried no
filter block, which is what tells the client the rig has a squelch at
all. Both now look like an SDR, and the spectrum test drives the line.
Signed-off-by: Stan Grams <sjg@haxx.space>
The radio's own settings now come first, then audio, then the scheduler:
Advanced radio controls, Audio controls, Scheduler controls.
The advanced section is not in the markup — ui-core builds it at runtime
and gathers the SDR settings, virtual channel and TX limit rows into it,
appending the result, which put it last however the markup was ordered.
It is inserted ahead of the audio section instead.
The signal readout and the TX meters stay where they are, between the
controls and the sections: they are readouts rather than a section, and
on an SDR the spectrum covers them anyway.
Signed-off-by: Stan Grams <sjg@haxx.space>
The controls every rig has — mode, wheel, tune step, transmit — now sit
as a centred block rather than packed against the left edge.
What the current mode adds moves out from among them: WFM's six controls
stretched the row sideways whenever it was active, pushing the wheel and
the step pickers off centre, and SAM did the same on a smaller scale.
They get a row of their own below a divider, which appears and leaves
with them — an empty one would still take a track and a gap in the tray
and draw its divider under controls it has nothing to do with.
Signed-off-by: Stan Grams <sjg@haxx.space>
Mode was a full-width select: 483px of the row to display "FM". The
modes are three or four characters and there are at most twelve, so they
become a segmented group like the Unit and Step Scale pickers beside
them — a third of the width, and one click instead of two.
The <select> stays as the mode's value. A dozen call sites and several
plugins read #mode.value, so replacing it outright would have reached
much further than a layout change should; it is hidden from sight and
from assistive tech, the buttons write to it, and everything downstream
runs unchanged. Every writer re-syncs the buttons, the plugins through
a new trxCore.syncModePicker.
The row itself was a grid with a track per column, but the WFM, SAM and
transmit columns are hidden on most rigs, so it ended in some 500px of
hole. It packs left now. Same fault one level down: the power buttons
sat in three fixed tracks, so a rig with neither transmit nor lock kept
two empty ones and left its label chip stranded at the far edge.
Unit and Step Scale move out of the frequency row and in beside the
wheel and the +/- they modify, which were some 600px away.
Signed-off-by: Stan Grams <sjg@haxx.space>
The controls were a column — release, then the step buttons, then the
status line, then the entry on air last — which read bottom-up and left
the entry that is actually transmitting furthest from the buttons that
change it. They now run left to right: step through the entries, hand
the rig back, then the current entry behind a separator.
The separator is a pseudo-element on the current-entry block rather than
an element of its own, because that block is display-toggled whenever
fewer than two entries are active; a standalone rule would be left
hanging with nothing after it.
No ids move, so the enable/disable logic in the scheduler plugin and the
release polling in vchan bind exactly as before. The smoke test asserts
the row's order, which is also what keeps the separator in place.
Signed-off-by: Stan Grams <sjg@haxx.space>
The footer floated in space below the content with no rule to close the
page, its two clusters sat on a text baseline that left the source pill
hanging, and the status hint was a plain line of text a size larger than
the attribution beside it.
Now a hairline closes the page the way .tab-bar opens it, the clusters
centre on one line, and the attribution drops the opacity it stacked on
top of --text-muted, which had put it below a readable contrast ratio.
The status hint becomes a pill with a state dot: green when ready, amber
while a command is in flight, red on connection loss. The colour comes
from a data-state attribute, so every hint now goes through setPowerHint
instead of assigning textContent directly. --status-ok carries the
indicator green; .about-status-on picks it up too, which darkens it on
light themes where the old value was barely legible.
Signed-off-by: Stan Grams <sjg@haxx.space>
Recorder stated its name; Statistics, Settings and About did not, so one
page in eight carried a title. The class it used, section-heading, had
no rule behind it either, leaving even that title as a default h2.
Which way to unify follows from the navigation change. The tab strip
highlights the destination you are on, so Radio, Bookmarks, Digital modes
and Map already say where you are and a title would repeat the strip
while costing vertical space the spectrum wants. The four destinations
behind Tools get no such highlight — the strip looks the same on all of
them — so those are exactly the pages that have to name themselves.
Give the three that were missing a heading, and style section-heading so
all four match.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01GdyUjuXejCEfiub675z6cz
Signed-off-by: Stan Grams <sjg@haxx.space>
Eight destinations sat flat in the tab strip with equal weight, competing
with the controls for the same row and then scrolling out of reach with
only a fade to say so. They are not equal: Radio is where an operator
spends nearly all their time, Bookmarks, Digital modes and Map are
operating surfaces, and Statistics, Recorder, Settings and About are
occasional.
The mobile layout already grouped them exactly that way, behind its More
menu, so the application carried two navigation models. Adopt the mobile
grouping at every width instead of adding a third: four operating tabs
plus More. The strip no longer scrolls at any width, and the menu keeps
its bottom-sheet placement on mobile while anchoring under its button
elsewhere.
Drop the labels between 701 and 1180px so the tabs degrade to their icons
— which every tab already carries — before the strip could ever need to
hide a destination.
Rename Main to Radio: it is the receiver, not a generic first page, and
the name now says what the destination is rather than where it sits.
Freeing that width also let the style picker and theme toggle return to
the bar inline, leaving only the layout picker in the overflow menu.
Navigating to About in the browser smoke test now goes through More, as a
person would.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01GdyUjuXejCEfiub675z6cz
Signed-off-by: Stan Grams <sjg@haxx.space>
The header repeated the active rig's hardware string and mode list beside
the rig picker. With a real SDR that reads
SoapySDR driver=airspyhf,serial=c852eb5dd23539f8 · RX · SDR filters ·
LSB · USB · CW · CWR · AM · +7 modes
which is longer than every other control in the bar combined, and it is
already on the About tab in full, split across its Rig, Active rig,
Connection, Modes and VFO rows.
Remove the element and the builder behind it. Rig switching keeps its
feedback through the existing hint channel rather than by briefly
rewriting a permanent label, and the identity that belongs in a header —
the rig's display name — stays in the left subtitle.
The freed width is not spent: the tab strip now reaches Settings before
it needs to scroll, where it previously faded out during Statistics.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01GdyUjuXejCEfiub675z6cz
Signed-off-by: Stan Grams <sjg@haxx.space>
Introduce a shared design-token layer and apply it to the web
frontend for a more consistent, readable, and accessible feel.
Pure CSS plus one HTML block; no app.js behaviour changes, and the
existing multi-theme (style x light/dark) system is preserved.
- Add spacing, type, radius and motion tokens to :root.
- Fix undefined --surface consumed by .controls-tray, which dropped
the panel background entirely; it now resolves per theme.
- Set body line-height and font smoothing; collapse near-duplicate
font sizes onto canonical scale steps.
- Rebuild the auth gate with classes and replace hardcoded colours
(#ff6b6b, #9aa4b5) with theme variables so it renders correctly in
every theme.
- Add an opacity fade on tab switches, gated by prefers-reduced-motion.
- Extend focus-visible rings to the spectrum canvas, tabindex controls
and links.
- Add a self-theming --accent-text token to lift accent-coloured text
(links, active tab) to WCAG AA without altering brand fills.
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01NFpGtGTWUEYXLwZeZs2RAV
Signed-off-by: Stan Grams <sjg@haxx.space>
Repoint the web UI footer link to git.haxx.space/sjg/trx-rs, swap the
GitHub octocat mark for a host-neutral git-branch icon, and relabel to
"trx-rs source".
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Signed-off-by: Stan Grams <sjg@haxx.space>
sjg
