mirrors/opencode
1
0
Fork 0
mirror of https://github.com/sst/opencode.git synced 2025-12-23 10:11:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

fix: desktop layout

Browse source
This commit is contained in:
Adam 2025-12-12 14:48:56 -06:00
parent ccdd77032a
commit 9efe09564b
No known key found for this signature in database
GPG key ID: 9CB48779AF150E75
2 changed files with 13 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

4
packages/ui/src/components/session-turn.css
View file

@ -214,10 +214,10 @@
}
[data-component="sticky-accordion-header"] {
top: 40px;
top: var(--sticky-header-height, 40px);
&[data-expanded]::before {
top: -40px;
top: calc(-1 * var(--sticky-header-height, 40px));
}
}

12
packages/ui/src/components/session-turn.tsx
View file

@ -62,7 +62,9 @@ export function SessionTurn(
let scrollRef: HTMLDivElement | undefined
let contentRef: HTMLDivElement | undefined
let stickyHeaderRef: HTMLDivElement | undefined
const [userScrolled, setUserScrolled] = createSignal(false)
const [stickyHeaderHeight, setStickyHeaderHeight] = createSignal(0)
function handleScroll() {
if (!scrollRef) return
@ -93,6 +95,13 @@ export function SessionTurn(
})
})
onMount(() => {
if (!stickyHeaderRef) return
createResizeObserver(stickyHeaderRef, ({ height }) => {
setStickyHeaderHeight(height + 8)
})
})
return (
<div data-component="session-turn" class={props.classes?.root}>
<div ref={scrollRef} onScroll={handleScroll} data-slot="session-turn-content" class={props.classes?.content}>
@ -238,9 +247,10 @@ export function SessionTurn(
data-message={message().id}
data-slot="session-turn-message-container"
class={props.classes?.container}
style={{ "--sticky-header-height": `${stickyHeaderHeight()}px` }}
>
{/* Sticky Header */}
<div data-slot="session-turn-sticky-header">
<div ref={stickyHeaderRef} data-slot="session-turn-sticky-header">
<div data-slot="session-turn-message-header">
<div data-slot="session-turn-message-title">
<Switch>