Yashas
e90e4204ec
Visual and information-architecture pass across every screen. No API call, payload, poll, permission rule or workflow mirror changes; forms still render from the live schema and the timeline's merge/grouping is unchanged (only the display order is reversible). Design language - Ground + white cards with one hairline and one radius; sentence-case headings; shared primitives in index.css (.card .pill .btn .avatar .live). - One inline icon set (components/Icon.jsx); no more filled navy/red tiles. - Read-side labels in api/display.js: roles and enum tokens humanized, customer initials/tones, money and date formatters. Nothing sent changes. Shell - 56px header with brand, global lead search (portfolio rows, "/" to focus) and identity chip with a human role label. - Sidebar rows carry icons and a clear active bar; AI roster at the foot, each opening its remit card. Login - Operator copy instead of retail copy; centred sign-in card with show/hide password; demo persona picker that fills the EMAIL only. Overview - "Who holds the work" as four quiet cards that warm only when owed. - Pipeline flow bar with every stage named beneath it; KPI strip in a card. - Action rows with chevron / view-only eye; expiry bands filter the table. Queues - Filter bar (search, product, channel, expiry band, stalled, hide closed) and sortable columns, all client-side on the fetched page. - Avatars, product/channel chips, stage chips for closed leads, tinted stalled rows, count inline with the title. Lead - Avatar + chips in the header; metrics card with the stage rail inside, and a branch node for Referred / Parked / Lost / Declined. - Timeline newest-first by default (toggle), the worker's face as the node, one footer row per entry, AI markdown rendered as bold. - "AI team on this lead" panel with per-agent step counts; PDF tags on docs. Forms & dialogs - Required marked with an asterisk + legend; "Select…" placeholder; dd Mon yyyy hint under date inputs; open activity form in a titled panel; one-line dialog footnotes. Fixes: horizontal overflow at 1024px, boxed "in N days" figure, raw tokens (sme_underwriter, verbal_call, Rsa), findings cut at "1.". Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
81 lines
1.6 KiB
CSS
81 lines
1.6 KiB
CSS
.conv { max-height: min(80vh, 760px); }
|
|
|
|
.conv__body {
|
|
overflow-y: auto;
|
|
padding: 18px 22px 8px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 10px;
|
|
}
|
|
|
|
.conv__empty {
|
|
margin: 0;
|
|
padding: 24px 0;
|
|
text-align: center;
|
|
font-size: var(--fs-xs);
|
|
color: var(--zk-grey);
|
|
}
|
|
|
|
/* Theirs left, ours right: the arrangement everybody reads without being told,
|
|
which is the whole reason to render a thread rather than a log. */
|
|
.bub {
|
|
max-width: 78%;
|
|
padding: 9px 13px 7px;
|
|
border-radius: 14px;
|
|
}
|
|
|
|
.bub p {
|
|
margin: 0;
|
|
font-size: var(--fs-sm);
|
|
line-height: 1.5;
|
|
white-space: pre-wrap;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.bub span {
|
|
display: block;
|
|
margin-top: 4px;
|
|
font-size: var(--fs-2xs);
|
|
opacity: 0.65;
|
|
}
|
|
|
|
.bub--them {
|
|
align-self: flex-start;
|
|
background: var(--zk-ground);
|
|
border: 1px solid var(--zk-card-line);
|
|
color: var(--zk-ink);
|
|
border-bottom-left-radius: 4px;
|
|
}
|
|
|
|
.bub--us {
|
|
align-self: flex-end;
|
|
background: var(--zk-blue);
|
|
color: #fff;
|
|
border-bottom-right-radius: 4px;
|
|
}
|
|
.bub--us span { opacity: .8; }
|
|
|
|
.conv__note {
|
|
margin: 0;
|
|
padding: 12px 22px 18px;
|
|
border-top: 1px solid var(--zk-line-soft);
|
|
font-size: var(--fs-2xs);
|
|
line-height: 1.5;
|
|
color: var(--zk-grey);
|
|
}
|
|
|
|
/* A transcript the parser could not split into turns is still evidence.
|
|
Shown raw rather than replaced with "nothing to display". */
|
|
.conv__raw {
|
|
margin: 0;
|
|
padding: 14px 16px;
|
|
font: inherit;
|
|
font-size: var(--fs-2xs);
|
|
line-height: 1.6;
|
|
white-space: pre-wrap;
|
|
overflow-wrap: anywhere;
|
|
color: var(--zk-muted);
|
|
background: var(--zk-tint);
|
|
border-radius: var(--r-md);
|
|
}
|