feat(vehicle): prioritize live status
This commit is contained in:
@@ -435,7 +435,7 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
.v2-identity-actions a { display: inline-flex; height: 38px; align-items: center; gap: 7px; border: 1px solid #dce4ef; border-radius: 7px; padding: 0 14px; color: #536177; text-decoration: none; white-space: nowrap; font-size: 10px; font-weight: 700; }
|
||||
.v2-identity-actions a:hover { border-color: #a8c7f9; color: var(--v2-blue); }
|
||||
|
||||
.v2-record-grid { display: grid; min-height: 0; flex: 1; grid-template-columns: minmax(520px, 1.75fr) minmax(300px, 1fr); grid-template-rows: minmax(300px, 1.05fr) auto minmax(270px, .95fr); gap: 12px; }
|
||||
.v2-record-grid { display: grid; min-height: 0; flex: 1; grid-template-columns: minmax(520px, 1.75fr) minmax(300px, 1fr); grid-template-rows: minmax(300px, 1.05fr) minmax(270px, .95fr); gap: 12px; }
|
||||
.v2-record-card, .v2-single-map-card { min-width: 0; overflow: hidden; border: 1px solid var(--v2-border); border-radius: var(--v2-radius); background: #fff; box-shadow: var(--v2-shadow); }
|
||||
.v2-record-card > header { display: flex; height: 40px; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--v2-border); padding: 0 14px; }
|
||||
.v2-record-card > header strong { font-size: 12px; }
|
||||
@@ -447,7 +447,7 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
.v2-single-map-card footer span { display: inline-flex; min-width: 0; align-items: center; gap: 7px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.v2-map-source-link { display: inline-flex; min-width: 0; align-items: center; gap: 7px; overflow: hidden; border: 0; background: transparent; padding: 0; color: #64748b; cursor: pointer; text-align: left; text-overflow: ellipsis; white-space: nowrap; font: inherit; }
|
||||
.v2-single-map-card footer time { white-space: nowrap; font-variant-numeric: tabular-nums; }
|
||||
.v2-archive-card { grid-column: 2; grid-row: 1; }
|
||||
.v2-archive-card { grid-column: 2; grid-row: 2; }
|
||||
.v2-record-list { margin: 0; padding: 8px 14px 4px; }
|
||||
.v2-record-list > div { display: grid; grid-template-columns: 92px minmax(0, 1fr); padding: 6px 0; font-size: 10px; }
|
||||
.v2-record-list dt { color: var(--v2-muted); }
|
||||
@@ -456,18 +456,32 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
.v2-record-list dd i.is-online { background: var(--v2-green); }
|
||||
.v2-record-note { margin: 3px 14px 12px; border-radius: 6px; background: #f7f9fc; padding: 8px 10px; color: #79869a; font-size: 8px; line-height: 1.5; }
|
||||
.v2-profile-heading { display: flex; align-items: center; gap: 8px; }.v2-profile-heading button { border: 0; border-radius: 5px; background: var(--v2-blue-soft); padding: 4px 7px; color: var(--v2-blue); font-size: 9px; cursor: pointer; }.v2-profile-form { display: grid; grid-template-columns: 1fr 1fr; gap: 7px 10px; padding: 10px 14px 12px; }.v2-profile-form label { display: grid; gap: 3px; color: var(--v2-muted); font-size: 8px; }.v2-profile-form input, .v2-profile-form select { min-width: 0; height: 29px; border: 1px solid var(--v2-border); border-radius: 5px; background: #fff; padding: 0 7px; color: var(--v2-text); font-size: 9px; }.v2-profile-form > p { grid-column: 1 / -1; margin: 0; color: var(--v2-red); font-size: 8px; }.v2-profile-form footer { display: flex; grid-column: 1 / -1; justify-content: flex-end; gap: 7px; }.v2-profile-form footer button { height: 28px; border: 1px solid var(--v2-border); border-radius: 5px; background: #fff; padding: 0 10px; font-size: 9px; cursor: pointer; }.v2-profile-form footer button.is-primary { border-color: var(--v2-blue); background: var(--v2-blue); color: #fff; }
|
||||
.v2-live-card { grid-column: 2; grid-row: 2; }
|
||||
.v2-live-card > header span { display: inline-flex; align-items: center; gap: 5px; }
|
||||
.v2-live-card > header span > i { width: 7px; height: 7px; border-radius: 50%; background: #aab3c0; }
|
||||
.v2-live-card > header span > i.is-online { background: var(--v2-green); box-shadow: 0 0 0 4px rgba(26,160,109,.1); }
|
||||
.v2-live-overview { border-color: #cfddf0; background: linear-gradient(135deg,#fff 0%,#fbfdff 72%,#f3f8ff 100%); }
|
||||
.v2-live-overview .v2-live-grid { grid-template-columns: repeat(6,minmax(0,1fr)); }
|
||||
.v2-live-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
|
||||
.v2-live-grid > div { min-width: 0; padding: 12px 14px; }
|
||||
.v2-live-grid > div + div { border-left: 1px solid var(--v2-border); }
|
||||
.v2-live-grid > div:nth-child(4) { border-left: 0; }
|
||||
.v2-live-grid > div:nth-child(n+4) { border-top: 1px solid var(--v2-border); }
|
||||
.v2-live-overview .v2-live-grid > div:nth-child(4) { border-left: 1px solid var(--v2-border); }
|
||||
.v2-live-overview .v2-live-grid > div:nth-child(n+4) { border-top: 0; }
|
||||
.v2-live-grid small { display: block; color: var(--v2-muted); font-size: 9px; }
|
||||
.v2-live-grid strong { display: block; margin-top: 5px; overflow: hidden; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; }
|
||||
.v2-live-grid strong.is-text { font-size: 14px; }
|
||||
.v2-live-source-link { margin-top: 5px; font-size: 17px; font-variant-numeric: tabular-nums; }
|
||||
.v2-live-grid em { margin-left: 3px; color: var(--v2-muted); font-size: 8px; font-style: normal; font-weight: 500; }
|
||||
.v2-telemetry-card { grid-column: 1; grid-row: 2 / span 2; }
|
||||
.v2-current-location { display: grid; min-height: 52px; grid-template-columns: minmax(280px,.8fr) minmax(420px,1.2fr); border-top: 1px solid var(--v2-border); }
|
||||
.v2-current-location > span { display: grid; min-width: 0; grid-template-columns: auto auto minmax(0,1fr); align-items: center; gap: 8px; padding: 8px 14px; color: #64748b; }
|
||||
.v2-current-location > span + span { border-left: 1px solid var(--v2-border); }
|
||||
.v2-current-location small { color: var(--v2-muted); font-size: 9px; white-space: nowrap; }
|
||||
.v2-current-location strong { min-width: 0; overflow: hidden; color: #3d4c62; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; }
|
||||
.v2-current-location button { width: max-content; max-width: 100%; height: 28px; overflow: hidden; border: 1px solid #bfd4f6; border-radius: 6px; background: #f3f7ff; padding: 0 9px; color: var(--v2-blue); cursor: pointer; text-overflow: ellipsis; white-space: nowrap; font-size: 9px; }
|
||||
.v2-current-location button.is-error { border-color: #edb5b0; background: #fff; color: var(--v2-red); }
|
||||
.v2-current-address { grid-template-columns: auto minmax(0,1fr) auto !important; }
|
||||
.v2-telemetry-card { grid-column: 1; grid-row: 2; }
|
||||
.v2-telemetry-card nav { display: flex; height: 42px; align-items: stretch; border-bottom: 1px solid var(--v2-border); padding: 0 8px; overflow-x: auto; }
|
||||
.v2-telemetry-card nav button { position: relative; min-width: 78px; border: 0; background: transparent; color: #64748b; cursor: pointer; font-size: 10px; }
|
||||
.v2-telemetry-card nav button.is-active { color: var(--v2-blue); font-weight: 700; }
|
||||
@@ -490,7 +504,7 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
.v2-telemetry-card footer { display: flex; align-items: center; gap: 6px; margin: 8px 10px 10px; border: 1px solid var(--v2-border); border-radius: 7px; padding: 8px 10px; color: #718096; font-size: 9px; }
|
||||
.v2-telemetry-card footer b { color: #526176; font-size: 9px; }
|
||||
.v2-telemetry-card footer small { margin-left: auto; color: #8a96a8; font-size: 8px; }
|
||||
.v2-events-card { grid-column: 2; grid-row: 3; }
|
||||
.v2-events-card { grid-column: 2; grid-row: 1; }
|
||||
.v2-events-card > header a { color: var(--v2-blue); }
|
||||
.v2-event-list { padding: 2px 14px 8px; }
|
||||
.v2-event-row { position: relative; display: grid; min-height: 40px; grid-template-columns: 23px minmax(0, 1fr) auto; align-items: center; gap: 7px; }
|
||||
@@ -1020,6 +1034,10 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
.v2-identity-band { grid-template-columns: minmax(240px, 1fr) minmax(300px, 1fr); }
|
||||
.v2-identity-actions { grid-column: 1 / -1; justify-content: flex-end; border-top: 1px solid var(--v2-border); }
|
||||
.v2-record-grid { grid-template-columns: minmax(460px, 1.5fr) minmax(280px, 1fr); }
|
||||
.v2-live-overview .v2-live-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
|
||||
.v2-live-overview .v2-live-grid > div:nth-child(4) { border-left: 0; }
|
||||
.v2-live-overview .v2-live-grid > div:nth-child(n+4) { border-top: 1px solid var(--v2-border); }
|
||||
.v2-current-location { grid-template-columns: minmax(260px,.8fr) minmax(320px,1.2fr); }
|
||||
.v2-track-toolbar { grid-template-columns: minmax(210px, 1fr) repeat(3, minmax(140px, .7fr)); }
|
||||
.v2-track-toolbar > button { min-width: 100px; }
|
||||
.v2-track-workspace { grid-template-columns: minmax(500px, 1fr) 290px; }
|
||||
@@ -1058,6 +1076,11 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
.v2-identity-actions { grid-column: auto; justify-content: stretch; border: 0; }
|
||||
.v2-identity-actions a { flex: 1; justify-content: center; }
|
||||
.v2-record-grid { display: flex; flex-direction: column; }
|
||||
.v2-live-overview .v2-live-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
|
||||
.v2-live-overview .v2-live-grid > div:nth-child(odd) { border-left: 0; }
|
||||
.v2-live-overview .v2-live-grid > div:nth-child(n+3) { border-top: 1px solid var(--v2-border); }
|
||||
.v2-current-location { grid-template-columns: 1fr; }
|
||||
.v2-current-location > span + span { border-top: 1px solid var(--v2-border); border-left: 0; }
|
||||
.v2-single-map-card { min-height: 360px; }
|
||||
.v2-archive-card, .v2-live-card, .v2-telemetry-card, .v2-events-card { grid-area: auto; }
|
||||
.v2-track-page { height: auto; min-height: 100%; overflow: auto; }
|
||||
@@ -1340,8 +1363,12 @@ button, a { -webkit-tap-highlight-color: transparent; }
|
||||
.v2-telemetry-list { grid-template-columns: 1fr; }
|
||||
.v2-telemetry-list > div:nth-child(odd) { border-right: 0; }
|
||||
.v2-live-grid { grid-template-columns: repeat(2, 1fr); }
|
||||
.v2-live-overview .v2-live-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
|
||||
.v2-live-grid > div:nth-child(3), .v2-live-grid > div:nth-child(5) { border-left: 0; }
|
||||
.v2-live-grid > div:nth-child(n+3) { border-top: 1px solid var(--v2-border); }
|
||||
.v2-current-location > span { grid-template-columns: auto auto minmax(0,1fr); padding: 10px 12px; }
|
||||
.v2-current-address { grid-template-columns: auto minmax(0,1fr) !important; }
|
||||
.v2-current-address > button:last-child { grid-column: 2; }
|
||||
.v2-track-page { padding: 8px; }
|
||||
.v2-track-toolbar { grid-template-columns: 1fr; }
|
||||
.v2-track-vehicle-input { grid-column: auto; }
|
||||
|
||||
Reference in New Issue
Block a user