OpenWebUI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2025-06-04 03:37:35 +00:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

refac: styling

Browse Source
This commit is contained in:
Timothy J. Baek 2024-10-20 19:04:30 -07:00
parent 2f5c65bd1f
commit 438b277be0
3 changed files with 17 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/lib/components/common/Textarea.svelte
View File

@ -4,6 +4,9 @@
export let value = ''; export let value = '';
export let placeholder = ''; export let placeholder = '';
export let rows = 1;
export let required = false;
export let className = export let className =
'w-full rounded-lg px-3 py-2 text-sm bg-gray-50 dark:text-gray-300 dark:bg-gray-850 outline-none resize-none h-full'; 'w-full rounded-lg px-3 py-2 text-sm bg-gray-50 dark:text-gray-300 dark:bg-gray-850 outline-none resize-none h-full';
@ -12,7 +15,7 @@
onMount(async () => { onMount(async () => {
await tick(); await tick();
if (textareaElement) { if (textareaElement) {
setInterval(adjustHeight, 0); setTimeout(adjustHeight, 0);
} }
}); });
@ -28,10 +31,8 @@
bind:this={textareaElement} bind:this={textareaElement}
bind:value bind:value
{placeholder} {placeholder}
on:input={adjustHeight}
class={className} class={className}
on:input={(e) => { {rows}
e.target.style.height = ''; {required}
e.target.style.height = `${e.target.scrollHeight}px`;
}}
rows="1"
/> />

9
src/routes/(app)/workspace/prompts/create/+page.svelte
View File

@ -6,6 +6,7 @@
import { onMount, tick, getContext } from 'svelte'; import { onMount, tick, getContext } from 'svelte';
import { createNewPrompt, getPrompts } from '$lib/apis/prompts'; import { createNewPrompt, getPrompts } from '$lib/apis/prompts';
import Textarea from '$lib/components/common/Textarea.svelte';
const i18n = getContext('i18n'); const i18n = getContext('i18n');
@ -114,7 +115,7 @@
</button> </button>
<form <form
class="flex flex-col max-w-2xl mx-auto mt-4 mb-10" class="flex flex-col max-w-2xl mx-auto mt-4 mb-10 pb-10"
on:submit|preventDefault={() => { on:submit|preventDefault={() => {
submitHandler(); submitHandler();
}} }}
@ -170,11 +171,11 @@
<div class="mt-2"> <div class="mt-2">
<div> <div>
<textarea <Textarea
class="px-3 py-1.5 text-sm w-full bg-transparent border dark:border-gray-600 outline-none rounded-lg" className="px-3 py-1.5 text-sm w-full bg-transparent border dark:border-gray-600 outline-none overflow-y-hidden rounded-lg resize-none"
placeholder={$i18n.t('Write a summary in 50 words that summarizes [topic or keyword].')} placeholder={$i18n.t('Write a summary in 50 words that summarizes [topic or keyword].')}
rows="6"
bind:value={content} bind:value={content}
rows={6}
required required
/> />
</div> </div>

9
src/routes/(app)/workspace/prompts/edit/+page.svelte
View File

@ -9,6 +9,7 @@
import { getPrompts, updatePromptByCommand } from '$lib/apis/prompts'; import { getPrompts, updatePromptByCommand } from '$lib/apis/prompts';
import { page } from '$app/stores'; import { page } from '$app/stores';
import Textarea from '$lib/components/common/Textarea.svelte';
let loading = false; let loading = false;
@ -100,7 +101,7 @@
</button> </button>
<form <form
class="flex flex-col max-w-2xl mx-auto mt-4 mb-10" class="flex flex-col max-w-2xl mx-auto mt-4 mb-10 pb-10"
on:submit|preventDefault={() => { on:submit|preventDefault={() => {
updateHandler(); updateHandler();
}} }}
@ -157,10 +158,10 @@
<div class="mt-2"> <div class="mt-2">
<div> <div>
<textarea <Textarea
class="px-3 py-1.5 text-sm w-full bg-transparent border dark:border-gray-600 outline-none rounded-lg" className="px-3 py-1.5 text-sm w-full bg-transparent border dark:border-gray-600 outline-none overflow-y-hidden rounded-lg resize-none"
placeholder={$i18n.t(`Write a summary in 50 words that summarizes [topic or keyword].`)} placeholder={$i18n.t(`Write a summary in 50 words that summarizes [topic or keyword].`)}
rows="6" rows={6}
bind:value={content} bind:value={content}
required required
/> />