mirror of
https://github.com/oobabooga/text-generation-webui.git
synced 2024-11-22 08:07:56 +01:00
Improved chat scrolling (#3601)
This commit is contained in:
parent
300219b081
commit
46408465ce
@ -253,6 +253,10 @@ div.svelte-362y77>*, div.svelte-362y77>.form>* {
|
|||||||
.bigchat #chat {
|
.bigchat #chat {
|
||||||
height: calc(100dvh - 180px) !important;
|
height: calc(100dvh - 180px) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.chat {
|
||||||
|
flex-direction: column-reverse !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.chat {
|
.chat {
|
||||||
@ -263,10 +267,10 @@ div.svelte-362y77>*, div.svelte-362y77>.form>* {
|
|||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
padding-right: 20px;
|
padding-right: 20px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column-reverse;
|
flex-direction: column;
|
||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
overflow-wrap: anywhere;
|
overflow-wrap: anywhere;
|
||||||
padding-top: 1px;
|
padding-top: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#chat {
|
#chat {
|
||||||
|
23
js/main.js
23
js/main.js
@ -48,3 +48,26 @@ document.addEventListener("keydown", function(event) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Chat scrolling
|
||||||
|
const targetElement = document.getElementById('chat').parentNode.parentNode.parentNode;
|
||||||
|
|
||||||
|
// Create a MutationObserver instance
|
||||||
|
const observer = new MutationObserver(function(mutations) {
|
||||||
|
mutations.forEach(function(mutation) {
|
||||||
|
let childElement = targetElement.childNodes[2].childNodes[0].childNodes[1];
|
||||||
|
childElement.scrollTop = childElement.scrollHeight;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Configure the observer to watch for changes in the subtree and attributes
|
||||||
|
const config = {
|
||||||
|
childList: true,
|
||||||
|
subtree: true,
|
||||||
|
characterData: true,
|
||||||
|
attributeOldValue: true,
|
||||||
|
characterDataOldValue: true
|
||||||
|
};
|
||||||
|
|
||||||
|
// Start observing the target element
|
||||||
|
observer.observe(targetElement, config);
|
||||||
|
Loading…
Reference in New Issue
Block a user