style(chat): compact markdown and scroll to latest on refresh
parent
cc4aaffa5f
commit
e3997c661e
|
|
@ -73,6 +73,7 @@ export default function ChatPage() {
|
||||||
const bodyRef = useRef<HTMLDivElement>(null);
|
const bodyRef = useRef<HTMLDivElement>(null);
|
||||||
const abortRef = useRef<AbortController | null>(null);
|
const abortRef = useRef<AbortController | null>(null);
|
||||||
const autoScrollRef = useRef(true);
|
const autoScrollRef = useRef(true);
|
||||||
|
const initialScrollDoneRef = useRef(false);
|
||||||
|
|
||||||
// URL 参数 ?session=xxx&msg=yyy
|
// URL 参数 ?session=xxx&msg=yyy
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
@ -145,7 +146,13 @@ export default function ChatPage() {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
if (!initialScrollDoneRef.current) {
|
||||||
|
autoScrollRef.current = true;
|
||||||
|
scrollBottom(true);
|
||||||
|
initialScrollDoneRef.current = true;
|
||||||
|
} else {
|
||||||
scrollBottom();
|
scrollBottom();
|
||||||
|
}
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
@ -167,6 +174,10 @@ export default function ChatPage() {
|
||||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||||
}, [id]);
|
}, [id]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
initialScrollDoneRef.current = false;
|
||||||
|
}, [id]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!id) return;
|
if (!id) return;
|
||||||
loadMessages();
|
loadMessages();
|
||||||
|
|
|
||||||
|
|
@ -545,24 +545,40 @@ body {
|
||||||
.bubble.assistant h4,
|
.bubble.assistant h4,
|
||||||
.bubble.assistant h5,
|
.bubble.assistant h5,
|
||||||
.bubble.assistant h6 {
|
.bubble.assistant h6 {
|
||||||
margin: 0.25em 0 0.125em;
|
margin: 0.2em 0 0.1em;
|
||||||
line-height: 1.3;
|
line-height: 1.3;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bubble.assistant ol,
|
.bubble.assistant ol,
|
||||||
.bubble.assistant ul {
|
.bubble.assistant ul {
|
||||||
margin: 0.2em 0;
|
margin: 0.15em 0;
|
||||||
padding-left: 1.25em;
|
padding-left: 1.25em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bubble.assistant li {
|
.bubble.assistant li {
|
||||||
margin: 0.08em 0;
|
margin: 0.05em 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bubble.assistant hr {
|
.bubble.assistant hr {
|
||||||
margin: 0.4em 0;
|
margin: 0.4em 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bubble.assistant li > p {
|
||||||
|
margin: 0.15em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bubble.assistant blockquote {
|
||||||
|
margin: 0.2em 0;
|
||||||
|
padding: 0.2em 0.6em;
|
||||||
|
border-left: 3px solid var(--color-border);
|
||||||
|
background: rgba(15, 23, 42, 0.03);
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bubble.assistant blockquote p {
|
||||||
|
margin: 0.2em 0;
|
||||||
|
}
|
||||||
|
|
||||||
.chat-input-wrapper {
|
.chat-input-wrapper {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-width: 820px;
|
max-width: 820px;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue