feat: expand intelligent investigation workspace
This commit is contained in:
+138
-88
@@ -795,20 +795,12 @@ button:disabled {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
|
||||
.agent-panel-history-extension .agent-panel-control,
|
||||
.agent-panel-composer > .agent-panel-control {
|
||||
border: 0;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.agent-panel-history-extension {
|
||||
border: 0;
|
||||
border-radius: 0 0 var(--radius-panel) var(--radius-panel);
|
||||
background-color: var(--agent-floating-reading-surface);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.agent-panel-composer,
|
||||
.agent-conversation-scroll-button,
|
||||
.agent-speech-selection-action {
|
||||
@@ -825,21 +817,6 @@ button:disabled {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.agent-panel-history-extension .agent-history-item,
|
||||
.agent-panel-history-extension .agent-history-state {
|
||||
background-color: var(--agent-floating-reading-item);
|
||||
}
|
||||
|
||||
@media (hover: hover) {
|
||||
.agent-panel-history-extension .agent-history-item:hover {
|
||||
background-color: var(--agent-floating-reading-item-hover);
|
||||
}
|
||||
}
|
||||
|
||||
.agent-panel-history-extension .agent-history-item-active {
|
||||
background-color: var(--agent-floating-reading-active);
|
||||
}
|
||||
|
||||
button.agent-history-session-trigger:not(:disabled):active {
|
||||
outline: none;
|
||||
}
|
||||
@@ -1301,20 +1278,6 @@ button.agent-history-session-trigger:not(:disabled):active {
|
||||
box-shadow: var(--shadow-agent-history-bottom);
|
||||
}
|
||||
|
||||
.agent-panel-shell[data-agent-presentation="desktop-dock"] .agent-panel-history-extension {
|
||||
border-radius: 0 0 12px 12px;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
backdrop-filter: none;
|
||||
-webkit-backdrop-filter: none;
|
||||
}
|
||||
|
||||
.agent-panel-shell[data-agent-presentation="desktop-dock"] .agent-panel-history-extension .agent-panel-control {
|
||||
border: 0;
|
||||
background: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
|
||||
.agent-panel-shell[data-agent-presentation="desktop-dock"],
|
||||
.agent-panel-overlay[data-agent-presentation="desktop-dock"] {
|
||||
@@ -1483,38 +1446,37 @@ button.agent-history-session-trigger:not(:disabled):active {
|
||||
}
|
||||
|
||||
.investigation-detail-backdrop {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 90;
|
||||
background: color-mix(in srgb, var(--palette-paper) 76%, transparent);
|
||||
}
|
||||
|
||||
.investigation-detail-positioner {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 91;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.investigation-detail-panel {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: min(44rem, calc(100vw - 2rem));
|
||||
max-height: min(86dvh, 56rem);
|
||||
z-index: 91;
|
||||
width: calc(100vw - 32px);
|
||||
max-width: 896px;
|
||||
max-height: min(84dvh, 900px);
|
||||
min-height: 0;
|
||||
overflow: hidden;
|
||||
pointer-events: auto;
|
||||
border: 1px solid var(--surface-divider);
|
||||
background: var(--palette-paper);
|
||||
box-shadow: 0 16px 48px rgb(38 51 77 / 12%);
|
||||
gap: 0;
|
||||
padding: 0;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.investigation-detail-panel-wide { width: min(70rem, calc(100vw - 2rem)); }
|
||||
.investigation-detail-heading { flex-shrink: 0; padding: 1rem; border-bottom: 1px solid var(--surface-divider); }
|
||||
.investigation-detail-scroll { min-height: 0; overflow: auto; padding: 1rem; overscroll-behavior: contain; scrollbar-gutter: stable; overflow-wrap: anywhere; }
|
||||
.investigation-detail-panel-wide { max-width: 1120px; }
|
||||
.investigation-detail-heading { flex-shrink: 0; padding: 16px; }
|
||||
.investigation-detail-scroll { min-height: 0; overflow: auto; padding: 20px; overscroll-behavior: contain; scrollbar-gutter: stable; overflow-wrap: anywhere; font-size: 16px; line-height: 1.85; }
|
||||
.investigation-detail-scroll :is(.text-sm, p:not([class]), li) { font-size: 16px; line-height: 1.85; }
|
||||
.investigation-detail-scroll > .investigation-report-section { padding: 0; border: 0; }
|
||||
.investigation-detail-no-motion[data-state] { animation: none; }
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.investigation-detail-panel[data-state],
|
||||
.investigation-detail-backdrop[data-state] { animation: none; }
|
||||
}
|
||||
@media (max-width: 639px) {
|
||||
.investigation-detail-panel { width: calc(100vw - 16px); max-height: min(88dvh, 900px); }
|
||||
.investigation-detail-scroll { padding: 16px; }
|
||||
}
|
||||
.investigation-evidence-preview { display: grid; gap: 0.75rem; margin-top: 0.5rem; }
|
||||
.investigation-conclusion-preview { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
|
||||
|
||||
@@ -1599,13 +1561,15 @@ button.agent-history-session-trigger:not(:disabled):active {
|
||||
margin-block: 0;
|
||||
}
|
||||
|
||||
/* Natural graph height, with only enough room for the existing control rail. */
|
||||
/* Read diagrams at their own scale inside a bounded, pannable canvas. */
|
||||
.investigation-diagram [data-streamdown="mermaid"] > div {
|
||||
min-block-size: calc(var(--diagram-zoom-rail-height) + 1rem);
|
||||
}
|
||||
|
||||
.investigation-diagram [data-streamdown="mermaid"] [role="img"] > svg {
|
||||
width: 100%;
|
||||
width: auto;
|
||||
min-width: 100%;
|
||||
max-width: none;
|
||||
height: auto;
|
||||
animation: investigation-diagram-reveal 180ms cubic-bezier(0.22, 1, 0.36, 1);
|
||||
}
|
||||
@@ -1986,7 +1950,8 @@ details[open] > summary > .disclosure-accordion-indicator {
|
||||
.answer-ui-stack-comparison { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
||||
}
|
||||
|
||||
/* Agent chat: an independent shadcn-style surface, scoped away from the map. */
|
||||
/* Solid shadcn surfaces, scoped away from the map material. */
|
||||
.workbench-shadcn-surface,
|
||||
.agent-panel-shell[data-agent-presentation],
|
||||
.agent-panel-overlay[data-agent-presentation],
|
||||
[data-agent-theme="chat"] {
|
||||
@@ -2293,7 +2258,6 @@ details[open] > summary > .disclosure-accordion-indicator {
|
||||
.resizable-handle:focus-visible .resizable-grip { outline-color: Highlight; }
|
||||
}
|
||||
|
||||
.answer-ui-root { --surface-reading: #ffffff; --surface-control: #f1f5f9; --surface-border: #e2e8f0; --ink: #0f172a; --ink-muted: #64748b; }
|
||||
.answer-content-nav { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; border-bottom: 1px solid var(--surface-divider); }
|
||||
.answer-content-nav > span { min-width: 0; line-height: 1.6; }
|
||||
.answer-ui-root :is(.answer-ui-metric, .answer-ui-chart, .answer-ui-evidence, .answer-ui-location, .answer-ui-form, [data-answer-table]) { scroll-margin-block: 12px; }
|
||||
@@ -2307,13 +2271,10 @@ details[open] > summary > .disclosure-accordion-indicator {
|
||||
.answer-ui-root [data-answer-result] { scroll-margin-block: 12px; }
|
||||
.answer-ui-root [data-answer-result]:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
|
||||
.answer-ui-metric { min-width: 0; border-color: var(--surface-border); background: var(--surface-reading); box-shadow: none; }
|
||||
.answer-ui-metric-content { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 4px; row-gap: 4px; }
|
||||
.answer-ui-metric-content { display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 4px; }
|
||||
.answer-ui-metric-label { grid-column: 1; grid-row: 1; min-width: 0; }
|
||||
.answer-ui-metric-value { grid-column: 1 / -1; grid-row: 2; color: var(--ink); }
|
||||
.answer-ui-metric-source { grid-column: 1 / -1; grid-row: 3; }
|
||||
.answer-ui-metric-ask { display: contents; }
|
||||
.answer-ui-metric-ask > button { grid-column: 2; grid-row: 1; }
|
||||
.answer-ui-metric-ask > [role="status"] { grid-column: 1 / -1; grid-row: 4; }
|
||||
/* Only metric-only comparisons form a compact summary strip. Mixed content keeps its own breakpoint. */
|
||||
.answer-ui-stack-comparison:has(> .answer-ui-metric):not(:has(> :not(.answer-ui-metric))) {
|
||||
gap: 0;
|
||||
@@ -2366,7 +2327,36 @@ details[open] > summary > .disclosure-accordion-indicator {
|
||||
}
|
||||
.agent-report-workspace {
|
||||
container-type: inline-size;
|
||||
background-color: var(--surface-dock);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: var(--surface-reading);
|
||||
}
|
||||
.report-reading-dialog {
|
||||
display: flex;
|
||||
width: calc(100vw - 32px);
|
||||
max-width: 1120px;
|
||||
height: min(84dvh, 900px);
|
||||
max-height: calc(100dvh - 32px);
|
||||
gap: 0;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
border-radius: 12px;
|
||||
background: var(--surface-reading);
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.report-reading-dialog[data-state],
|
||||
.markdown-reading-window[data-state],
|
||||
.report-reading-backdrop[data-state],
|
||||
.markdown-reading-backdrop[data-state] { animation: none; }
|
||||
.markdown-diagram-renderer [role="application"],
|
||||
.investigation-diagram [role="application"] { transition: none; }
|
||||
}
|
||||
.report-reading-split {
|
||||
inset: 72px 24px 24px;
|
||||
max-width: 1120px;
|
||||
max-height: 900px;
|
||||
margin-inline: auto;
|
||||
background-color: var(--surface-reading);
|
||||
}
|
||||
.agent-report-workspace > header { background: transparent; }
|
||||
.agent-report-workspace .answer-ui-root { container-type: inline-size; }
|
||||
@@ -2375,6 +2365,8 @@ details[open] > summary > .disclosure-accordion-indicator {
|
||||
.investigation-report .investigation-conclusion-preview { display: block; -webkit-line-clamp: unset; }
|
||||
.agent-report-workspace .investigation-report-header h2 { font-size: 20px; line-height: 28px; }
|
||||
.agent-report-workspace .investigation-conclusion-preview { font-size: 16px; line-height: 26px; }
|
||||
.agent-report-workspace .answer-ui-root [data-interactive-table] table { font-size: 15px; line-height: 1.65; }
|
||||
.agent-report-workspace .answer-ui-root [data-interactive-table] :is(th, td) { padding: 10px 12px; }
|
||||
.agent-report-workspace .investigation-report-header { padding: 0 0 16px; }
|
||||
.agent-report-workspace .investigation-report > .investigation-report-section {
|
||||
margin: 0;
|
||||
@@ -2403,10 +2395,26 @@ details[open] > summary > .disclosure-accordion-indicator {
|
||||
.investigation-report-navigation [aria-current="location"] { background: var(--surface-control); color: var(--ink); font-weight: 600; }
|
||||
.agent-report-workspace .investigation-report-navigation + .investigation-report-section { border-top: 0; }
|
||||
.agent-report-workspace [data-expandable-reading] { min-width: 0; }
|
||||
.answer-ui-root [data-interactive-table] input { background: #ffffff; }
|
||||
.answer-ui-root [data-interactive-table] input:not([type="checkbox"]):not([type="radio"]) { background: #ffffff; }
|
||||
|
||||
/* One answer becomes a working surface when its actual content warrants it. */
|
||||
.answer-task-layout, .answer-task-layout-simple { display: grid; min-width: 0; gap: 16px; }
|
||||
.answer-task-overview { grid-column: 1 / -1; min-width: 0; }
|
||||
.answer-task-support-section { min-width: 0; }
|
||||
.answer-task-support-section[data-grouped] { border-top: 1px solid var(--surface-divider); }
|
||||
.answer-task-support:empty { display: none; }
|
||||
.answer-chart-range-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 8px; }
|
||||
.answer-chart-range-summary > :last-child { grid-column: 1 / -1; }
|
||||
@container (min-width: 800px) {
|
||||
.answer-task-layout { grid-template-columns: minmax(0, 1fr) minmax(260px, 0.62fr); align-items: start; gap: 18px 24px; }
|
||||
.answer-task-layout .answer-task-support { padding-left: 20px; border-left: 1px solid var(--surface-divider); }
|
||||
.answer-task-layout .answer-task-support-section:first-child { border-top: 0; }
|
||||
}
|
||||
|
||||
@media (max-width: 639px) {
|
||||
.agent-chat-message-list { padding-inline: 0; }
|
||||
.report-reading-dialog { width: calc(100vw - 16px); height: min(88dvh, 900px); max-height: calc(100dvh - 16px); }
|
||||
.report-reading-split { inset: 64px 8px 12px; max-height: calc(100dvh - 76px); }
|
||||
.agent-panel-shell[data-agent-presentation] { --agent-message-list-inset: 0px; }
|
||||
.answer-ui-evidence [data-slot="button"] { gap: 6px; }
|
||||
}
|
||||
@media (forced-colors: active) {
|
||||
@@ -2460,23 +2468,65 @@ body:has(:is(.agent-history-dialog, .agent-topic-dialog)[data-state="open"]) [da
|
||||
}
|
||||
}
|
||||
|
||||
/* One answer becomes a working surface when its actual content warrants it. */
|
||||
.answer-task-layout, .answer-task-layout-simple { display: grid; min-width: 0; gap: 16px; }
|
||||
.answer-task-overview { grid-column: 1 / -1; min-width: 0; }
|
||||
.answer-task-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; border-top: 1px solid var(--surface-divider); padding-top: 12px; font-size: 12px; font-weight: 500; }
|
||||
.answer-task-heading > span + span { font-size: 11px; font-weight: 400; color: var(--ink-muted); }
|
||||
.answer-task-support-section { min-width: 0; border-top: 1px solid var(--surface-divider); }
|
||||
.answer-task-layout-simple .answer-task-support-section { border: 0; }
|
||||
.answer-task-layout-simple .answer-task-support-content { padding-top: 0; }
|
||||
.answer-task-support:empty { display: none; }
|
||||
.answer-ui-metric-actions { grid-column: 2; grid-row: 1; align-self: start; }
|
||||
.answer-chart-range-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 8px; }
|
||||
.answer-chart-range-summary > :last-child { grid-column: 1 / -1; }
|
||||
.answer-selection-tray { margin-top: 16px; }
|
||||
.answer-selection-tray summary::marker { color: var(--ink-muted); }
|
||||
@container (min-width: 800px) {
|
||||
.answer-task-layout { grid-template-columns: minmax(0, 1fr) minmax(260px, 0.62fr); align-items: start; gap: 18px 24px; }
|
||||
.answer-task-layout .answer-task-heading { border-top: 0; padding-top: 0; }
|
||||
.answer-task-layout .answer-task-support { padding-left: 20px; border-left: 1px solid var(--surface-divider); }
|
||||
.answer-task-layout .answer-task-support-section:first-child { border-top: 0; }
|
||||
/* Dev and peripheral panels share the solid theme, including their portaled controls. */
|
||||
.workbench-shadcn-surface {
|
||||
--surface-dock: var(--surface-reading);
|
||||
--surface-well: var(--surface-control);
|
||||
--action-shadow-primary: none;
|
||||
--action-shadow-primary-pressed: none;
|
||||
--action-shadow-secondary: none;
|
||||
--action-shadow-secondary-pressed: none;
|
||||
}
|
||||
.workbench-shadcn-surface [data-slot="button"] {
|
||||
border-radius: var(--radius-md);
|
||||
font-weight: 500;
|
||||
}
|
||||
.workbench-shadcn-surface [data-slot="workbench-section"] {
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: none;
|
||||
}
|
||||
.workbench-shadcn-surface [data-slot="workbench-section-header"] {
|
||||
background: var(--surface-reading);
|
||||
}
|
||||
.workbench-shadcn-surface [data-slot="workbench-section-header"] > span {
|
||||
background: var(--surface-control);
|
||||
color: var(--ink-muted);
|
||||
}
|
||||
.workbench-shadcn-surface [data-slot="workbench-notice"] {
|
||||
border: 1px solid var(--surface-divider);
|
||||
border-radius: var(--radius-lg);
|
||||
background: var(--surface-reading);
|
||||
}
|
||||
.workbench-shadcn-surface [data-slot="workbench-notice"][data-tone="info"] {
|
||||
color: var(--ink);
|
||||
}
|
||||
.workbench-shadcn-surface [data-disclosure-indicator="accordion"] {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
@media (max-width: 639px) {
|
||||
.workbench-shadcn-surface [data-slot="workbench-section-header"] {
|
||||
display: grid;
|
||||
grid-template-columns: auto minmax(0, 1fr) auto;
|
||||
align-items: center;
|
||||
gap: 8px 12px;
|
||||
}
|
||||
.workbench-shadcn-surface [data-slot="workbench-section-heading"] { display: contents; }
|
||||
.workbench-shadcn-surface [data-slot="workbench-section-heading"] > div {
|
||||
grid-column: 2;
|
||||
grid-row: 1;
|
||||
}
|
||||
.workbench-shadcn-surface [data-slot="workbench-section-heading"] > p {
|
||||
grid-column: 1 / -1;
|
||||
grid-row: 2;
|
||||
}
|
||||
.workbench-shadcn-surface [data-slot="workbench-section-actions"] {
|
||||
grid-column: 3;
|
||||
grid-row: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Retain monospace JSON while allowing Chinese values and placeholders to render. */
|
||||
.workbench-shadcn-surface .font-mono {
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", "Noto Sans SC Variable", monospace;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user