47 lines
3.7 KiB
CSS
47 lines
3.7 KiB
CSS
.agent-desktop { display: flex; flex: 1; flex-direction: column; height: 100%; min-height: 0; min-width: 0; overflow: hidden; }
|
|
.agent-desktop > aside { max-height: 25%; min-height: 0; overflow: auto; }
|
|
.agent-desktop [hidden] { display: none !important; }
|
|
.agent-workspace-header { display: flex; flex-shrink: 0; align-items: center; gap: 12px; min-height: 64px; padding: 8px 20px; border-bottom: 1px solid hsl(var(--border)); }
|
|
.agent-workspace-nav { display: flex; flex-shrink: 0; align-items: center; gap: 4px; padding: 6px 20px; border-bottom: 1px solid hsl(var(--border)); }
|
|
.agent-workspace-view { display: flex; flex: 1; flex-direction: column; min-height: 0; min-width: 0; overflow: hidden; }
|
|
.agent-management-view { flex: 1; min-height: 0; overflow: auto; padding: 24px; }
|
|
.agent-management-view > * { max-width: 1000px; margin-inline: auto; }
|
|
.agent-split-container { display: flex; flex: 1; flex-direction: column; container-type: inline-size; min-height: 0; overflow: hidden; }
|
|
.agent-split { display: grid; flex: 1; min-height: 0; overflow: hidden; }
|
|
.agent-config-pane, .agent-preview-pane { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
|
|
.agent-pane-heading { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; height: 44px; padding: 0 16px 0 24px; font-size: 13px; font-weight: 500; }
|
|
.agent-config-tabs { display: flex; flex-shrink: 0; gap: 4px; padding: 0 20px 10px; border-bottom: 1px solid hsl(var(--border)); }
|
|
.agent-config-scroll { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 24px; }
|
|
.agent-preview-pane { padding: 8px 20px 16px 12px; }
|
|
.agent-preview-pane > .agent-pane-heading { padding-inline: 0; }
|
|
.agent-divider { touch-action: none; cursor: col-resize; background: hsl(var(--border) / .45); border-inline: 3px solid hsl(var(--background)); }
|
|
.agent-divider:hover, .agent-divider:focus-visible { background: hsl(var(--primary) / .6); outline: none; }
|
|
.agent-split[data-focus="configuration"] > .agent-preview-pane,
|
|
.agent-split[data-focus="preview"] > .agent-config-pane,
|
|
.agent-split:not([data-focus=""]) > .agent-divider { display: none; }
|
|
.agent-compact-switch { display: none; }
|
|
.agent-chat { display: flex; flex: 1; flex-direction: column; min-height: 0; min-width: 0; overflow: hidden; color: hsl(var(--foreground)); }
|
|
.agent-chat-scroll { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
|
|
.agent-chat-toolbar { flex: 0 1 auto; min-height: 0; max-height: 35%; overflow: auto; overscroll-behavior: contain; }
|
|
.agent-chat-files { flex: 0 1 auto; min-height: 0; max-height: 28%; overflow: auto; overscroll-behavior: contain; }
|
|
.agent-chat-files details { margin: 8px 0; padding: 0 8px; border: 0; }
|
|
.agent-chat-composer { flex-shrink: 0; }
|
|
.agent-chat-composer textarea { height: clamp(48px, 12vh, 80px); min-height: 48px; max-height: min(160px, 25vh); }
|
|
.agent-desktop button { min-height: 40px; }
|
|
.agent-desktop h2, .agent-desktop h3 { text-wrap: balance; }
|
|
.agent-desktop p { text-wrap: pretty; }
|
|
.agent-workspace-nav { flex-wrap: wrap; }
|
|
@media (max-width: 640px) {
|
|
.agent-workspace-header { flex-wrap: wrap; gap: 8px; padding-inline: 12px; }
|
|
.agent-workspace-header > [role="status"] { margin-left: 48px; }
|
|
.agent-workspace-nav { padding-inline: 12px; }
|
|
}
|
|
@container (max-width: 759px) {
|
|
.agent-compact-switch { display: flex; flex-shrink: 0; gap: 4px; padding: 8px 20px; }
|
|
.agent-split { grid-template-columns: minmax(0, 1fr) !important; }
|
|
.agent-divider { display: none; }
|
|
.agent-split[data-focus=""][data-compact-panel="configuration"] > .agent-preview-pane,
|
|
.agent-split[data-focus=""][data-compact-panel="preview"] > .agent-config-pane { display: none; }
|
|
.agent-preview-pane { padding-inline: 24px; }
|
|
}
|