111 lines
2.3 KiB
CSS
111 lines
2.3 KiB
CSS
.root {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.root:not([data-expanded]) {
|
||
contain: size layout;
|
||
height: calc(24px + var(--dsh-content-font-delta, 0px));
|
||
}
|
||
|
||
.row {
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
|
||
/* The uncapped body scrolls with the conversation; keep its collapse toggle
|
||
reachable. Compact Markdown code banners stay in flow below this header. */
|
||
.root[data-expanded] [data-open] [data-disclosure-row] {
|
||
position: sticky;
|
||
top: 0;
|
||
z-index: 1;
|
||
background: var(--dsw-alias-bg-base);
|
||
}
|
||
|
||
.root[data-state='running'] .row::after {
|
||
content: '';
|
||
position: absolute;
|
||
inset-block: 0;
|
||
left: 0;
|
||
width: 300px;
|
||
background: linear-gradient(
|
||
90deg,
|
||
transparent 0%,
|
||
color-mix(in srgb, var(--dsw-alias-bg-base) 60%, transparent) 55%,
|
||
transparent 100%
|
||
);
|
||
animation: dsh-reasoning-row-sweep 2.6s ease-out infinite;
|
||
pointer-events: none;
|
||
}
|
||
|
||
@keyframes dsh-reasoning-row-sweep {
|
||
0% { left: -300px; }
|
||
90%, 100% { left: 100%; }
|
||
}
|
||
|
||
.leading {
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.chevron {
|
||
color: var(--dsw-alias-label-secondary);
|
||
}
|
||
|
||
.title {
|
||
font-weight: 400;
|
||
}
|
||
|
||
.separator {
|
||
flex: none;
|
||
width: 2px;
|
||
height: 2px;
|
||
margin: 0 8px;
|
||
border-radius: 1px;
|
||
background: var(--dsw-alias-label-caption);
|
||
}
|
||
|
||
/* Think text reads the secondary tier — one step under the body size
|
||
(setting −1 at ≤14, setting −2 above), shared with every flow-row title
|
||
and summary. */
|
||
.summary {
|
||
min-width: 0;
|
||
overflow: hidden;
|
||
flex: 1 1 auto;
|
||
color: var(--dsw-alias-label-tertiary);
|
||
font-size: var(--dsh-content-font-size-secondary, 13px);
|
||
line-height: calc(20px + var(--dsh-content-font-delta-secondary, 0px));
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.summaryText {
|
||
display: block;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
.summary[data-streaming] {
|
||
mask-image: linear-gradient(to right, black calc(100% - 48px), transparent);
|
||
}
|
||
|
||
.summary[data-streaming] .summaryText {
|
||
overflow: visible;
|
||
text-overflow: clip;
|
||
}
|
||
|
||
.root:not([data-preview]) .separator,
|
||
.root:not([data-preview]) .summary {
|
||
display: none;
|
||
}
|
||
|
||
.thinkBody {
|
||
/* Indent under the title, which starts at leading (16 + delta) + gap 6. */
|
||
padding: 4px 0 4px calc(22px + var(--dsh-content-font-delta, 0px));
|
||
min-width: 0;
|
||
}
|
||
|
||
@media (prefers-reduced-motion: reduce) {
|
||
.root[data-state='running'] .row::after {
|
||
animation: none;
|
||
}
|
||
}
|