OpenWebUI/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui synced 2025-06-26 18:26:48 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

make the collapse toggle more subtle & compact

Browse Source
This commit is contained in:
Taylor Wilsdon 2025-05-09 10:26:48 -04:00
parent ccbc46fbbe
commit 628a10e34a
1 changed files with 17 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/lib/components/chat/MessageInput/InputMenu.svelte
View File

@ -33,6 +33,7 @@
let tools = {};
let show = false;
let showAllTools = false;
$: if (show) {
init();
@ -102,7 +103,7 @@
transition={flyAndScale}
>
{#if Object.keys(tools).length > 0}
<div class="max-h-28 overflow-y-auto scrollbar-thin">
<div class="{showAllTools ? '' : 'max-h-28'} overflow-y-auto scrollbar-thin">
{#each Object.keys(tools) as toolId}
<button
class="flex w-full justify-between gap-2 items-center px-3 py-2 text-sm font-medium cursor-pointer rounded-xl"
@ -141,18 +142,25 @@
</button>
{/each}
</div>
<button
class="flex w-full justify-center px-3 py-2 text-sm font-medium cursor-pointer rounded-xl hover:bg-gray-50 dark:hover:bg-gray-800"
<button
class="flex w-full justify-center items-center text-sm font-medium cursor-pointer rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800"
on:click={() => {
const element = document.querySelector('.max-h-28');
if (element) {
element.classList.remove('max-h-28');
}
showAllTools = !showAllTools;
}}
title={showAllTools ? $i18n.t('Show Less') : $i18n.t('Show All')}
>
^
<svg
xmlns="http://www.w3.org/2000/svg"
fill="none"
viewBox="0 0 24 24"
stroke-width="2.5"
stroke="currentColor"
class="size-3 transition-transform duration-200 {showAllTools ? 'rotate-180' : ''} text-gray-300 dark:text-gray-600"
>
<path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5"
></path>
</svg>
</button>
<hr class="border-black/5 dark:border-white/5 my-1" />
{/if}