|
|
@@ -0,0 +1,587 @@
|
|
|
+/* ============================================================
|
|
|
+ * Parking Simulator · 现代深色 UI(基于 AtlantaFX PrimerDark)
|
|
|
+ * ============================================================ */
|
|
|
+
|
|
|
+.root {
|
|
|
+ -fx-font-family: "Inter", "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
|
|
|
+ -fx-font-size: 13px;
|
|
|
+
|
|
|
+ -app-bg-0: #070912;
|
|
|
+ -app-bg-1: #0d1224;
|
|
|
+ -app-bg-2: #131a30;
|
|
|
+
|
|
|
+ -app-panel: rgba(255,255,255,0.035);
|
|
|
+ -app-panel-bd: rgba(255,255,255,0.07);
|
|
|
+ -app-panel-bd-strong: rgba(255,255,255,0.14);
|
|
|
+
|
|
|
+ -app-text: #e6eaff;
|
|
|
+ -app-text-dim: #8b94b9;
|
|
|
+ -app-text-weak: #6b7398;
|
|
|
+
|
|
|
+ -app-accent: #5b8cff;
|
|
|
+ -app-accent-soft: rgba(91,140,255,0.18);
|
|
|
+ -app-accent-2: #29e3d7;
|
|
|
+ -app-pink: #ff5fb0;
|
|
|
+ -app-green: #2ee07a;
|
|
|
+ -app-red: #ff5d6c;
|
|
|
+}
|
|
|
+
|
|
|
+/* 整体背景:极简深空,少量光感 */
|
|
|
+.main-view {
|
|
|
+ -fx-background-color:
|
|
|
+ radial-gradient(center 10% 0%, radius 75%, rgba(91,140,255,0.10), transparent 60%),
|
|
|
+ radial-gradient(center 95% 100%, radius 60%, rgba(41,227,215,0.08), transparent 65%),
|
|
|
+ linear-gradient(to bottom right, -app-bg-0, -app-bg-1 60%, -app-bg-2);
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ 顶栏(HeaderBar 替代系统标题栏) ============ */
|
|
|
+.header-bar {
|
|
|
+ /* 让顶栏与主背景融为一体,仅保留底边的极细分割线 */
|
|
|
+ -fx-background-color:
|
|
|
+ linear-gradient(to bottom, rgba(255,255,255,0.02), rgba(255,255,255,0));
|
|
|
+ -fx-border-color: -app-panel-bd;
|
|
|
+ -fx-border-width: 0 0 1 0;
|
|
|
+ /* HeaderBar 自身会保留系统按钮(macOS 红黄绿)的安全区域,
|
|
|
+ 这里只做视觉留白 */
|
|
|
+ -fx-padding: 8 14 8 14;
|
|
|
+ -fx-min-height: 44;
|
|
|
+ -fx-pref-height: 48;
|
|
|
+}
|
|
|
+.header-bar .brand {
|
|
|
+ -fx-font-size: 14px;
|
|
|
+ -fx-font-weight: 800;
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-letter-spacing: 0.04em;
|
|
|
+}
|
|
|
+.header-bar .brand-sub {
|
|
|
+ -fx-text-fill: -app-text-weak;
|
|
|
+ -fx-font-size: 10px;
|
|
|
+ -fx-font-weight: 600;
|
|
|
+ -fx-letter-spacing: 0.04em;
|
|
|
+}
|
|
|
+
|
|
|
+/* 顶栏胶囊按钮(清空 / 设置) */
|
|
|
+.btn-pill.button {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.05);
|
|
|
+ -fx-background-radius: 999;
|
|
|
+ -fx-border-color: -app-panel-bd-strong;
|
|
|
+ -fx-border-radius: 999;
|
|
|
+ -fx-border-width: 1;
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-font-weight: 600;
|
|
|
+ -fx-padding: 6 14;
|
|
|
+}
|
|
|
+.btn-pill.button:hover {
|
|
|
+ -fx-background-color: rgba(91,140,255,0.16);
|
|
|
+ -fx-border-color: -app-accent;
|
|
|
+ -fx-text-fill: #ffffff;
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ 通道连接 Chip(入口/出口) ============ */
|
|
|
+.ch-chip {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.04);
|
|
|
+ -fx-background-radius: 999;
|
|
|
+ -fx-border-radius: 999;
|
|
|
+ -fx-border-width: 1;
|
|
|
+ -fx-border-color: -app-panel-bd-strong;
|
|
|
+}
|
|
|
+.ch-chip-on { -fx-border-color: rgba(46,224,122,0.55); }
|
|
|
+.ch-chip-off { -fx-border-color: rgba(255,93,108,0.45); }
|
|
|
+.ch-dot {
|
|
|
+ -fx-min-width: 8; -fx-min-height: 8;
|
|
|
+ -fx-max-width: 8; -fx-max-height: 8;
|
|
|
+ -fx-background-radius: 8;
|
|
|
+}
|
|
|
+.ch-dot.on {
|
|
|
+ -fx-background-color: -app-green;
|
|
|
+ -fx-effect: dropshadow(gaussian, rgba(46,224,122,0.75), 8, 0.6, 0, 0);
|
|
|
+}
|
|
|
+.ch-dot.off {
|
|
|
+ -fx-background-color: -app-red;
|
|
|
+ -fx-effect: dropshadow(gaussian, rgba(255,93,108,0.55), 6, 0.4, 0, 0);
|
|
|
+}
|
|
|
+.ch-name {
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-font-weight: 700;
|
|
|
+ -fx-font-size: 12px;
|
|
|
+ -fx-letter-spacing: 0.06em;
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ 卡片 ============ */
|
|
|
+.card {
|
|
|
+ -fx-background-color: -app-panel;
|
|
|
+ -fx-background-radius: 14;
|
|
|
+ -fx-border-color: -app-panel-bd;
|
|
|
+ -fx-border-radius: 14;
|
|
|
+ -fx-border-width: 1;
|
|
|
+}
|
|
|
+
|
|
|
+.section-title {
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-font-size: 11px;
|
|
|
+ -fx-font-weight: 800;
|
|
|
+ -fx-letter-spacing: 0.14em;
|
|
|
+ -fx-padding: 0 0 2 0;
|
|
|
+}
|
|
|
+
|
|
|
+.subsection-title {
|
|
|
+ -fx-text-fill: -app-text-dim;
|
|
|
+ -fx-font-size: 10px;
|
|
|
+ -fx-font-weight: 800;
|
|
|
+ -fx-letter-spacing: 0.14em;
|
|
|
+ -fx-padding: 4 0 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+.divider {
|
|
|
+ -fx-pref-height: 1;
|
|
|
+ -fx-min-height: 1;
|
|
|
+ -fx-background-color: rgba(255,255,255,0.06);
|
|
|
+}
|
|
|
+
|
|
|
+.field-label {
|
|
|
+ -fx-text-fill: -app-text-dim;
|
|
|
+ -fx-font-size: 12px;
|
|
|
+ -fx-font-weight: 600;
|
|
|
+}
|
|
|
+
|
|
|
+.sn-text {
|
|
|
+ -fx-text-fill: -app-text-weak;
|
|
|
+ -fx-font-size: 11px;
|
|
|
+ -fx-font-family: "JetBrains Mono", "Menlo", monospace;
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ 输入框 ============ */
|
|
|
+.text-field, .spinner .text-field, .date-picker .text-field, .password-field {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.035);
|
|
|
+ -fx-background-radius: 8;
|
|
|
+ -fx-border-color: rgba(255,255,255,0.10);
|
|
|
+ -fx-border-radius: 8;
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-prompt-text-fill: -app-text-weak;
|
|
|
+ -fx-padding: 6 10 6 10;
|
|
|
+}
|
|
|
+.text-field:focused, .spinner:focused .text-field,
|
|
|
+.date-picker:focused .text-field, .password-field:focused {
|
|
|
+ -fx-border-color: -app-accent;
|
|
|
+ -fx-effect: dropshadow(gaussian, rgba(91,140,255,0.30), 8, 0.3, 0, 0);
|
|
|
+}
|
|
|
+
|
|
|
+.plate-input {
|
|
|
+ -fx-font-family: "JetBrains Mono", "Consolas", monospace;
|
|
|
+ -fx-font-weight: 700;
|
|
|
+ -fx-font-size: 14px;
|
|
|
+}
|
|
|
+
|
|
|
+/* Spinner */
|
|
|
+.dark-spinner .increment-arrow-button,
|
|
|
+.dark-spinner .decrement-arrow-button {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.04);
|
|
|
+ -fx-background-radius: 0;
|
|
|
+}
|
|
|
+.dark-spinner .increment-arrow-button:hover,
|
|
|
+.dark-spinner .decrement-arrow-button:hover {
|
|
|
+ -fx-background-color: rgba(91,140,255,0.20);
|
|
|
+}
|
|
|
+.dark-spinner .increment-arrow,
|
|
|
+.dark-spinner .decrement-arrow {
|
|
|
+ -fx-background-color: -app-text-dim;
|
|
|
+}
|
|
|
+
|
|
|
+.time-sep {
|
|
|
+ -fx-text-fill: -app-text-dim;
|
|
|
+ -fx-font-weight: 700;
|
|
|
+ -fx-padding: 0 2;
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ Console ============ */
|
|
|
+.console {
|
|
|
+ -fx-background-color: #050811;
|
|
|
+ -fx-background-radius: 10;
|
|
|
+ -fx-border-color: rgba(255,255,255,0.06);
|
|
|
+ -fx-border-radius: 10;
|
|
|
+ -fx-border-width: 1;
|
|
|
+ -fx-min-height: 160;
|
|
|
+}
|
|
|
+.console-area, .console-area .content {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+}
|
|
|
+.console-area {
|
|
|
+ -fx-text-fill: #c9d2f0;
|
|
|
+ -fx-font-family: "JetBrains Mono", "Menlo", "Consolas", monospace;
|
|
|
+ -fx-font-size: 12px;
|
|
|
+ -fx-padding: 8 6 8 8;
|
|
|
+ /* 搜索匹配高亮:TextArea selection 颜色 */
|
|
|
+ -fx-highlight-fill: rgba(91,140,255,0.45);
|
|
|
+ -fx-highlight-text-fill: #ffffff;
|
|
|
+}
|
|
|
+
|
|
|
+/* 日志卡片右上角搜索框:紧凑、低调 */
|
|
|
+.console-search.text-field {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.04);
|
|
|
+ -fx-background-radius: 999;
|
|
|
+ -fx-border-color: rgba(255,255,255,0.10);
|
|
|
+ -fx-border-radius: 999;
|
|
|
+ -fx-border-width: 1;
|
|
|
+ -fx-padding: 3 10 3 12;
|
|
|
+ -fx-font-size: 11px;
|
|
|
+ -fx-pref-height: 26;
|
|
|
+}
|
|
|
+.console-search.text-field:focused {
|
|
|
+ -fx-border-color: -app-accent;
|
|
|
+ -fx-effect: dropshadow(gaussian, rgba(91,140,255,0.30), 6, 0.3, 0, 0);
|
|
|
+}
|
|
|
+.console-search-counter {
|
|
|
+ -fx-text-fill: -app-text-weak;
|
|
|
+ -fx-font-family: "JetBrains Mono", "Menlo", monospace;
|
|
|
+ -fx-font-size: 11px;
|
|
|
+ -fx-padding: 0 4;
|
|
|
+ -fx-min-width: 28;
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ RadioButton / CheckBox ============ */
|
|
|
+.radio-button .radio,
|
|
|
+.check-box .box {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.04);
|
|
|
+ -fx-border-color: rgba(255,255,255,0.20);
|
|
|
+ -fx-border-width: 1.2;
|
|
|
+}
|
|
|
+.radio-button:selected .radio { -fx-border-color: -app-accent; }
|
|
|
+.radio-button:selected .radio .dot {
|
|
|
+ -fx-background-color: -app-accent;
|
|
|
+ -fx-background-insets: 0;
|
|
|
+}
|
|
|
+.check-box:selected .box {
|
|
|
+ -fx-background-color: -app-accent;
|
|
|
+ -fx-border-color: transparent;
|
|
|
+}
|
|
|
+.check-box:selected .mark { -fx-background-color: white; }
|
|
|
+.radio-button, .check-box { -fx-text-fill: -app-text; }
|
|
|
+
|
|
|
+.color-swatch {
|
|
|
+ -fx-min-width: 14; -fx-min-height: 14;
|
|
|
+ -fx-max-width: 14; -fx-max-height: 14;
|
|
|
+ -fx-background-radius: 3;
|
|
|
+ -fx-border-color: rgba(255,255,255,0.20);
|
|
|
+ -fx-border-radius: 3;
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ Toggle Switch(左右滑动开关) ============ */
|
|
|
+.toggle-switch-row { -fx-cursor: hand; }
|
|
|
+.toggle-switch-row .toggle-switch-label {
|
|
|
+ -fx-text-fill: -app-text-dim;
|
|
|
+ -fx-font-size: 12px;
|
|
|
+ -fx-font-weight: 700;
|
|
|
+}
|
|
|
+.toggle-switch {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.10);
|
|
|
+ -fx-background-radius: 22;
|
|
|
+ -fx-border-color: rgba(255,255,255,0.14);
|
|
|
+ -fx-border-radius: 22;
|
|
|
+ -fx-border-width: 1;
|
|
|
+ -fx-cursor: hand;
|
|
|
+}
|
|
|
+.toggle-switch:on {
|
|
|
+ -fx-background-color: linear-gradient(to right, #6c95ff, #4a73f0);
|
|
|
+ -fx-border-color: -app-accent;
|
|
|
+ -fx-effect: dropshadow(gaussian, rgba(91,140,255,0.45), 8, 0.25, 0, 0);
|
|
|
+}
|
|
|
+.toggle-thumb {
|
|
|
+ -fx-background-color: white;
|
|
|
+ -fx-background-radius: 16;
|
|
|
+ -fx-effect: dropshadow(gaussian, rgba(0,0,0,0.45), 4, 0.2, 0, 1);
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ 尾字快捷按钮(警/学/挂/港/澳/领) ============ */
|
|
|
+.suffix-chip {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.05);
|
|
|
+ -fx-background-radius: 999;
|
|
|
+ -fx-border-color: rgba(255,255,255,0.14);
|
|
|
+ -fx-border-radius: 999;
|
|
|
+ -fx-border-width: 1;
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-font-weight: 800;
|
|
|
+ -fx-font-size: 12px;
|
|
|
+ -fx-padding: 4 12;
|
|
|
+ -fx-cursor: hand;
|
|
|
+}
|
|
|
+.suffix-chip:hover {
|
|
|
+ -fx-background-color: rgba(91,140,255,0.18);
|
|
|
+ -fx-border-color: -app-accent;
|
|
|
+ -fx-text-fill: #ffffff;
|
|
|
+}
|
|
|
+.suffix-chip:armed {
|
|
|
+ -fx-background-color: rgba(91,140,255,0.28);
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ Plate Preview ============ */
|
|
|
+/* 模拟物理车牌:外层圆角 + 双层边框 + 四角螺丝 + 字符浮雕阴影 */
|
|
|
+.plate {
|
|
|
+ -fx-background-radius: 10;
|
|
|
+ -fx-border-radius: 10;
|
|
|
+ -fx-border-width: 2;
|
|
|
+ /* 边框颜色由 PlatePreview 在代码里按 PlateColor 动态注入 */
|
|
|
+ -fx-effect: dropshadow(gaussian, rgba(0,0,0,0.55), 20, 0.0, 0, 5);
|
|
|
+}
|
|
|
+/* 第二层内边框(贴外框 4px 内缩) */
|
|
|
+.plate-inner-border {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+ -fx-border-radius: 6;
|
|
|
+ -fx-border-width: 1;
|
|
|
+ -fx-background-insets: 4;
|
|
|
+ -fx-border-insets: 4;
|
|
|
+}
|
|
|
+/* 四角螺丝(金属高光小圆) */
|
|
|
+.plate-screw {
|
|
|
+ -fx-fill: radial-gradient(focus-angle 315deg, focus-distance 25%, center 50% 50%,
|
|
|
+ radius 60%,
|
|
|
+ #f5f5f5 0%, #c8c8c8 45%, #6e6e6e 90%, #444 100%);
|
|
|
+ -fx-stroke: rgba(0,0,0,0.45);
|
|
|
+ -fx-stroke-width: 0.5;
|
|
|
+}
|
|
|
+.plate-text {
|
|
|
+ -fx-font-family: "JetBrains Mono", "Consolas", monospace;
|
|
|
+ -fx-font-size: 30px;
|
|
|
+ -fx-font-weight: 800;
|
|
|
+ -fx-letter-spacing: 0.06em;
|
|
|
+ -fx-effect: dropshadow(one-pass-box, rgba(0,0,0,0.55), 1.5, 0.0, 1, 1);
|
|
|
+}
|
|
|
+/* 省份汉字单独字体 */
|
|
|
+.plate-text-province {
|
|
|
+ -fx-font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
|
|
|
+ -fx-font-size: 28px;
|
|
|
+}
|
|
|
+/* 中央分隔圆点 */
|
|
|
+.plate-dot {
|
|
|
+ -fx-background-radius: 999;
|
|
|
+ -fx-effect: dropshadow(one-pass-box, rgba(0,0,0,0.6), 1, 0.0, 0.5, 0.5);
|
|
|
+}
|
|
|
+/* 新能源充电插头小图标(简化版) */
|
|
|
+.plate-nev-plug {
|
|
|
+ -fx-background-color:
|
|
|
+ /* 插头主体 */
|
|
|
+ radial-gradient(center 50% 60%, radius 38%, #19af46 0%, #19af46 60%, transparent 61%),
|
|
|
+ /* 充电线 */
|
|
|
+ linear-gradient(from 60% 75% to 60% 100%, #19af46, #19af46);
|
|
|
+ -fx-background-radius: 3;
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ Segmented Toggle(通道切换) ============ */
|
|
|
+.segmented {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.04);
|
|
|
+ -fx-background-radius: 10;
|
|
|
+ -fx-border-color: -app-panel-bd-strong;
|
|
|
+ -fx-border-radius: 10;
|
|
|
+ -fx-padding: 3;
|
|
|
+}
|
|
|
+.segmented .segment.toggle-button {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+ -fx-background-radius: 8;
|
|
|
+ -fx-text-fill: -app-text-dim;
|
|
|
+ -fx-font-weight: 700;
|
|
|
+ -fx-padding: 8 16;
|
|
|
+ -fx-border-width: 0;
|
|
|
+}
|
|
|
+.segmented .segment.toggle-button:hover {
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+}
|
|
|
+.segmented .segment.toggle-button:selected {
|
|
|
+ -fx-background-color: linear-gradient(to bottom, #5b8cff, #4a73f0);
|
|
|
+ -fx-text-fill: white;
|
|
|
+ -fx-effect: dropshadow(gaussian, rgba(91,140,255,0.40), 10, 0.2, 0, 0);
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ 按钮 ============ */
|
|
|
+
|
|
|
+/* 主按钮(强调色) */
|
|
|
+.btn-primary.button {
|
|
|
+ -fx-background-color: linear-gradient(to bottom, #6c95ff, #4a73f0);
|
|
|
+ -fx-background-radius: 8;
|
|
|
+ -fx-text-fill: white;
|
|
|
+ -fx-font-weight: 700;
|
|
|
+ -fx-padding: 7 16;
|
|
|
+ -fx-border-width: 0;
|
|
|
+}
|
|
|
+.btn-primary.button:hover {
|
|
|
+ -fx-background-color: linear-gradient(to bottom, #7da3ff, #5b8cff);
|
|
|
+}
|
|
|
+.btn-primary.danger.button, .btn-primary.button.danger {
|
|
|
+ -fx-background-color: linear-gradient(to bottom, #ff7585, #ef4a5d);
|
|
|
+}
|
|
|
+.btn-primary.button.danger:hover {
|
|
|
+ -fx-background-color: linear-gradient(to bottom, #ff8a98, #ff5d6c);
|
|
|
+}
|
|
|
+
|
|
|
+/* 三个动作大按钮 */
|
|
|
+.btn-neon {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.04);
|
|
|
+ -fx-background-radius: 10;
|
|
|
+ -fx-border-color: -app-panel-bd-strong;
|
|
|
+ -fx-border-radius: 10;
|
|
|
+ -fx-border-width: 1;
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-font-weight: 700;
|
|
|
+ -fx-padding: 8 12;
|
|
|
+}
|
|
|
+.btn-neon:hover {
|
|
|
+ -fx-background-color: rgba(91,140,255,0.14);
|
|
|
+ -fx-border-color: -app-accent;
|
|
|
+ -fx-text-fill: #ffffff;
|
|
|
+}
|
|
|
+.btn-neon-accent {
|
|
|
+ -fx-background-color: linear-gradient(to right, #5b8cff, #8c5bff);
|
|
|
+ -fx-border-color: transparent;
|
|
|
+ -fx-text-fill: white;
|
|
|
+}
|
|
|
+.btn-neon-accent:hover {
|
|
|
+ -fx-background-color: linear-gradient(to right, #6e9dff, #9d6fff);
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ Dialog & Tabs ============ */
|
|
|
+.dialog-pane {
|
|
|
+ -fx-background-color: -app-bg-1;
|
|
|
+}
|
|
|
+
|
|
|
+.settings-scroll, .settings-scroll > .viewport {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+}
|
|
|
+.settings-scroll > .scroll-bar:vertical {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+}
|
|
|
+.dialog-pane > .header-panel {
|
|
|
+ -fx-background-color: rgba(91,140,255,0.10);
|
|
|
+}
|
|
|
+.dialog-pane > .header-panel .label {
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+}
|
|
|
+.dialog-pane > .content { -fx-text-fill: -app-text; }
|
|
|
+
|
|
|
+.tab-pane .tab {
|
|
|
+ -fx-background-color: rgba(255,255,255,0.03);
|
|
|
+ -fx-padding: 6 18;
|
|
|
+ -fx-background-radius: 8 8 0 0;
|
|
|
+}
|
|
|
+.tab-pane .tab:selected {
|
|
|
+ -fx-background-color: rgba(91,140,255,0.20);
|
|
|
+}
|
|
|
+.tab-pane .tab-header-area .tab-header-background {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+}
|
|
|
+.tab .tab-label { -fx-text-fill: -app-text; -fx-font-weight: 600; }
|
|
|
+
|
|
|
+/* DatePicker 弹窗 */
|
|
|
+.date-picker-popup { -fx-background-color: -app-bg-2; -fx-border-color: rgba(255,255,255,0.10); }
|
|
|
+
|
|
|
+/* 滚动条精简 */
|
|
|
+.scroll-bar:horizontal, .scroll-bar:vertical { -fx-background-color: transparent; }
|
|
|
+.scroll-bar .thumb { -fx-background-color: rgba(255,255,255,0.18); -fx-background-radius: 6; }
|
|
|
+.scroll-bar .thumb:hover { -fx-background-color: rgba(91,140,255,0.45); }
|
|
|
+.scroll-bar .track { -fx-background-color: transparent; }
|
|
|
+.scroll-bar .increment-button, .scroll-bar .decrement-button { -fx-pref-width: 0; -fx-pref-height: 0; }
|
|
|
+.scroll-bar .increment-arrow, .scroll-bar .decrement-arrow { -fx-shape: ""; -fx-padding: 0; }
|
|
|
+
|
|
|
+/* ============ 设置面板:OSS 提示文案 ============ */
|
|
|
+.settings-hint {
|
|
|
+ -fx-text-fill: -app-text-weak;
|
|
|
+ -fx-font-size: 11px;
|
|
|
+ -fx-line-spacing: 2;
|
|
|
+ -fx-padding: 6 0 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+/* ============ Telemetry 卡片 ============ */
|
|
|
+.telemetry-panel {
|
|
|
+ -fx-padding: 4 0 0 0;
|
|
|
+}
|
|
|
+
|
|
|
+/* 上下分栏:去掉默认底色 / 边框,分割条做成极细一条 */
|
|
|
+.telemetry-split {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+ -fx-padding: 0;
|
|
|
+}
|
|
|
+.telemetry-split > .split-pane-divider {
|
|
|
+ -fx-padding: 0 0 0 0;
|
|
|
+ -fx-background-color: rgba(255,255,255,0.06);
|
|
|
+ -fx-pref-height: 1;
|
|
|
+}
|
|
|
+
|
|
|
+/* JSON 详情 TextArea */
|
|
|
+.telemetry-detail {
|
|
|
+ -fx-control-inner-background: rgba(0,0,0,0.18);
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-background-color: transparent;
|
|
|
+ -fx-background-radius: 8;
|
|
|
+ -fx-border-color: rgba(255,255,255,0.08);
|
|
|
+ -fx-border-radius: 8;
|
|
|
+ -fx-font-family: "JetBrains Mono", "SF Mono", "Menlo", monospace;
|
|
|
+ -fx-font-size: 11.5px;
|
|
|
+}
|
|
|
+.telemetry-detail .content {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+}
|
|
|
+.telemetry-detail .text {
|
|
|
+ -fx-fill: -app-text;
|
|
|
+}
|
|
|
+.telemetry-detail:focused {
|
|
|
+ -fx-border-color: rgba(91,140,255,0.45);
|
|
|
+}
|
|
|
+
|
|
|
+/* 最近发送列表 */
|
|
|
+.telemetry-list {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+ -fx-control-inner-background: transparent;
|
|
|
+ -fx-control-inner-background-alt: transparent;
|
|
|
+ -fx-padding: 0;
|
|
|
+ -fx-border-color: transparent;
|
|
|
+ -fx-background-insets: 0;
|
|
|
+}
|
|
|
+.telemetry-list .list-cell {
|
|
|
+ -fx-background-color: transparent;
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-padding: 2 6 2 6;
|
|
|
+}
|
|
|
+.telemetry-list .list-cell:filled:hover {
|
|
|
+ -fx-background-color: rgba(91,140,255,0.07);
|
|
|
+ -fx-background-radius: 6;
|
|
|
+}
|
|
|
+.telemetry-list .list-cell:filled:selected {
|
|
|
+ -fx-background-color: rgba(91,140,255,0.15);
|
|
|
+ -fx-background-radius: 6;
|
|
|
+}
|
|
|
+.telemetry-list .scroll-bar:vertical { -fx-pref-width: 6; }
|
|
|
+
|
|
|
+.telemetry-entry-row {
|
|
|
+ -fx-padding: 0;
|
|
|
+}
|
|
|
+.telemetry-entry-time {
|
|
|
+ -fx-text-fill: -app-text-weak;
|
|
|
+ -fx-font-family: "JetBrains Mono", "SF Mono", "Menlo", monospace;
|
|
|
+ -fx-font-size: 11px;
|
|
|
+}
|
|
|
+.telemetry-entry-channel {
|
|
|
+ -fx-padding: 1 6 1 6;
|
|
|
+ -fx-background-radius: 4;
|
|
|
+ -fx-font-size: 10.5px;
|
|
|
+ -fx-font-weight: 700;
|
|
|
+}
|
|
|
+.telemetry-entry-channel.entry-chip-entry {
|
|
|
+ -fx-background-color: rgba(46,224,122,0.16);
|
|
|
+ -fx-text-fill: #6affa8;
|
|
|
+}
|
|
|
+.telemetry-entry-channel.entry-chip-exit {
|
|
|
+ -fx-background-color: rgba(255,95,176,0.16);
|
|
|
+ -fx-text-fill: #ff8ac6;
|
|
|
+}
|
|
|
+.telemetry-entry-name {
|
|
|
+ -fx-text-fill: -app-text-dim;
|
|
|
+ -fx-font-family: "JetBrains Mono", "SF Mono", "Menlo", monospace;
|
|
|
+ -fx-font-size: 11px;
|
|
|
+}
|
|
|
+.telemetry-entry-detail {
|
|
|
+ -fx-text-fill: -app-text;
|
|
|
+ -fx-font-size: 11.5px;
|
|
|
+ -fx-font-weight: 600;
|
|
|
+}
|
|
|
+.telemetry-placeholder {
|
|
|
+ -fx-text-fill: -app-text-weak;
|
|
|
+ -fx-font-size: 11.5px;
|
|
|
+ -fx-font-style: italic;
|
|
|
+}
|