Merge pull request #13866 from itk-dev/feature/contrast-chat-input

feat: Contrast enhancements
This commit is contained in:
Tim Jaeryang Baek 2025-05-14 15:12:00 +04:00 committed by GitHub
commit d89e37cc7c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 20 additions and 8 deletions

View File

@ -314,12 +314,20 @@ input[type='number'] {
.ProseMirror p.is-editor-empty:first-child::before { .ProseMirror p.is-editor-empty:first-child::before {
content: attr(data-placeholder); content: attr(data-placeholder);
float: left; float: left;
color: #adb5bd; /* Below color is from tailwind, and has the proper contrast
text-gray-600 from: https://tailwindcss.com/docs/color */
color: #676767;
pointer-events: none; pointer-events: none;
@apply line-clamp-1 absolute; @apply line-clamp-1 absolute;
} }
@media (prefers-color-scheme: dark) {
.ProseMirror p.is-editor-empty:first-child::before {
color: #757575;
}
}
.ai-autocompletion::after { .ai-autocompletion::after {
color: #a0a0a0; color: #a0a0a0;

View File

@ -823,7 +823,7 @@
id="chat-input" id="chat-input"
dir="auto" dir="auto"
bind:this={chatInputElement} bind:this={chatInputElement}
class="scrollbar-hidden bg-transparent dark:text-gray-100 outline-hidden w-full pt-3 px-1 resize-none" class="scrollbar-hidden bg-transparent dark:text-gray-200 outline-hidden w-full pt-3 px-1 resize-none"
placeholder={placeholder ? placeholder : $i18n.t('Send a Message')} placeholder={placeholder ? placeholder : $i18n.t('Send a Message')}
bind:value={prompt} bind:value={prompt}
on:compositionstart={() => (isComposing = true)} on:compositionstart={() => (isComposing = true)}

View File

@ -114,7 +114,9 @@
</div> </div>
{#if showSetDefault} {#if showSetDefault}
<div class=" absolute text-left mt-[1px] ml-1 text-[0.7rem] text-gray-500 font-primary"> <div
class="absolute text-left mt-[1px] ml-1 text-[0.7rem] text-gray-600 dark:text-gray-400 font-primary"
>
<button on:click={saveDefaultModel}> {$i18n.t('Set as default')}</button> <button on:click={saveDefaultModel}> {$i18n.t('Set as default')}</button>
</div> </div>
{/if} {/if}

View File

@ -64,7 +64,7 @@
} }
</script> </script>
<div class="mb-1 flex gap-1 text-xs font-medium items-center text-gray-400 dark:text-gray-600"> <div class="mb-1 flex gap-1 text-xs font-medium items-center text-gray-600 dark:text-gray-400">
{#if filteredPrompts.length > 0} {#if filteredPrompts.length > 0}
<Bolt /> <Bolt />
{$i18n.t('Suggested')} {$i18n.t('Suggested')}
@ -74,7 +74,7 @@
<div <div
class="flex w-full {$settings?.landingPageMode === 'chat' class="flex w-full {$settings?.landingPageMode === 'chat'
? ' -mt-1' ? ' -mt-1'
: 'text-center items-center justify-center'} self-start text-gray-400 dark:text-gray-600" : 'text-center items-center justify-center'} self-start text-gray-600 dark:text-gray-400"
> >
{$WEBUI_NAME} ‧ v{WEBUI_VERSION} {$WEBUI_NAME} ‧ v{WEBUI_VERSION}
</div> </div>
@ -98,7 +98,7 @@
> >
{prompt.title[0]} {prompt.title[0]}
</div> </div>
<div class="text-xs text-gray-500 font-normal line-clamp-1"> <div class="text-xs text-gray-600 dark:text-gray-400 font-normal line-clamp-1">
{prompt.title[1]} {prompt.title[1]}
</div> </div>
{:else} {:else}
@ -107,7 +107,9 @@
> >
{prompt.content} {prompt.content}
</div> </div>
<div class="text-xs text-gray-500 font-normal line-clamp-1">{$i18n.t('Prompt')}</div> <div class="text-xs text-gray-600 dark:text-gray-400 font-normal line-clamp-1">
{$i18n.t('Prompt')}
</div>
{/if} {/if}
</div> </div>
</button> </button>

View File

@ -14,7 +14,7 @@
</script> </script>
<div <div
class="flex items-start bg-[#F1F8FE] dark:bg-[#020C1D] border border-[3371D5] dark:border-[#03113B] text-[#3371D5] dark:text-[#6795EC] rounded-lg px-3.5 py-3 text-xs max-w-80 pr-2 w-full shadow-lg" class="flex items-start bg-[#F1F8FE] dark:bg-[#020C1D] border border-[3371D5] dark:border-[#03113B] text-[#2B6CD4] dark:text-[#6795EC] rounded-lg px-3.5 py-3 text-xs max-w-80 pr-2 w-full shadow-lg"
> >
<div class="flex-1 font-medium"> <div class="flex-1 font-medium">
{$i18n.t(`A new version (v{{LATEST_VERSION}}) is now available.`, { {$i18n.t(`A new version (v{{LATEST_VERSION}}) is now available.`, {