feat: integrate iFinD data and refine intelligent workspaces
This commit is contained in:
leefer
+245
-1
@@ -23,6 +23,30 @@
|
||||
--r2-card: #fff;
|
||||
--r2-radius: 10px;
|
||||
--r2-shadow: 0 1px 2px rgba(16, 24, 40, .05);
|
||||
/* Dragon profile component tokens. */
|
||||
--dragon-profile-list-width: 340px;
|
||||
--dragon-profile-detail-min-height: 460px;
|
||||
--dragon-profile-list-max-height: 320px;
|
||||
--dragon-profile-row-min-height: 64px;
|
||||
--dragon-profile-row-avatar-size: 36px;
|
||||
--dragon-profile-avatar-size: 72px;
|
||||
--dragon-profile-control-height: 33px;
|
||||
--dragon-profile-gap: 12px;
|
||||
--dragon-profile-panel-padding: 16px;
|
||||
--dragon-profile-row-padding: 10px 12px;
|
||||
--dragon-profile-title-font: 18px;
|
||||
--dragon-profile-name-font: 13px;
|
||||
--dragon-profile-body-font: 12px;
|
||||
--dragon-profile-meta-font: 11px;
|
||||
--dragon-profile-transition: 160ms ease;
|
||||
--dragon-profile-border-width: 1px;
|
||||
--dragon-profile-focus-width: 2px;
|
||||
--dragon-profile-focus-offset: -2px;
|
||||
--dragon-profile-radius-inset: 2px;
|
||||
--dragon-profile-body-line-height: 1.75;
|
||||
--dragon-profile-icon-stroke: 1;
|
||||
--dragon-profile-weight-strong: 750;
|
||||
--dragon-profile-weight-semibold: 600;
|
||||
}
|
||||
|
||||
html,
|
||||
@@ -3582,7 +3606,7 @@ body.sidebar-collapsed .status-bar { left: 64px; }
|
||||
overflow: hidden;
|
||||
border: 1px solid var(--r2-line);
|
||||
border-radius: var(--r2-radius);
|
||||
background: #fff;
|
||||
background: var(--r2-card);
|
||||
box-shadow: var(--r2-shadow);
|
||||
}
|
||||
|
||||
@@ -4483,6 +4507,226 @@ body.sidebar-collapsed .status-bar { left: 64px; }
|
||||
.dragon-search-v2 { transition: none; }
|
||||
}
|
||||
|
||||
/* Dragon profile directory: the master list is authoritative data, while the
|
||||
detail pane only expands fields present in the public directory. */
|
||||
.hot-money-profiles-v2 {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
display: grid;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
gap: var(--dragon-profile-gap);
|
||||
overflow: hidden;
|
||||
}
|
||||
.hot-money-profiles-v2[hidden] { display: none; }
|
||||
|
||||
.hot-money-profile-toolbar-v2 {
|
||||
min-height: calc(var(--dragon-profile-control-height) + var(--dragon-profile-gap));
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--dragon-profile-gap);
|
||||
padding: calc(var(--dragon-profile-gap) / 2) var(--dragon-profile-gap);
|
||||
border: var(--dragon-profile-border-width) solid var(--r2-line);
|
||||
border-radius: var(--r2-radius);
|
||||
background: var(--r2-card);
|
||||
box-shadow: var(--r2-shadow);
|
||||
}
|
||||
.hot-money-profile-toolbar-v2 .dragon-filter-copy-v2 { flex: 1 1 auto; }
|
||||
.hot-money-profile-search-v2 { height: var(--dragon-profile-control-height); }
|
||||
|
||||
.hot-money-profile-summary-v2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--dragon-profile-gap);
|
||||
}
|
||||
.hot-money-profile-summary-v2 > span {
|
||||
display: grid;
|
||||
grid-template-columns: auto auto;
|
||||
align-items: baseline;
|
||||
gap: calc(var(--dragon-profile-gap) / 2);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.hot-money-profile-summary-v2 small {
|
||||
color: var(--r2-faint);
|
||||
font-size: var(--dragon-profile-meta-font);
|
||||
}
|
||||
.hot-money-profile-summary-v2 strong {
|
||||
color: var(--r2-ink);
|
||||
font-size: var(--dragon-profile-name-font);
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.hot-money-profile-workspace-v2 {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
display: grid;
|
||||
grid-template-columns: var(--dragon-profile-list-width) minmax(0, 1fr);
|
||||
gap: var(--dragon-profile-gap);
|
||||
}
|
||||
.hot-money-profile-directory-v2,
|
||||
.hot-money-profile-detail-v2 {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
border: var(--dragon-profile-border-width) solid var(--r2-line);
|
||||
border-radius: var(--r2-radius);
|
||||
background: var(--r2-card);
|
||||
box-shadow: var(--r2-shadow);
|
||||
}
|
||||
.hot-money-profile-directory-v2 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.hot-money-profile-directory-head-v2 {
|
||||
min-height: var(--dragon-profile-control-height);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 var(--dragon-profile-gap);
|
||||
border-bottom: var(--dragon-profile-border-width) solid var(--r2-line-soft);
|
||||
}
|
||||
.hot-money-profile-directory-head-v2 strong {
|
||||
color: var(--r2-ink);
|
||||
font-size: var(--dragon-profile-body-font);
|
||||
}
|
||||
.hot-money-profile-directory-head-v2 span {
|
||||
color: var(--r2-faint);
|
||||
font-size: var(--dragon-profile-meta-font);
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.hot-money-profile-list-v2 {
|
||||
min-height: 0;
|
||||
flex: 1 1 auto;
|
||||
overflow-y: auto;
|
||||
overscroll-behavior: contain;
|
||||
}
|
||||
.hot-money-profile-row-v2 {
|
||||
width: 100%;
|
||||
min-height: var(--dragon-profile-row-min-height);
|
||||
display: grid;
|
||||
grid-template-columns: auto var(--dragon-profile-row-avatar-size) minmax(0, 1fr) auto;
|
||||
align-items: center;
|
||||
gap: calc(var(--dragon-profile-gap) / 2);
|
||||
padding: var(--dragon-profile-row-padding);
|
||||
border: 0;
|
||||
border-bottom: var(--dragon-profile-border-width) solid var(--r2-line-soft);
|
||||
background: transparent;
|
||||
text-align: left;
|
||||
transition: background-color var(--dragon-profile-transition), color var(--dragon-profile-transition);
|
||||
}
|
||||
.hot-money-profile-row-v2:hover { background: var(--r2-bg); }
|
||||
.hot-money-profile-row-v2.selected { background: var(--r2-blue-soft); }
|
||||
.hot-money-profile-row-v2:focus-visible { outline: var(--dragon-profile-focus-width) solid var(--r2-blue); outline-offset: var(--dragon-profile-focus-offset); }
|
||||
.hot-money-profile-index-v2 {
|
||||
color: var(--r2-faint);
|
||||
font-size: var(--dragon-profile-meta-font);
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.hot-money-profile-monogram-v2,
|
||||
.hot-money-profile-avatar-v2 {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
border-radius: var(--r2-radius);
|
||||
background: var(--r2-blue-soft);
|
||||
color: var(--r2-blue);
|
||||
font-weight: var(--dragon-profile-weight-strong);
|
||||
}
|
||||
.hot-money-profile-monogram-v2 {
|
||||
width: var(--dragon-profile-row-avatar-size);
|
||||
height: var(--dragon-profile-row-avatar-size);
|
||||
font-size: var(--dragon-profile-meta-font);
|
||||
}
|
||||
.hot-money-profile-row-copy-v2 { min-width: 0; }
|
||||
.hot-money-profile-row-copy-v2 strong,
|
||||
.hot-money-profile-row-copy-v2 small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.hot-money-profile-row-copy-v2 strong { color: var(--r2-ink); font-size: var(--dragon-profile-name-font); }
|
||||
.hot-money-profile-row-copy-v2 small { margin-top: calc(var(--dragon-profile-gap) / 4); color: var(--r2-faint); font-size: var(--dragon-profile-meta-font); }
|
||||
.hot-money-profile-seat-count-v2 {
|
||||
color: var(--r2-sub);
|
||||
font-size: var(--dragon-profile-meta-font);
|
||||
font-variant-numeric: tabular-nums;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.hot-money-profile-detail-v2 {
|
||||
min-height: var(--dragon-profile-detail-min-height);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.hot-money-profile-detail-head-v2 {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--dragon-profile-gap);
|
||||
padding: var(--dragon-profile-panel-padding);
|
||||
border-bottom: var(--dragon-profile-border-width) solid var(--r2-line-soft);
|
||||
}
|
||||
.hot-money-profile-avatar-v2 {
|
||||
width: var(--dragon-profile-avatar-size);
|
||||
height: var(--dragon-profile-avatar-size);
|
||||
flex: 0 0 var(--dragon-profile-avatar-size);
|
||||
font-size: var(--dragon-profile-title-font);
|
||||
}
|
||||
.hot-money-profile-detail-head-v2 > div { min-width: 0; }
|
||||
.hot-money-profile-detail-head-v2 small,
|
||||
.hot-money-profile-detail-head-v2 span { display: block; color: var(--r2-faint); font-size: var(--dragon-profile-meta-font); }
|
||||
.hot-money-profile-detail-head-v2 h3 { margin: calc(var(--dragon-profile-gap) / 3) 0; color: var(--r2-ink); font-size: var(--dragon-profile-title-font); }
|
||||
.hot-money-profile-section-v2 { padding: var(--dragon-profile-panel-padding); border-bottom: var(--dragon-profile-border-width) solid var(--r2-line-soft); }
|
||||
.hot-money-profile-section-v2 h4 { margin: 0 0 calc(var(--dragon-profile-gap) / 2); color: var(--r2-ink); font-size: var(--dragon-profile-name-font); }
|
||||
.hot-money-profile-section-v2 p { margin: 0; color: var(--r2-sub); font-size: var(--dragon-profile-body-font); line-height: var(--dragon-profile-body-line-height); white-space: pre-line; }
|
||||
.hot-money-profile-section-v2 p.is-empty { color: var(--r2-faint); }
|
||||
.hot-money-profile-section-title-v2 { display: flex; align-items: center; justify-content: space-between; }
|
||||
.hot-money-profile-section-title-v2 span { color: var(--r2-faint); font-size: var(--dragon-profile-meta-font); }
|
||||
.hot-money-profile-organizations-v2 { display: grid; gap: calc(var(--dragon-profile-gap) / 2); }
|
||||
.hot-money-profile-organizations-v2 > span {
|
||||
min-height: var(--dragon-profile-control-height);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: calc(var(--dragon-profile-gap) / 2);
|
||||
padding: 0 var(--dragon-profile-gap);
|
||||
border: var(--dragon-profile-border-width) solid var(--r2-line-soft);
|
||||
border-radius: calc(var(--r2-radius) - var(--dragon-profile-radius-inset));
|
||||
background: var(--r2-bg);
|
||||
color: var(--r2-ink);
|
||||
font-size: var(--dragon-profile-body-font);
|
||||
}
|
||||
.hot-money-profile-organizations-v2 .lucide { width: var(--dragon-profile-name-font); height: var(--dragon-profile-name-font); color: var(--r2-sub); }
|
||||
.hot-money-profile-notice-v2 { margin: auto var(--dragon-profile-panel-padding) var(--dragon-profile-panel-padding); color: var(--r2-amber); font-size: var(--dragon-profile-meta-font); }
|
||||
.hot-money-profile-empty-v2,
|
||||
.hot-money-profile-list-empty-v2 {
|
||||
min-height: var(--dragon-profile-detail-min-height);
|
||||
display: grid;
|
||||
place-items: center;
|
||||
align-content: center;
|
||||
gap: calc(var(--dragon-profile-gap) / 2);
|
||||
color: var(--r2-faint);
|
||||
text-align: center;
|
||||
}
|
||||
.hot-money-profile-list-empty-v2 { min-height: var(--dragon-profile-row-min-height); }
|
||||
.hot-money-profile-empty-v2 .lucide,
|
||||
.hot-money-profile-list-empty-v2 .lucide { width: var(--dragon-profile-avatar-size); height: var(--dragon-profile-avatar-size); stroke-width: var(--dragon-profile-icon-stroke); }
|
||||
.hot-money-profile-list-empty-v2 .lucide { width: var(--dragon-profile-row-avatar-size); height: var(--dragon-profile-row-avatar-size); }
|
||||
.hot-money-profile-empty-v2 strong,
|
||||
.hot-money-profile-list-empty-v2 span { font-size: var(--dragon-profile-body-font); font-weight: var(--dragon-profile-weight-semibold); }
|
||||
|
||||
@media (min-width: 721px) {
|
||||
body[data-active-view="dragonView"] .hot-money-profiles-v2 { flex: 1 1 auto; }
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.hot-money-profiles-v2 { overflow: visible; }
|
||||
.hot-money-profile-toolbar-v2 { align-items: stretch; flex-direction: column; }
|
||||
.hot-money-profile-summary-v2 { justify-content: space-between; }
|
||||
.hot-money-profile-search-v2 { width: 100%; }
|
||||
.hot-money-profile-workspace-v2 { grid-template-columns: minmax(0, 1fr); }
|
||||
.hot-money-profile-list-v2 { max-height: var(--dragon-profile-list-max-height); }
|
||||
.hot-money-profile-detail-v2 { min-height: 0; }
|
||||
.hot-money-profile-detail-head-v2 { align-items: flex-start; }
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.hot-money-profile-row-v2 { transition: none; }
|
||||
}
|
||||
|
||||
/* Stage 15: screener rebuilt from the approved reference layout. */
|
||||
#screenerView {
|
||||
--scr-blue: #2563eb;
|
||||
|
||||
Reference in New Issue
Block a user