diff --git a/src/app.css b/src/app.css index 334cae1a7..fcc438bea 100644 --- a/src/app.css +++ b/src/app.css @@ -53,11 +53,11 @@ math { } .markdown-prose { - @apply prose dark:prose-invert prose-headings:font-semibold prose-hr:my-4 prose-p:my-0 prose-img:my-1 prose-headings:my-1 prose-pre:my-0 prose-table:my-0 prose-blockquote:my-0 prose-ul:-my-0 prose-ol:-my-0 prose-li:-my-0 whitespace-pre-line; + @apply prose dark:prose-invert prose-headings:font-semibold prose-hr:my-4 prose-hr:border-gray-100 prose-hr:dark:border-gray-800 prose-p:my-0 prose-img:my-1 prose-headings:my-1 prose-pre:my-0 prose-table:my-0 prose-blockquote:my-0 prose-ul:-my-0 prose-ol:-my-0 prose-li:-my-0 whitespace-pre-line; } .markdown-prose-xs { - @apply text-xs prose dark:prose-invert prose-headings:font-semibold prose-hr:my-0 prose-p:my-0 prose-img:my-1 prose-headings:my-1 prose-pre:my-0 prose-table:my-0 prose-blockquote:my-0 prose-ul:-my-0 prose-ol:-my-0 prose-li:-my-0 whitespace-pre-line; + @apply text-xs prose dark:prose-invert prose-headings:font-semibold prose-hr:my-0 prose-hr:border-gray-100 prose-hr:dark:border-gray-800 prose-p:my-0 prose-img:my-1 prose-headings:my-1 prose-pre:my-0 prose-table:my-0 prose-blockquote:my-0 prose-ul:-my-0 prose-ol:-my-0 prose-li:-my-0 whitespace-pre-line; } .markdown a { diff --git a/src/lib/components/chat/ContentRenderer/FloatingButtons.svelte b/src/lib/components/chat/ContentRenderer/FloatingButtons.svelte index 62458f889..97b01e05d 100644 --- a/src/lib/components/chat/ContentRenderer/FloatingButtons.svelte +++ b/src/lib/components/chat/ContentRenderer/FloatingButtons.svelte @@ -79,9 +79,14 @@ if (data.choices && data.choices[0]?.delta?.content) { responseContent += data.choices[0].delta.content; - // Scroll to bottom + // Scroll to bottom only if the scroll is at the bottom give 50px buffer const responseContainer = document.getElementById('response-container'); - responseContainer.scrollTop = responseContainer.scrollHeight; + if ( + responseContainer.scrollHeight - responseContainer.clientHeight <= + responseContainer.scrollTop + 50 + ) { + responseContainer.scrollTop = responseContainer.scrollHeight; + } } } catch (e) { console.error(e); @@ -152,7 +157,12 @@ // Scroll to bottom const responseContainer = document.getElementById('response-container'); - responseContainer.scrollTop = responseContainer.scrollHeight; + if ( + responseContainer.scrollHeight - responseContainer.clientHeight <= + responseContainer.scrollTop + 50 + ) { + responseContainer.scrollTop = responseContainer.scrollHeight; + } } } catch (e) { console.error(e);