mirror of
https://github.com/open-webui/open-webui
synced 2024-11-21 23:57:51 +00:00
refac: styling
This commit is contained in:
Timothy Jaeryang Baek
parent
6aa837a8a2
commit
53103c3bd7
@ -2033,6 +2033,7 @@
|
|||||||
parentId: string,
|
parentId: string,
|
||||||
responseMessageId: string
|
responseMessageId: string
|
||||||
) => {
|
) => {
|
||||||
|
// TODO: move this to the backend
|
||||||
const responseMessage = history.messages[responseMessageId];
|
const responseMessage = history.messages[responseMessageId];
|
||||||
const userMessage = history.messages[parentId];
|
const userMessage = history.messages[parentId];
|
||||||
const messages = createMessagesList(history.currentId);
|
const messages = createMessagesList(history.currentId);
|
||||||
|
|||||||
@ -312,11 +312,49 @@
|
|||||||
<div class="w-full relative">
|
<div class="w-full relative">
|
||||||
{#if atSelectedModel !== undefined || selectedToolIds.length > 0 || webSearchEnabled}
|
{#if atSelectedModel !== undefined || selectedToolIds.length > 0 || webSearchEnabled}
|
||||||
<div
|
<div
|
||||||
class="px-3 pb-0.5 pt-1.5 text-left w-full flex flex-col absolute bottom-0 left-0 right-0 bg-gradient-to-t from-white dark:from-gray-900 z-10"
|
class="px-4 pb-0.5 pt-1.5 text-left w-full flex flex-col absolute bottom-0 left-0 right-0 bg-gradient-to-t from-white dark:from-gray-900 z-10"
|
||||||
>
|
>
|
||||||
|
{#if selectedToolIds.length > 0}
|
||||||
|
<div class="flex items-center justify-between w-full">
|
||||||
|
<div class="flex items-center gap-2.5 text-sm dark:text-gray-500">
|
||||||
|
<div class="pl-1">
|
||||||
|
<span class="relative flex size-2">
|
||||||
|
<span
|
||||||
|
class="animate-ping absolute inline-flex h-full w-full rounded-full bg-yellow-400 opacity-75"
|
||||||
|
/>
|
||||||
|
<span class="relative inline-flex rounded-full size-2 bg-yellow-500" />
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class=" translate-y-[0.5px]">
|
||||||
|
{selectedToolIds
|
||||||
|
.map((id) => {
|
||||||
|
return $tools ? $tools.find((tool) => tool.id === id)?.name : id;
|
||||||
|
})
|
||||||
|
.join(', ')}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
|
{#if webSearchEnabled}
|
||||||
|
<div class="flex items-center justify-between w-full">
|
||||||
|
<div class="flex items-center gap-2.5 text-sm dark:text-gray-500">
|
||||||
|
<div class="pl-1">
|
||||||
|
<span class="relative flex size-2">
|
||||||
|
<span
|
||||||
|
class="animate-ping absolute inline-flex h-full w-full rounded-full bg-green-400 opacity-75"
|
||||||
|
/>
|
||||||
|
<span class="relative inline-flex rounded-full size-2 bg-green-500" />
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class=" translate-y-[0.5px]">{$i18n.t('Search the web')}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
|
||||||
{#if atSelectedModel !== undefined}
|
{#if atSelectedModel !== undefined}
|
||||||
<div class="flex items-center justify-between w-full">
|
<div class="flex items-center justify-between w-full">
|
||||||
<div class="flex items-center gap-2 text-sm dark:text-gray-500">
|
<div class="pl-[1px] flex items-center gap-2 text-sm dark:text-gray-500">
|
||||||
<img
|
<img
|
||||||
crossorigin="anonymous"
|
crossorigin="anonymous"
|
||||||
alt="model profile"
|
alt="model profile"
|
||||||
@ -343,76 +381,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
{#if selectedToolIds.length > 0}
|
|
||||||
<div class="flex items-center justify-between w-full">
|
|
||||||
<div class="flex items-center gap-2 text-sm dark:text-gray-500">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
viewBox="0 0 16 16"
|
|
||||||
fill="currentColor"
|
|
||||||
class="size-3.5"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
fill-rule="evenodd"
|
|
||||||
d="M11.5 8a3.5 3.5 0 0 0 3.362-4.476c-.094-.325-.497-.39-.736-.15L12.099 5.4a.48.48 0 0 1-.653.033 8.554 8.554 0 0 1-.879-.879.48.48 0 0 1 .033-.653l2.027-2.028c.24-.239.175-.642-.15-.736a3.502 3.502 0 0 0-4.476 3.427c.018.99-.133 2.093-.914 2.7l-5.31 4.13a2.015 2.015 0 1 0 2.828 2.827l4.13-5.309c.607-.78 1.71-.932 2.7-.914L11.5 8ZM3 13.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z"
|
|
||||||
clip-rule="evenodd"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<div class=" translate-y-[0.5px]">
|
|
||||||
{selectedToolIds
|
|
||||||
.map((id) => {
|
|
||||||
return $tools ? $tools.find((tool) => tool.id === id)?.name : id;
|
|
||||||
})
|
|
||||||
.join(', ')}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<button
|
|
||||||
class="flex items-center dark:text-gray-500"
|
|
||||||
on:click={() => {
|
|
||||||
selectedToolIds = [];
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<XMark />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
|
|
||||||
{#if webSearchEnabled}
|
|
||||||
<div class="flex items-center justify-between w-full">
|
|
||||||
<div class="flex items-center gap-2 text-sm dark:text-gray-500">
|
|
||||||
<div>
|
|
||||||
<svg
|
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
|
||||||
viewBox="0 0 16 16"
|
|
||||||
fill="currentColor"
|
|
||||||
class="size-3.5"
|
|
||||||
>
|
|
||||||
<path
|
|
||||||
fill-rule="evenodd"
|
|
||||||
d="M3.757 4.5c.18.217.376.42.586.608.153-.61.354-1.175.596-1.678A5.53 5.53 0 0 0 3.757 4.5ZM8 1a6.994 6.994 0 0 0-7 7 7 7 0 1 0 7-7Zm0 1.5c-.476 0-1.091.386-1.633 1.427-.293.564-.531 1.267-.683 2.063A5.48 5.48 0 0 0 8 6.5a5.48 5.48 0 0 0 2.316-.51c-.152-.796-.39-1.499-.683-2.063C9.09 2.886 8.476 2.5 8 2.5Zm3.657 2.608a8.823 8.823 0 0 0-.596-1.678c.444.298.842.659 1.182 1.07-.18.217-.376.42-.586.608Zm-1.166 2.436A6.983 6.983 0 0 1 8 8a6.983 6.983 0 0 1-2.49-.456 10.703 10.703 0 0 0 .202 2.6c.72.231 1.49.356 2.288.356.798 0 1.568-.125 2.29-.356a10.705 10.705 0 0 0 .2-2.6Zm1.433 1.85a12.652 12.652 0 0 0 .018-2.609c.405-.276.78-.594 1.117-.947a5.48 5.48 0 0 1 .44 2.262 7.536 7.536 0 0 1-1.575 1.293Zm-2.172 2.435a9.046 9.046 0 0 1-3.504 0c.039.084.078.166.12.244C6.907 13.114 7.523 13.5 8 13.5s1.091-.386 1.633-1.427c.04-.078.08-.16.12-.244Zm1.31.74a8.5 8.5 0 0 0 .492-1.298c.457-.197.893-.43 1.307-.696a5.526 5.526 0 0 1-1.8 1.995Zm-6.123 0a8.507 8.507 0 0 1-.493-1.298 8.985 8.985 0 0 1-1.307-.696 5.526 5.526 0 0 0 1.8 1.995ZM2.5 8.1c.463.5.993.935 1.575 1.293a12.652 12.652 0 0 1-.018-2.608 7.037 7.037 0 0 1-1.117-.947 5.48 5.48 0 0 0-.44 2.262Z"
|
|
||||||
clip-rule="evenodd"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
<div class=" translate-y-[0.5px]">{$i18n.t('Search the web')}</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<button
|
|
||||||
class="flex items-center dark:text-gray-500"
|
|
||||||
on:click={() => {
|
|
||||||
webSearchEnabled = false;
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
<XMark />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
</div>
|
</div>
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user