diff options
| author | Adam <[email protected]> | 2025-12-16 12:47:18 -0600 |
|---|---|---|
| committer | Adam <[email protected]> | 2025-12-16 12:53:12 -0600 |
| commit | 89219a77f717826578703dbd23b7d302696144f5 (patch) | |
| tree | 84e0dea925573e507a93b91b6a78be2db1b41a1e | |
| parent | 20e3a74badabc07cb23223c8d8d2bc7052b31a39 (diff) | |
| download | opencode-89219a77f717826578703dbd23b7d302696144f5.tar.gz opencode-89219a77f717826578703dbd23b7d302696144f5.zip | |
fix: layout badness
| -rw-r--r-- | packages/ui/src/components/session-turn.css | 5 | ||||
| -rw-r--r-- | packages/ui/src/components/session-turn.tsx | 13 |
2 files changed, 5 insertions, 13 deletions
diff --git a/packages/ui/src/components/session-turn.css b/packages/ui/src/components/session-turn.css index 4b8a44723..5f95b2c30 100644 --- a/packages/ui/src/components/session-turn.css +++ b/packages/ui/src/components/session-turn.css @@ -27,7 +27,8 @@ align-items: flex-start; align-self: stretch; min-width: 0; - gap: clamp(8px, calc(42px - var(--scroll-y) * 0.48), 42px); + gap: 42px; + /* gap: clamp(8px, calc(42px - var(--scroll-y) * 0.48), 42px); */ overflow-anchor: none; } @@ -59,7 +60,7 @@ } [data-slot="session-turn-message-content"] { - margin-top: -24px; + margin-top: -18px; } [data-slot="session-turn-message-title"] { diff --git a/packages/ui/src/components/session-turn.tsx b/packages/ui/src/components/session-turn.tsx index 0f5a26a2a..5bf3c0bbd 100644 --- a/packages/ui/src/components/session-turn.tsx +++ b/packages/ui/src/components/session-turn.tsx @@ -57,17 +57,12 @@ export function SessionTurn( userScrolled: false, stickyHeaderHeight: 0, scrollY: 0, - autoScrolling: false, }) function handleScroll() { if (!scrollRef) return - if (state.autoScrolling) return const { scrollTop, scrollHeight, clientHeight } = scrollRef - const scrollRoom = scrollHeight - clientHeight - if (scrollRoom > 100) { - setState("scrollY", scrollTop) - } + setState("scrollY", scrollTop) const atBottom = scrollHeight - scrollTop - clientHeight < 50 if (!atBottom && working()) { setState("userScrolled", true) @@ -81,13 +76,9 @@ export function SessionTurn( } function scrollToBottom() { - if (!scrollRef || state.userScrolled || !working() || state.autoScrolling) return - setState("autoScrolling", true) + if (!scrollRef || state.userScrolled || !working()) return requestAnimationFrame(() => { scrollRef?.scrollTo({ top: scrollRef.scrollHeight, behavior: "instant" }) - requestAnimationFrame(() => { - setState("autoScrolling", false) - }) }) } |
