diff --git a/client/main.tsx b/client/main.tsx index 5639b3c..b8239bd 100644 --- a/client/main.tsx +++ b/client/main.tsx @@ -71,9 +71,6 @@ function conversationUI(id: string) { if (typeof event.data !== "string") return; const message = JSON.parse(event.data); - const scrolledToBottom = - chatlog.scrollTop + 16 >= chatlog.scrollHeight - chatlog.clientHeight; - if ("i" in message) { window.history.replaceState(null, "", "#" + message.i); id = message.i; @@ -106,8 +103,6 @@ function conversationUI(id: string) { inFlightMessages.delete(message.r); } } - - if (scrolledToBottom) chatlog.scrollTop = chatlog.scrollHeight - chatlog.clientHeight; }); const form = ( @@ -126,7 +121,7 @@ function conversationUI(id: string) { return (
{header} - {chatlog} +
{chatlog}
{form}
); diff --git a/client/response.tsx b/client/response.tsx index e6ba06a..f0733e2 100644 --- a/client/response.tsx +++ b/client/response.tsx @@ -77,11 +77,6 @@ export class ChatResponse { this.currentLine.appendData(token); } } - - if (this.thinkingContext) { - this.thinkingContext.scrollTop = - this.thinkingContext.scrollHeight - this.thinkingContext.clientHeight; - } } finalize() { diff --git a/client/web/css/styles.css b/client/web/css/styles.css index 6af56d0..1ecbe04 100644 --- a/client/web/css/styles.css +++ b/client/web/css/styles.css @@ -66,12 +66,18 @@ main, } } -.chatlog { +.chatlog-wrapper { flex: 1; display: flex; - flex-direction: column; + flex-direction: column-reverse; overflow-y: scroll; +} + +.chatlog { + flex: 1; + display: flex; + flex-direction: column; article { white-space: preserve; @@ -109,11 +115,6 @@ main, font-size: 1rem; } } - - details[data-in-progress] { - max-height: 4em; - overflow-y: auto; - } } pre > code {