UniqAI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2025-03-16 02:17:33 +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-19 23:17:47 -07:00
parent e530914328
commit e8c629a2e2
3 changed files with 43 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/lib/components/admin/Settings/Documents.svelte
View File

@ -28,6 +28,7 @@
import Tooltip from '$lib/components/common/Tooltip.svelte'; import Tooltip from '$lib/components/common/Tooltip.svelte';
import Switch from '$lib/components/common/Switch.svelte'; import Switch from '$lib/components/common/Switch.svelte';
import { text } from '@sveltejs/kit'; import { text } from '@sveltejs/kit';
import Textarea from '$lib/components/common/Textarea.svelte';
const i18n = getContext('i18n'); const i18n = getContext('i18n');
@ -629,11 +630,9 @@
content={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')} content={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')}
placement="top-start" placement="top-start"
> >
<textarea <Textarea
bind:value={querySettings.template} bind:value={querySettings.template}
placeholder={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')} placeholder={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')}
class="w-full rounded-lg px-4 py-3 text-sm bg-gray-50 dark:text-gray-300 dark:bg-gray-850 outline-none resize-none"
rows="4"
/> />
</Tooltip> </Tooltip>
</div> </div>

13
src/lib/components/admin/Settings/Interface.svelte
View File

@ -14,6 +14,7 @@
import Tooltip from '$lib/components/common/Tooltip.svelte'; import Tooltip from '$lib/components/common/Tooltip.svelte';
import Switch from '$lib/components/common/Switch.svelte'; import Switch from '$lib/components/common/Switch.svelte';
import Textarea from '$lib/components/common/Textarea.svelte';
const dispatch = createEventDispatcher(); const dispatch = createEventDispatcher();
@ -125,10 +126,8 @@
content={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')} content={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')}
placement="top-start" placement="top-start"
> >
<textarea <Textarea
bind:value={taskConfig.TITLE_GENERATION_PROMPT_TEMPLATE} bind:value={taskConfig.TITLE_GENERATION_PROMPT_TEMPLATE}
class="w-full rounded-lg py-3 px-4 text-sm bg-gray-50 dark:text-gray-300 dark:bg-gray-850 outline-none resize"
rows="1"
placeholder={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')} placeholder={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')}
/> />
</Tooltip> </Tooltip>
@ -141,10 +140,8 @@
content={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')} content={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')}
placement="top-start" placement="top-start"
> >
<textarea <Textarea
bind:value={taskConfig.TAG_GENERATION_PROMPT_TEMPLATE} bind:value={taskConfig.TAG_GENERATION_PROMPT_TEMPLATE}
class="w-full rounded-lg py-3 px-4 text-sm bg-gray-50 dark:text-gray-300 dark:bg-gray-850 outline-none resize"
rows="1"
placeholder={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')} placeholder={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')}
/> />
</Tooltip> </Tooltip>
@ -168,10 +165,8 @@
content={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')} content={$i18n.t('Leave empty to use the default prompt, or enter a custom prompt')}
placement="top-start" placement="top-start"
> >
<textarea <Textarea
bind:value={taskConfig.SEARCH_QUERY_GENERATION_PROMPT_TEMPLATE} bind:value={taskConfig.SEARCH_QUERY_GENERATION_PROMPT_TEMPLATE}
class="w-full rounded-lg py-3 px-4 text-sm bg-gray-50 dark:text-gray-300 dark:bg-gray-850 outline-none"
rows="1"
placeholder={$i18n.t( placeholder={$i18n.t(
'Leave empty to use the default prompt, or enter a custom prompt' 'Leave empty to use the default prompt, or enter a custom prompt'
)} )}

37
src/lib/components/common/Textarea.svelte Normal file
View File

@ -0,0 +1,37 @@
<script lang="ts">
import { onMount, tick } from 'svelte';
export let value = '';
export let placeholder = '';
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';
let textareaElement;
onMount(async () => {
await tick();
if (textareaElement) {
setInterval(adjustHeight, 0);
}
});
const adjustHeight = () => {
if (textareaElement) {
textareaElement.style.height = '';
textareaElement.style.height = `${textareaElement.scrollHeight}px`;
}
};
</script>
<textarea
bind:this={textareaElement}
bind:value
{placeholder}
class={className}
on:input={(e) => {
e.target.style.height = '';
e.target.style.height = `${e.target.scrollHeight}px`;
}}
rows="1"
/>