diff options
| author | Adam <[email protected]> | 2025-11-26 05:58:19 -0600 |
|---|---|---|
| committer | Adam <[email protected]> | 2025-11-26 05:58:30 -0600 |
| commit | cd4fabd11b9abcf0f64c6ffa8cca026e76060b9b (patch) | |
| tree | 92d6cf41b529d56829180a7f3b0b0c706d1e79bf | |
| parent | 9a8b8f26ac955c8c59b2bc1222edd3fb4e6be0be (diff) | |
| download | opencode-cd4fabd11b9abcf0f64c6ffa8cca026e76060b9b.tar.gz opencode-cd4fabd11b9abcf0f64c6ffa8cca026e76060b9b.zip | |
fix: scroll gutter padding
| -rw-r--r-- | packages/desktop/src/pages/session.tsx | 4 | ||||
| -rw-r--r-- | packages/enterprise/src/routes/share/[shareID].tsx | 21 |
2 files changed, 15 insertions, 10 deletions
diff --git a/packages/desktop/src/pages/session.tsx b/packages/desktop/src/pages/session.tsx index 40acac663..60f9e9ef5 100644 --- a/packages/desktop/src/pages/session.tsx +++ b/packages/desktop/src/pages/session.tsx @@ -333,7 +333,7 @@ export default function Page() { flex: layout.review.state() === "pane", }} > - <div class="relative shrink-0 px-6 py-3 flex flex-col gap-6 flex-1 min-h-0 w-full max-w-2xl mx-auto"> + <div class="relative shrink-0 py-3 flex flex-col gap-6 flex-1 min-h-0 w-full max-w-2xl mx-auto"> <Switch> <Match when={session.id}> <div class="flex items-start justify-start h-full min-h-0"> @@ -364,7 +364,7 @@ export default function Page() { <SessionTurn sessionID={session.id!} messageID={session.messages.active()?.id!} - classes={{ root: "pb-20 flex-1 min-w-0", content: "pb-20" }} + classes={{ root: "pb-20 flex-1 min-w-0", content: "pb-20", container: "px-6" }} /> </div> </Match> diff --git a/packages/enterprise/src/routes/share/[shareID].tsx b/packages/enterprise/src/routes/share/[shareID].tsx index fd6638a5f..271fb290a 100644 --- a/packages/enterprise/src/routes/share/[shareID].tsx +++ b/packages/enterprise/src/routes/share/[shareID].tsx @@ -190,8 +190,8 @@ export default function () { ) const turns = () => ( - <div class="relative mt-2 pt-6 pb-8 px-4 min-w-0 w-full h-full overflow-y-auto no-scrollbar"> - {title()} + <div class="relative mt-2 pt-6 pb-8 min-w-0 w-full h-full overflow-y-auto no-scrollbar"> + <div class="px-4">{title()}</div> <div class="flex flex-col gap-15 items-start justify-start mt-4"> <For each={messages()}> {(message) => ( @@ -202,18 +202,20 @@ export default function () { root: "min-w-0 w-full relative", content: "flex flex-col justify-between !overflow-visible [&_[data-slot=session-turn-message-header]]:top-[-32px]", + container: "px-4", }} /> )} </For> </div> - <div class="flex items-center justify-center pt-20 pb-8 shrink-0"> + <div class="px-4 flex items-center justify-center pt-20 pb-8 shrink-0"> <Logo class="w-58.5 opacity-12" /> </div> </div> ) const wide = createMemo(() => diffs().length === 0) + const columnPadding = () => (wide() ? "px-6" : "px-21 @4xl:px-6") return ( <div class="relative bg-background-stronger w-screen h-screen overflow-hidden flex flex-col"> @@ -245,11 +247,10 @@ export default function () { <div classList={{ "@container relative shrink-0 pt-14 flex flex-col gap-10 min-h-0 w-full mx-auto": true, - "px-21 @4xl:px-6 max-w-2xl": !wide(), - "px-6 max-w-2xl": wide(), + "max-w-2xl": true, }} > - {title()} + <div class={columnPadding()}>{title()}</div> <div class="flex items-start justify-start h-full min-h-0"> <Show when={messages().length > 1}> <> @@ -285,9 +286,13 @@ export default function () { <SessionTurn sessionID={data().sessionID} messageID={store.messageId ?? firstUserMessage()!.id!} - classes={{ root: "grow", content: "flex flex-col justify-between", container: "pb-20" }} + classes={{ + root: "grow", + content: "flex flex-col justify-between", + container: `${columnPadding()} pb-20`, + }} > - <div class="flex items-center justify-center pb-8 shrink-0"> + <div class={`${columnPadding()} flex items-center justify-center pb-8 shrink-0`}> <Logo class="w-58.5 opacity-12" /> </div> </SessionTurn> |