Add Birdcage TUI: 5-screen Textual interface for Carryout G2
F1 Position (compass rose, motor control, sparklines), F2 Signal (RSSI gauge with sub-char precision, DVB/ADC sparklines, LNA toggle), F3 Scan (AZ/EL grid sweep with heatmap and CSV export), F4 System (NVS table, A3981 diagnostics, motor dynamics), F5 Console (raw serial terminal with prompt detection and safety gates). Includes SerialBridge (thread-safe protocol wrapper), DemoDevice (synthetic simulation for --demo mode), dark RF theme with rounded borders and teal accents, and send_raw() on CarryoutG2Protocol.
This commit is contained in:
parent
a70b9b0a29
commit
7271b53c63
23 changed files with 4160 additions and 0 deletions
496
tui/src/birdcage_tui/theme.tcss
Normal file
496
tui/src/birdcage_tui/theme.tcss
Normal file
|
|
@ -0,0 +1,496 @@
|
|||
/* Birdcage TUI — Dark RF Theme
|
||||
* Teal accent on deep blue-black. No purple.
|
||||
* Signal gradient: blue > cyan > green > yellow > red
|
||||
*/
|
||||
|
||||
/* ── Global ────────────────────────────────────────── */
|
||||
|
||||
Screen {
|
||||
background: #0a0a12;
|
||||
color: #c8d0d8;
|
||||
}
|
||||
|
||||
Header {
|
||||
background: #0e1420;
|
||||
color: #00d4aa;
|
||||
text-style: bold;
|
||||
dock: top;
|
||||
height: 1;
|
||||
}
|
||||
|
||||
Footer {
|
||||
background: #0e1420;
|
||||
color: #506878;
|
||||
dock: bottom;
|
||||
height: 1;
|
||||
}
|
||||
|
||||
/* ── Layout Containers ─────────────────────────────── */
|
||||
|
||||
#main-area {
|
||||
layout: horizontal;
|
||||
height: 1fr;
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
width: 26;
|
||||
background: #0e1420;
|
||||
border-right: solid #1a2a3a;
|
||||
padding: 1 1;
|
||||
}
|
||||
|
||||
.sidebar-title {
|
||||
color: #00d4aa;
|
||||
text-style: bold;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.sidebar-subtitle {
|
||||
color: #506878;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
margin: 0 0 1 0;
|
||||
}
|
||||
|
||||
#content-area {
|
||||
width: 1fr;
|
||||
}
|
||||
|
||||
ContentSwitcher {
|
||||
width: 1fr;
|
||||
height: 1fr;
|
||||
}
|
||||
|
||||
/* ── Sidebar Buttons ───────────────────────────────── */
|
||||
|
||||
.sidebar-btn {
|
||||
width: 100%;
|
||||
height: 3;
|
||||
margin: 0 0 1 0;
|
||||
background: #121c2a;
|
||||
color: #7090a8;
|
||||
text-style: bold;
|
||||
border: round #1a3050;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.sidebar-btn:hover {
|
||||
background: #1a2a40;
|
||||
color: #00d4aa;
|
||||
border: round #00d4aa;
|
||||
}
|
||||
|
||||
.sidebar-btn.active {
|
||||
background: #0a2a3a;
|
||||
color: #00d4aa;
|
||||
border: round #00d4aa;
|
||||
text-style: bold;
|
||||
}
|
||||
|
||||
/* ── Panel / Card ──────────────────────────────────── */
|
||||
|
||||
.panel {
|
||||
background: #0e1420;
|
||||
border: round #1a2a3a;
|
||||
padding: 1 2;
|
||||
margin: 0 1 1 1;
|
||||
}
|
||||
|
||||
.panel-title {
|
||||
color: #00d4aa;
|
||||
text-style: bold;
|
||||
margin-bottom: 1;
|
||||
}
|
||||
|
||||
/* ── Data Display ──────────────────────────────────── */
|
||||
|
||||
.value-large {
|
||||
color: #00d4aa;
|
||||
text-style: bold;
|
||||
}
|
||||
|
||||
.value-normal {
|
||||
color: #c8d0d8;
|
||||
}
|
||||
|
||||
.label {
|
||||
color: #506878;
|
||||
}
|
||||
|
||||
.label-dim {
|
||||
color: #384858;
|
||||
}
|
||||
|
||||
/* ── Status Indicators ─────────────────────────────── */
|
||||
|
||||
.status-ok {
|
||||
color: #00e060;
|
||||
}
|
||||
|
||||
.status-warn {
|
||||
color: #e8a020;
|
||||
}
|
||||
|
||||
.status-error {
|
||||
color: #e04040;
|
||||
}
|
||||
|
||||
.status-demo {
|
||||
color: #e8a020;
|
||||
text-style: italic;
|
||||
}
|
||||
|
||||
/* ── Input Controls ────────────────────────────────── */
|
||||
|
||||
Input {
|
||||
background: #121c2a;
|
||||
border: round #1a3050;
|
||||
color: #c8d0d8;
|
||||
padding: 0 1;
|
||||
}
|
||||
|
||||
Input:focus {
|
||||
border: round #00d4aa;
|
||||
}
|
||||
|
||||
Button {
|
||||
background: #1a2a40;
|
||||
color: #00d4aa;
|
||||
border: round #1a3050;
|
||||
min-width: 10;
|
||||
height: 3;
|
||||
}
|
||||
|
||||
Button:hover {
|
||||
background: #00d4aa;
|
||||
color: #0a0a12;
|
||||
border: round #00d4aa;
|
||||
}
|
||||
|
||||
Button:focus {
|
||||
border: round #00d4aa;
|
||||
text-style: bold;
|
||||
}
|
||||
|
||||
Button.-active {
|
||||
background: #0a3a3a;
|
||||
}
|
||||
|
||||
/* ── DataTable ─────────────────────────────────────── */
|
||||
|
||||
DataTable {
|
||||
background: #0a0a12;
|
||||
color: #c8d0d8;
|
||||
height: 1fr;
|
||||
}
|
||||
|
||||
DataTable > .datatable--header {
|
||||
background: #0e1420;
|
||||
color: #00d4aa;
|
||||
text-style: bold;
|
||||
}
|
||||
|
||||
DataTable > .datatable--cursor {
|
||||
background: #142030;
|
||||
color: #c8d0d8;
|
||||
}
|
||||
|
||||
DataTable > .datatable--even-row {
|
||||
background: #0a0a12;
|
||||
}
|
||||
|
||||
DataTable > .datatable--odd-row {
|
||||
background: #0c0e18;
|
||||
}
|
||||
|
||||
/* ── RichLog ───────────────────────────────────────── */
|
||||
|
||||
RichLog {
|
||||
background: #0a0a12;
|
||||
color: #c8d0d8;
|
||||
border: round #1a2a3a;
|
||||
scrollbar-color: #1a2a38;
|
||||
scrollbar-color-active: #00d4aa;
|
||||
scrollbar-color-hover: #2a4a58;
|
||||
height: 1fr;
|
||||
}
|
||||
|
||||
/* ── Progress Bar ──────────────────────────────────── */
|
||||
|
||||
ProgressBar {
|
||||
padding: 0 1;
|
||||
}
|
||||
|
||||
ProgressBar Bar {
|
||||
color: #00d4aa;
|
||||
background: #1a2a38;
|
||||
}
|
||||
|
||||
ProgressBar PercentageStatus {
|
||||
color: #506878;
|
||||
text-style: bold;
|
||||
}
|
||||
|
||||
/* ── Sparkline ─────────────────────────────────────── */
|
||||
|
||||
.sparkline {
|
||||
height: 2;
|
||||
padding: 0 1;
|
||||
color: #00d4aa;
|
||||
background: #0e1420;
|
||||
}
|
||||
|
||||
.sparkline-label {
|
||||
color: #506878;
|
||||
width: 14;
|
||||
}
|
||||
|
||||
/* ── Compass Rose ──────────────────────────────────── */
|
||||
|
||||
#compass-container {
|
||||
height: auto;
|
||||
min-height: 14;
|
||||
padding: 1;
|
||||
}
|
||||
|
||||
.compass-readout {
|
||||
color: #00d4aa;
|
||||
text-style: bold;
|
||||
}
|
||||
|
||||
/* ── Signal Gauge ──────────────────────────────────── */
|
||||
|
||||
.gauge-container {
|
||||
height: 3;
|
||||
padding: 0 1;
|
||||
}
|
||||
|
||||
.gauge-bar {
|
||||
height: 1;
|
||||
}
|
||||
|
||||
.gauge-label {
|
||||
color: #506878;
|
||||
width: 8;
|
||||
}
|
||||
|
||||
.gauge-value {
|
||||
color: #c8d0d8;
|
||||
width: 8;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* ── Signal Colors (gradient: blue > cyan > green > yellow > red) ── */
|
||||
|
||||
.signal-cold {
|
||||
color: #2080d0;
|
||||
}
|
||||
|
||||
.signal-cool {
|
||||
color: #00b8c8;
|
||||
}
|
||||
|
||||
.signal-mid {
|
||||
color: #00e060;
|
||||
}
|
||||
|
||||
.signal-warm {
|
||||
color: #e8c020;
|
||||
}
|
||||
|
||||
.signal-hot {
|
||||
color: #e04040;
|
||||
}
|
||||
|
||||
/* ── Sky Heatmap ───────────────────────────────────── */
|
||||
|
||||
.heatmap-container {
|
||||
height: 1fr;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.heatmap-cell {
|
||||
width: 2;
|
||||
height: 1;
|
||||
}
|
||||
|
||||
/* ── Motor Status ──────────────────────────────────── */
|
||||
|
||||
.motor-panel {
|
||||
height: auto;
|
||||
padding: 1 2;
|
||||
background: #0e1420;
|
||||
border: round #1a2a3a;
|
||||
}
|
||||
|
||||
.motor-row {
|
||||
layout: horizontal;
|
||||
height: 1;
|
||||
}
|
||||
|
||||
.motor-label {
|
||||
color: #506878;
|
||||
width: 14;
|
||||
}
|
||||
|
||||
.motor-value {
|
||||
color: #c8d0d8;
|
||||
}
|
||||
|
||||
/* ── Device Status Bar (sidebar bottom) ────────────── */
|
||||
|
||||
#device-status {
|
||||
dock: bottom;
|
||||
height: auto;
|
||||
padding: 1;
|
||||
background: #0e1420;
|
||||
border-top: solid #1a2a38;
|
||||
}
|
||||
|
||||
.device-status-label {
|
||||
color: #506878;
|
||||
}
|
||||
|
||||
.device-status-value {
|
||||
color: #c8d0d8;
|
||||
}
|
||||
|
||||
.device-connected {
|
||||
color: #00e060;
|
||||
}
|
||||
|
||||
.device-demo {
|
||||
color: #e8a020;
|
||||
}
|
||||
|
||||
/* ── Console Screen ────────────────────────────────── */
|
||||
|
||||
.console-input-area {
|
||||
dock: bottom;
|
||||
height: 3;
|
||||
layout: horizontal;
|
||||
padding: 0 1;
|
||||
background: #0e1420;
|
||||
border-top: solid #1a2a38;
|
||||
}
|
||||
|
||||
.console-input-area Input {
|
||||
width: 1fr;
|
||||
}
|
||||
|
||||
.console-input-area Button {
|
||||
width: 10;
|
||||
margin-left: 1;
|
||||
}
|
||||
|
||||
.console-context {
|
||||
dock: bottom;
|
||||
height: 1;
|
||||
padding: 0 1;
|
||||
background: #0e1420;
|
||||
color: #506878;
|
||||
}
|
||||
|
||||
/* ── Prompt Colors (by submenu) ────────────────────── */
|
||||
|
||||
.prompt-trk {
|
||||
color: #00d4aa;
|
||||
}
|
||||
|
||||
.prompt-mot {
|
||||
color: #00e060;
|
||||
}
|
||||
|
||||
.prompt-dvb {
|
||||
color: #2080d0;
|
||||
}
|
||||
|
||||
.prompt-nvs {
|
||||
color: #e8a020;
|
||||
}
|
||||
|
||||
.prompt-a3981 {
|
||||
color: #00b8c8;
|
||||
}
|
||||
|
||||
.prompt-step {
|
||||
color: #40c0a0;
|
||||
}
|
||||
|
||||
.prompt-os {
|
||||
color: #8090a0;
|
||||
}
|
||||
|
||||
.prompt-other {
|
||||
color: #506878;
|
||||
}
|
||||
|
||||
/* ── Scan Screen ───────────────────────────────────── */
|
||||
|
||||
.scan-controls {
|
||||
dock: bottom;
|
||||
height: auto;
|
||||
padding: 1;
|
||||
background: #0e1420;
|
||||
border-top: solid #1a2a38;
|
||||
}
|
||||
|
||||
.scan-status {
|
||||
height: 2;
|
||||
padding: 0 1;
|
||||
color: #506878;
|
||||
}
|
||||
|
||||
/* ── Screen-Level Layouts ──────────────────────────── */
|
||||
|
||||
.screen-container {
|
||||
layout: vertical;
|
||||
height: 1fr;
|
||||
width: 1fr;
|
||||
}
|
||||
|
||||
.top-row {
|
||||
layout: horizontal;
|
||||
height: 1fr;
|
||||
}
|
||||
|
||||
.bottom-controls {
|
||||
dock: bottom;
|
||||
height: auto;
|
||||
padding: 1;
|
||||
background: #0e1420;
|
||||
border-top: solid #1a2a38;
|
||||
layout: horizontal;
|
||||
}
|
||||
|
||||
.control-group {
|
||||
layout: horizontal;
|
||||
height: 3;
|
||||
width: 1fr;
|
||||
}
|
||||
|
||||
.control-group Input {
|
||||
width: 8;
|
||||
margin-right: 1;
|
||||
}
|
||||
|
||||
.control-group Button {
|
||||
margin-right: 1;
|
||||
}
|
||||
|
||||
/* ── NVS Table Highlight ───────────────────────────── */
|
||||
|
||||
.nvs-modified {
|
||||
color: #e8a020;
|
||||
text-style: bold;
|
||||
}
|
||||
|
||||
/* ── Scrollbar Styling ─────────────────────────────── */
|
||||
|
||||
* {
|
||||
scrollbar-color: #1a2a38;
|
||||
scrollbar-color-active: #00d4aa;
|
||||
scrollbar-color-hover: #2a4a58;
|
||||
scrollbar-background: #0a0a12;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue