ui: fix sticky session diffs header (#21486 )

2026-04-08 15:04:53 +00:00 · 2026-04-08 17:01:52 +08:00
2 changed files with 8 additions and 2 deletions
--- a/packages/ui/src/components/session-turn.css
+++ b/packages/ui/src/components/session-turn.css
@@ -94,9 +94,15 @@

  [data-slot="session-turn-diffs-header"] {
    display: flex;
-    align-items: baseline;
+    align-items: center;
    gap: 8px;
+    padding-top: 4px;
    padding-bottom: 12px;
+    position: sticky;
+    top: var(--sticky-accordion-top, 0px);
+    z-index: 20;
+    background-color: var(--background-stronger);
+    height: 44px;
  }

  [data-slot="session-turn-diffs-label"] {
--- a/packages/ui/src/components/session-turn.tsx
+++ b/packages/ui/src/components/session-turn.tsx
@@ -447,7 +447,7 @@ export function SessionTurn(
                  <div data-component="session-turn-diffs-content">
                    <Accordion
                      multiple
-                      style={{ "--sticky-accordion-offset": "40px" }}
+                      style={{ "--sticky-accordion-offset": "44px" }}
                      value={expanded()}
                      onChange={(value) => setState("expanded", Array.isArray(value) ? value : value ? [value] : [])}
                    >