css constraints for steps;terminal polish
3clyp50 committed
Jan 29, 2026 at 18:59 UTC
9ef6b2294c528f2a84ee6e7c248918218dd8e0d9
1 file changed
+17
-3
webui/components/messages/process-group/process-group.css
+17
-3
@@ -346,6 +346,7 @@
346
border-color 0.2s ease-out;
347
overflow: hidden;
348
color: var(--color-text-muted);
349
+ max-width: 100%;
350
}
351
352
.process-group-content > .process-steps {
@@ -366,6 +367,8 @@
367
display: flex;
368
flex-direction: column;
369
gap: 2px;
370
+ max-width: 100%;
371
+ overflow: hidden;
372
}
373
374
/* Individual Process Step */
@@ -374,6 +377,8 @@
377
flex-direction: column;
378
padding: 0.1em;
379
transition: background-color 0.15s ease;
380
+ max-width: 100%;
381
+ overflow: hidden;
382
}
383
384
/* Utility/Info/Hint steps have subtle background tint */
@@ -404,6 +409,8 @@
409
user-select: none;
410
gap: 4px;
411
min-height: 18px;
412
+ max-width: 100%;
413
+ overflow: hidden;
414
}
415
416
/* Step title */
@@ -488,13 +495,17 @@
495
.process-step.expanded > .process-step-detail {
496
/* grid-template-rows: 1fr; */
497
opacity: 1;
491
- overflow: visible;
498
+ overflow: hidden;
499
margin-top: var(--spacing-xs);
500
+ max-width: 100%;
501
}
502
503
.process-step.expanded > .process-step-detail > .process-step-detail-scroll {
504
max-height: 40em;
505
overflow-y: auto;
506
+ max-width: 100%;
507
+ width: fit-content;
508
+ box-sizing: content-box;
509
border-radius: var(--border-radius-sm);
510
}
511
@@ -635,6 +646,7 @@
646
} */
647
648
649
+/* Terminal output - self-contained scrollable block */
650
.process-step-detail .terminal-output {
651
margin: var(--spacing-xs) 0 0 0;
652
padding: var(--spacing-xs);
@@ -644,12 +656,11 @@
656
white-space: pre;
657
font-family: monospace;
658
max-width: fit-content;
647
- /* max-height: 300px; */
659
overflow: auto;
660
-webkit-overflow-scrolling: touch;
661
scrollbar-width: thin;
662
scrollbar-color: rgba(255,255,255,0.2) transparent;
652
- overscroll-behavior-x: contain;
663
+ overscroll-behavior: contain;
664
}
665
666
.process-step-detail .terminal-output::-webkit-scrollbar {
@@ -752,6 +763,7 @@
763
overflow: hidden;
764
transition: grid-template-rows 0.25s ease-out, opacity 0.2s ease-out;
765
gap: 2px;
766
+ max-width: 100%;
767
}
768
769
/* Only show nested container when parent step is expanded */
@@ -768,6 +780,8 @@
780
display: flex;
781
flex-direction: column;
782
gap: 2px;
783
+ max-width: 100%;
784
+ overflow: hidden;
785
}
786
787
/* All nested containers have same indentation (no cascading) */