refine Semi UI account access readiness

2026-07-18 19:41:01 +08:00
parent 532524b992
commit e95fbe5c19
3 changed files with 252 additions and 22 deletions
--- a/vehicle-data-platform/apps/web/src/v2/styles/workspace.css
+++ b/vehicle-data-platform/apps/web/src/v2/styles/workspace.css
@@ -15512,3 +15512,179 @@
    font-size: 7px;
  }
 }
+
+/*
+ * Semi UI account access readiness.
+ * The directory now answers the operator's first question — can this customer
+ * actually use the platform — before exposing the underlying counts.
+ */
+.v2-user-directory-summary > .semi-tag.is-attention {
+  min-width: 70px;
+  justify-content: center;
+}
+
+.v2-user-directory-summary > .semi-typography.is-ready {
+  color: #397b60;
+}
+
+.v2-customer-list .v2-user-list-row.has-attention.semi-list-item {
+  border-color: #ead9b8;
+  background: linear-gradient(110deg, #fffdf8 0%, #fbfcfe 72%);
+}
+
+.v2-customer-list .v2-user-list-row.is-access-disabled.semi-list-item {
+  background: #f8fafc;
+}
+
+.v2-customer-list .v2-user-list-row.has-attention.semi-list-item:hover {
+  border-color: #ddc38f;
+  box-shadow: 0 7px 18px rgba(125, 87, 25, .07);
+}
+
+.v2-user-list-facts b > i {
+  color: #8a98aa;
+  font-size: 10px;
+  font-style: normal;
+  font-weight: 550;
+}
+
+.v2-user-status-tag.semi-tag {
+  min-width: 76px;
+}
+
+.v2-user-status-tag.is-ready.semi-tag {
+  color: #287456;
+}
+
+.v2-user-status-tag.is-missing-menus.semi-tag,
+.v2-user-status-tag.is-missing-vehicles.semi-tag {
+  color: #8a611e;
+}
+
+.v2-user-status-tag-mobile {
+  display: none;
+}
+
+.v2-user-editor-sheet-title > span {
+  gap: 5px;
+}
+
+.v2-user-editor-context {
+  display: flex;
+  min-width: 0;
+  align-items: center;
+  gap: 0;
+  color: #728197;
+  font-size: 10px;
+  font-weight: 550;
+  line-height: 1.4;
+  white-space: nowrap;
+}
+
+.v2-user-editor-context > span {
+  position: relative;
+  min-width: 0;
+}
+
+.v2-user-editor-context > span + span {
+  margin-left: 9px;
+  padding-left: 10px;
+}
+
+.v2-user-editor-context > span + span::before {
+  position: absolute;
+  top: 50%;
+  left: 0;
+  width: 2px;
+  height: 2px;
+  border-radius: 50%;
+  background: #a8b4c3;
+  content: '';
+  transform: translateY(-50%);
+}
+
+.v2-user-editor-context > span > b {
+  color: #344c65;
+  font-size: inherit;
+  font-weight: 750;
+}
+
+.v2-user-editor-context > .is-account {
+  overflow: hidden;
+  max-width: 180px;
+  color: #5e7188;
+  text-overflow: ellipsis;
+}
+
+.v2-user-editor-access-tag.semi-tag {
+  min-height: 22px;
+  flex: 0 0 auto;
+  justify-content: center;
+  margin-left: 10px;
+  border-radius: 999px;
+  padding-inline: 8px;
+  font-size: 9px;
+  font-weight: 700;
+}
+
+@media (max-width: 980px) and (min-width: 681px) {
+  .v2-user-status-tag.semi-tag {
+    min-width: 68px;
+  }
+
+  .v2-user-editor-last-login {
+    display: none;
+  }
+}
+
+@media (max-width: 680px) {
+  .v2-user-directory-summary > .semi-tag.is-attention {
+    min-width: 60px;
+  }
+
+  .v2-user-status-tag.semi-tag {
+    min-width: 48px;
+    padding-inline: 6px;
+  }
+
+  .v2-user-status-tag-desktop {
+    display: none;
+  }
+
+  .v2-user-status-tag-mobile {
+    display: inline;
+  }
+
+  .v2-user-list-facts b > i {
+    font-size: 9px;
+  }
+
+  .v2-user-editor-sidesheet .semi-sidesheet-header {
+    min-height: 76px;
+  }
+
+  .v2-user-editor-context {
+    max-width: 262px;
+    font-size: 9px;
+  }
+
+  .v2-user-editor-context > span + span {
+    margin-left: 6px;
+    padding-left: 7px;
+  }
+
+  .v2-user-editor-context > .is-account {
+    max-width: 94px;
+  }
+
+  .v2-user-editor-last-login {
+    display: none;
+  }
+
+  .v2-user-editor-access-tag.semi-tag {
+    min-height: 20px;
+    margin-left: 7px;
+    padding-inline: 6px;
+    font-size: 8px;
+  }
+}