refine Semi UI operations diagnosis cockpit

2026-07-18 16:33:21 +08:00
parent cedb4f66b4
commit 8827a05e7e
4 changed files with 115 additions and 7 deletions
--- a/vehicle-data-platform/apps/web/src/v2/styles/workspace.css
+++ b/vehicle-data-platform/apps/web/src/v2/styles/workspace.css
@@ -12492,6 +12492,101 @@
  }
 }

+/*
+ * Semi UI single-vehicle diagnosis cockpit.
+ * Preserve the four-column desktop scan while keeping source evidence inside
+ * the first mobile viewport instead of spending it on four full-width cards.
+ */
+.v2-source-summary.semi-card-group {
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+}
+
+.v2-source-summary-region {
+  min-width: 0;
+}
+
+.v2-source-summary-card.is-recommended.semi-card {
+  border-color: #c8dbf6;
+  background: linear-gradient(145deg, #f2f7ff 0%, #fff 72%);
+  box-shadow: inset 0 3px #2f6fe4, 0 5px 16px rgba(31, 53, 80, .045);
+}
+
+.v2-source-summary-card.is-recommended strong {
+  color: #185fbf;
+}
+
+@media (max-width: 1180px) and (min-width: 681px) {
+  .v2-source-summary.semi-card-group {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 680px) {
+  .v2-source-summary.semi-card-group {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 6px;
+    padding: 8px 10px;
+  }
+
+  .v2-source-summary-card > .semi-card-body {
+    min-height: 74px;
+    padding: 9px 10px;
+  }
+
+  .v2-source-summary-card small,
+  .v2-source-summary-card > .semi-card-body > span:not(.semi-tag) {
+    font-size: 9px;
+  }
+
+  .v2-source-summary-card strong {
+    margin-block: 5px 4px;
+    font-size: 14px;
+  }
+
+  .v2-source-summary-card .semi-tag {
+    min-height: 19px;
+    padding-inline: 7px;
+    font-size: 9px;
+  }
+
+  .v2-source-summary-card.is-ok,
+  .v2-source-summary-card.is-warning {
+    box-shadow: inset 0 3px #22a878, 0 5px 16px rgba(31, 53, 80, .045);
+  }
+
+  .v2-source-summary-card.is-warning {
+    box-shadow: inset 0 3px #e8a12b, 0 5px 16px rgba(31, 53, 80, .045);
+  }
+
+  .v2-source-recommendation.semi-card {
+    margin: 8px 10px;
+    border-left-width: 3px;
+  }
+
+  .v2-source-recommendation > .semi-card-body {
+    padding: 9px 10px;
+  }
+
+  .v2-source-recommendation header {
+    align-items: center;
+    flex-direction: row;
+    gap: 8px;
+  }
+
+  .v2-source-recommendation header span {
+    width: auto;
+    min-width: 0;
+    font-size: 9px;
+    line-height: 1.35;
+  }
+
+  .v2-source-recommendation p {
+    margin-top: 6px;
+    font-size: 10px;
+    line-height: 1.5;
+  }
+}
+
 /*
 * Semi UI mileage workspace convergence.
 * Keep a single query/summary surface, one table scroll owner and the same