use a flex column-reverse outside a column

thanks mary again :3
This commit is contained in:
Charlotte Som 2025-02-27 16:59:13 +00:00
parent ef0cfbd72d
commit 8c058d217d
3 changed files with 9 additions and 18 deletions

View file

@ -71,9 +71,6 @@ function conversationUI(id: string) {
if (typeof event.data !== "string") return; if (typeof event.data !== "string") return;
const message = JSON.parse(event.data); const message = JSON.parse(event.data);
const scrolledToBottom =
chatlog.scrollTop + 16 >= chatlog.scrollHeight - chatlog.clientHeight;
if ("i" in message) { if ("i" in message) {
window.history.replaceState(null, "", "#" + message.i); window.history.replaceState(null, "", "#" + message.i);
id = message.i; id = message.i;
@ -106,8 +103,6 @@ function conversationUI(id: string) {
inFlightMessages.delete(message.r); inFlightMessages.delete(message.r);
} }
} }
if (scrolledToBottom) chatlog.scrollTop = chatlog.scrollHeight - chatlog.clientHeight;
}); });
const form = ( const form = (
@ -126,7 +121,7 @@ function conversationUI(id: string) {
return ( return (
<section className="conversation"> <section className="conversation">
{header} {header}
{chatlog} <section className="chatlog-wrapper">{chatlog}</section>
{form} {form}
</section> </section>
); );

View file

@ -77,11 +77,6 @@ export class ChatResponse {
this.currentLine.appendData(token); this.currentLine.appendData(token);
} }
} }
if (this.thinkingContext) {
this.thinkingContext.scrollTop =
this.thinkingContext.scrollHeight - this.thinkingContext.clientHeight;
}
} }
finalize() { finalize() {

View file

@ -66,12 +66,18 @@ main,
} }
} }
.chatlog { .chatlog-wrapper {
flex: 1; flex: 1;
display: flex; display: flex;
flex-direction: column; flex-direction: column-reverse;
overflow-y: scroll; overflow-y: scroll;
}
.chatlog {
flex: 1;
display: flex;
flex-direction: column;
article { article {
white-space: preserve; white-space: preserve;
@ -109,11 +115,6 @@ main,
font-size: 1rem; font-size: 1rem;
} }
} }
details[data-in-progress] {
max-height: 4em;
overflow-y: auto;
}
} }
pre > code { pre > code {