ti.sil/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2025-12-12 04:15:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

refac: styling

Browse source
This commit is contained in:
Timothy Jaeryang Baek 2025-09-15 13:22:41 -05:00
parent 24971ffce0
commit 308c277fd3
2 changed files with 22 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
src/lib/components/channel/MessageInput.svelte
View file

@ -36,6 +36,7 @@
import { getSuggestionRenderer } from '../common/RichTextInput/suggestions'; import { getSuggestionRenderer } from '../common/RichTextInput/suggestions';
import CommandSuggestionList from '../chat/MessageInput/CommandSuggestionList.svelte'; import CommandSuggestionList from '../chat/MessageInput/CommandSuggestionList.svelte';
import MentionList from './MessageInput/MentionList.svelte'; import MentionList from './MessageInput/MentionList.svelte';
import Skeleton from '../chat/Messages/Skeleton.svelte';
export let placeholder = $i18n.t('Send a Message'); export let placeholder = $i18n.t('Send a Message');
@ -690,20 +691,24 @@
{/if} {/if}
</div> </div>
<div class="relative">
<div class=" -mt-5">
{#if typingUsers.length > 0} {#if typingUsers.length > 0}
<div class=" text-xs px-4 mb-1"> <div
class=" absolute -top-6 pb-2.5 w-full bg-gradient-to-t to-transparent from-white dark:from-gray-900 pointer-events-none select-none"
>
<div class=" text-xs px-2 mt-1 flex items-center gap-1.5">
<Skeleton size="xs" />
<div>
<span class=" font-normal text-black dark:text-white"> <span class=" font-normal text-black dark:text-white">
{typingUsers.map((user) => user.name).join(', ')} {typingUsers.map((user) => user.name).join(', ')}
</span> </span>
{$i18n.t('is typing...')} {$i18n.t('is typing...')}
</div> </div>
</div>
</div>
{/if} {/if}
</div> </div>
</div> </div>
</div>
</div>
<div class=""> <div class="">
{#if recording} {#if recording}
@ -811,7 +816,7 @@
json={true} json={true}
messageInput={true} messageInput={true}
richText={$settings?.richTextInput ?? true} richText={$settings?.richTextInput ?? true}
{showFormattingToolbar} showFormattingToolbar={$settings?.showFormattingToolbar ?? false}
shiftEnter={!($settings?.ctrlEnterToSend ?? false) && shiftEnter={!($settings?.ctrlEnterToSend ?? false) &&
(!$mobile || (!$mobile ||
!( !(

10
src/lib/components/chat/Messages/Skeleton.svelte
View file

@ -2,13 +2,21 @@
export let size = 'md'; export let size = 'md';
</script> </script>
<span class="relative flex {size === 'md' ? 'size-3 my-2' : 'size-2 my-1'} mx-1"> <span
class="relative flex {size === 'md'
? 'size-3 my-2'
: size === 'xs'
? 'size-1.5 my-1'
: 'size-2 my-1'} mx-1"
>
<span <span
class="absolute inline-flex h-full w-full animate-pulse rounded-full bg-gray-700 dark:bg-gray-200 opacity-75" class="absolute inline-flex h-full w-full animate-pulse rounded-full bg-gray-700 dark:bg-gray-200 opacity-75"
></span> ></span>
<span <span
class="relative inline-flex {size === 'md' class="relative inline-flex {size === 'md'
? 'size-3' ? 'size-3'
: size === 'xs'
? 'size-1.5'
: 'size-2'} rounded-full bg-black dark:bg-white animate-size" : 'size-2'} rounded-full bg-black dark:bg-white animate-size"
></span> ></span>
</span> </span>