UniqAI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2024-11-06 08:56:39 +00:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

refac: rich text input styling

Browse Source
This commit is contained in:
Timothy J. Baek 2024-10-19 03:15:40 -07:00
parent 6d25d23326
commit e252ca1dc4
6 changed files with 21 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app.css
View File

@ -189,7 +189,7 @@ input[type='number'] {
}
.ProseMirror {
@apply h-full -translate-y-[1px];
@apply h-full min-h-fit max-h-full;
}
.ProseMirror:focus {

8
src/lib/components/chat/Chat.svelte
View File

@ -823,11 +823,11 @@
);
} else {
// Reset chat input textarea
const chatTextAreaElement = document.getElementById('chat-input');
const chatInputContainer = document.getElementById('chat-input-container');
if (chatTextAreaElement) {
chatTextAreaElement.value = '';
chatTextAreaElement.style.height = '';
if (chatInputContainer) {
chatInputContainer.value = '';
chatInputContainer.style.height = '';
}
const _files = JSON.parse(JSON.stringify(files));

2
src/lib/components/chat/MessageInput.svelte
View File

@ -512,7 +512,7 @@
<div
bind:this={chatInputContainerElement}
id="chat-input-container"
class="scrollbar-hidden text-left bg-gray-50 dark:bg-gray-850 dark:text-gray-100 outline-none w-full py-3 px-1 rounded-xl resize-none h-[48px] overflow-auto"
class="scrollbar-hidden text-left bg-gray-50 dark:bg-gray-850 dark:text-gray-100 outline-none w-full py-2.5 px-1 rounded-xl resize-none h-[48px] overflow-auto"
>
<RichTextInput
bind:this={chatInputElement}

18
src/lib/components/chat/Messages.svelte
View File

@ -330,20 +330,14 @@
await tick();
const chatInputElement = document.getElementById('chat-input');
if (chatInputElement) {
const chatInputContainerElement = document.getElementById('chat-input-container');
if (chatInputContainerElement) {
prompt = p;
chatInputElement.style.height = '';
chatInputElement.style.height = Math.min(chatInputElement.scrollHeight, 200) + 'px';
chatInputElement.focus();
const words = findWordIndices(prompt);
if (words.length > 0) {
const word = words.at(0);
chatInputElement.setSelectionRange(word?.startIndex, word.endIndex + 1);
}
chatInputContainerElement.style.height = '';
chatInputContainerElement.style.height =
Math.min(chatInputContainerElement.scrollHeight, 200) + 'px';
chatInputContainerElement.focus();
}
await tick();

18
src/lib/components/chat/Placeholder.svelte
View File

@ -57,18 +57,14 @@
console.log(prompt);
await tick();
const chatInputElement = document.getElementById('chat-input');
if (chatInputElement) {
chatInputElement.style.height = '';
chatInputElement.style.height = Math.min(chatInputElement.scrollHeight, 200) + 'px';
chatInputElement.focus();
const chatInputContainerElement = document.getElementById('chat-input-container');
if (chatInputContainerElement) {
chatInputContainerElement.style.height = '';
chatInputContainerElement.style.height =
Math.min(chatInputContainerElement.scrollHeight, 200) + 'px';
const words = findWordIndices(prompt);
if (words.length > 0) {
const word = words.at(0);
chatInputElement.setSelectionRange(word?.startIndex, word.endIndex + 1);
}
const chatInputElement = document.getElementById('chat-input');
chatInputElement?.focus();
}
await tick();

4
src/lib/components/common/RichTextInput.svelte
View File

@ -226,7 +226,7 @@
}
return true;
}
return true;
return false;
}
onMount(() => {
@ -412,4 +412,4 @@
});
</script>
<div bind:this={element} class="relative w-full h-full {className}"></div>
<div bind:this={element} class="relative w-full h-full min-h-fit {className}"></div>