bhetherman/open-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refac

Browse Source
This commit is contained in:
Timothy Jaeryang Baek
2026-07-15 02:49:46 -04:00
parent 84b1ab0ed3
commit 622767d724
17 changed files with 192 additions and 164 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/automations/AutomationEditor.svelte
+20 -2
View File
@@ -7,7 +7,7 @@
import relativeTime from 'dayjs/plugin/relativeTime';
import localizedFormat from 'dayjs/plugin/localizedFormat';
import { WEBUI_NAME, showSidebar } from '$lib/stores';
import { WEBUI_NAME, mobile, showSidebar } from '$lib/stores';
import {
updateAutomationById,
@@ -25,6 +25,7 @@
import DeleteConfirmDialog from '$lib/components/common/ConfirmDialog.svelte';
import GarbageBin from '$lib/components/icons/GarbageBin.svelte';
import ChevronLeft from '$lib/components/icons/ChevronLeft.svelte';
import SidebarIcon from '$lib/components/icons/Sidebar.svelte';
import ScheduleDropdown from '$lib/components/automations/ScheduleDropdown.svelte';
import ModelDropdown from '$lib/components/automations/ModelDropdown.svelte';
@@ -222,7 +223,24 @@
<!-- Header Segment (Shrink-0 so it doesn't compress) -->
<div class="flex items-start justify-between gap-4 shrink-0 mb-0.5">
<div class="flex-1 min-w-0">
<div class="flex items-center gap-1.5 mb-1.5">
<div class="flex items-center gap-0.5 md:gap-1.5 mb-1.5">
{#if $mobile}
<Tooltip content={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}>
<button
id="sidebar-toggle-button"
class="cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition"
aria-label={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
on:click={() => {
showSidebar.set(!$showSidebar);
}}
type="button"
>
<div class="self-center p-1.5">
<SidebarIcon className="size-4" />
</div>
</button>
</Tooltip>
{/if}
<Tooltip content={$i18n.t('Back')}>
<button
class="text-sm p-1.5 hover:bg-black/5 dark:hover:bg-white/5 rounded-lg transition"
src/lib/components/channel/Navbar.svelte
+1 -1
View File
@@ -78,7 +78,7 @@
}}
>
<div class=" self-center p-1.5">
<Sidebar />
<Sidebar className="size-4" />
</div>
</button>
</Tooltip>
src/lib/components/chat/Messages/Error.svelte
+40 -21
View File
@@ -1,29 +1,48 @@
<script lang="ts">
import Info from '$lib/components/icons/Info.svelte';
export let content = '';
export let content: unknown = '';
const getErrorMessage = (value: unknown): string => {
if (typeof value === 'string') {
return value;
}
if (typeof value === 'object' && value !== null) {
const error = 'error' in value ? value.error : null;
if (
typeof error === 'object' &&
error !== null &&
'message' in error &&
typeof error.message === 'string'
) {
return error.message;
}
if ('detail' in value && typeof value.detail === 'string') {
return value.detail;
}
if ('message' in value && typeof value.message === 'string') {
return value.message;
}
return JSON.stringify(value) ?? String(value);
}
return JSON.stringify(value) ?? String(value);
};
$: message = getErrorMessage(content) || 'Error submitting message';
</script>
<div class="flex my-2 gap-2.5 border px-4 py-3 border-red-600/10 bg-red-600/10 rounded-lg">
<div class=" self-start mt-0.5">
<Info className="size-5 text-red-700 dark:text-red-400" />
</div>
<div
class="my-2 flex w-full items-center gap-3 rounded-3xl bg-gray-100 px-4 py-3 text-gray-800 dark:bg-gray-800 dark:text-gray-100"
>
<Info className="size-5 shrink-0" strokeWidth="2" />
<div class=" self-center text-sm">
{#if typeof content === 'string'}
{content}
{:else if typeof content === 'object' && content !== null}
{#if content?.error && content?.error?.message}
{content.error.message}
{:else if content?.detail}
{content.detail}
{:else if content?.message}
{content.message}
{:else}
{JSON.stringify(content)}
{/if}
{:else}
{JSON.stringify(content)}
{/if}
<div class="min-w-0 self-center break-words text-sm">
{message}
</div>
</div>
src/lib/components/chat/Navbar.svelte
+1 -1
View File
@@ -104,7 +104,7 @@
aria-label={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
>
<div class="self-center p-1.5">
<Sidebar />
<Sidebar className="size-4" />
</div>
</button>
</Tooltip>
src/lib/components/common/DropdownOptions.svelte
+4 -2
View File
@@ -37,11 +37,13 @@
}}
>
<svelte:fragment slot="trigger" let:selectedLabel>
{selectedLabel}
<span class="min-w-0 truncate">{selectedLabel}</span>
<ChevronDown className=" size-3" strokeWidth="2.5" />
</svelte:fragment>
<svelte:fragment slot="item" let:item let:selected>
<span class={selected ? '' : 'text-gray-500 dark:text-gray-400'}>{item.label}</span>
<span class={`min-w-0 truncate ${selected ? '' : 'text-gray-500 dark:text-gray-400'}`}
>{item.label}</span
>
</svelte:fragment>
</Select>
src/lib/components/icons/Sidebar.svelte
+6 -14
View File
@@ -1,5 +1,5 @@
<script lang="ts">
export let className = 'size-5';
export let className = 'size-4';
export let strokeWidth = '1.5';
</script>
@@ -10,18 +10,10 @@
viewBox="0 0 24 24"
stroke-width={strokeWidth}
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
class={className}
><rect
x="3"
y="3"
width="18"
height="18"
rx="5"
ry="5"
stroke="currentColor"
stroke-linecap="round"
stroke-linejoin="round"
fill="none"
></rect><path d="M9.5 21V3" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"
></path></svg
><path
d="M19 21L5 21C3.89543 21 3 20.1046 3 19L3 5C3 3.89543 3.89543 3 5 3L19 3C20.1046 3 21 3.89543 21 5L21 19C21 20.1046 20.1046 21 19 21Z"
></path><path d="M9.5 21V3"></path><path d="M5.5 10L7.25 12L5.5 14"></path></svg
>
src/lib/components/layout/SearchModal.svelte
+7 -16
View File
@@ -24,12 +24,7 @@
import Loader from '../common/Loader.svelte';
import { createMessagesList } from '$lib/utils';
import { getOutputText } from '$lib/components/chat/Messages/structuredOutput';
import {
config,
user,
chatId as currentChatId,
tags
} from '$lib/stores';
import { config, user, chatId as currentChatId, tags } from '$lib/stores';
import { refreshChatList } from '$lib/stores/chat-list';
import Messages from '../chat/Messages.svelte';
import { goto } from '$app/navigation';
@@ -561,8 +556,6 @@
messages = null;
}}
onKeydown={(e) => {
console.log('e', e);
if (e.code === 'Enter' && (chatList ?? []).length > 0) {
const item = document.querySelector(`[data-arrow-selected="true"]`);
if (item) {
@@ -585,8 +578,6 @@
/>
</div>
<!-- <hr class="border-gray-50 dark:border-gray-850/30 my-1" /> -->
<div class="flex px-3.5 pb-0.5">
<div
class="flex flex-col overflow-y-auto h-96 md:h-[40rem] max-h-full scrollbar-hidden w-full flex-1 pr-2"
@@ -597,12 +588,12 @@
{#each actions as action, idx (action.label)}
<button
class=" w-full flex items-center rounded-xl text-sm py-1.5 px-2.5 hover:bg-gray-50 dark:hover:bg-gray-850 {selectedIdx ===
class="w-full flex items-center rounded-lg text-sm py-1.5 px-2.5 hover:bg-gray-50/70 dark:hover:bg-gray-850/50 {selectedIdx ===
idx
? 'bg-gray-50 dark:bg-gray-850'
? 'bg-gray-50/70 dark:bg-gray-850/50'
: ''}"
data-arrow-selected={selectedIdx === idx ? 'true' : undefined}
dragabble="false"
draggable="false"
on:mouseenter={() => {
selectedIdx = idx;
}}
@@ -622,7 +613,7 @@
{/each}
{#if chatList}
<hr class="border-gray-50 dark:border-gray-850/30 my-3" />
<div aria-hidden="true" class="h-px my-3" />
{#if chatList.length === 0}
<div class="text-xs text-gray-500 dark:text-gray-400 text-center px-5 py-4">
@@ -661,9 +652,9 @@
<!-- svelte-ignore a11y-no-static-element-interactions -->
<div
class="w-full flex justify-between items-center rounded-xl text-sm py-1.5 pl-2.5 pr-32 hover:bg-gray-50 dark:hover:bg-gray-850 group/item relative {selectedIdx ===
class="w-full flex justify-between items-center rounded-lg text-sm py-1.5 pl-2.5 pr-32 hover:bg-gray-50/70 dark:hover:bg-gray-850/50 group/item relative {selectedIdx ===
idx + actions.length
? 'bg-gray-50 dark:bg-gray-850'
? 'bg-gray-50/70 dark:bg-gray-850/50'
: ''}"
data-arrow-selected={selectedIdx === idx + actions.length ? 'true' : undefined}
on:mouseenter={() => {
src/lib/components/layout/Sidebar.svelte
+2 -2
View File
@@ -821,7 +821,7 @@
alt=""
/>
<Sidebar className="size-4.5 hidden group-hover:flex" />
<Sidebar className="size-4 hidden group-hover:flex" />
</div>
</button>
</Tooltip>
@@ -1054,7 +1054,7 @@
aria-label={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
>
<div class=" self-center">
<Sidebar className="size-4.5" />
<Sidebar className="size-4" />
</div>
</button>
</Tooltip>
src/lib/components/notes/NoteEditor.svelte
+15 -19
View File
@@ -924,27 +924,23 @@ Provide the enhanced notes in markdown format. Use markdown syntax for headings,
<div class="shrink-0 w-full flex justify-between items-center px-3.5 mb-1.5">
<div class="w-full min-w-0 flex items-center">
{#if $mobile}
<div
class="{$showSidebar
? 'md:hidden pl-0.5'
: ''} flex flex-none items-center pr-1 -translate-x-1"
<Tooltip
content={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
>
<Tooltip
content={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
<button
id="sidebar-toggle-button"
class=" cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition cursor-"
aria-label={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
type="button"
on:click={() => {
showSidebar.set(!$showSidebar);
}}
>
<button
id="sidebar-toggle-button"
class=" cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition cursor-"
on:click={() => {
showSidebar.set(!$showSidebar);
}}
>
<div class=" self-center p-1.5">
<Sidebar />
</div>
</button>
</Tooltip>
</div>
<div class=" self-center p-1.5">
<Sidebar className="size-4" />
</div>
</button>
</Tooltip>
{/if}
<input
src/lib/components/notes/Notes.svelte
+28 -26
View File
@@ -339,37 +339,39 @@
</div>
</DeleteConfirmDialog>
<div class="flex flex-col gap-1 px-1 mt-1.5 mb-2">
<div class="flex justify-between items-center">
<div class="flex items-center md:self-center text-xl font-normal px-0.5 gap-2 shrink-0">
{#if $mobile}
<Tooltip content={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}>
<button
id="sidebar-toggle-button"
class="cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition"
on:click={() => {
showSidebar.set(!$showSidebar);
}}
>
<div class="self-center p-1.5">
<SidebarIcon />
</div>
</button>
</Tooltip>
{/if}
<div class="flex items-center gap-0.5 md:gap-1 mb-2">
{#if $mobile}
<div class="{$showSidebar ? 'md:hidden' : ''} flex flex-none items-center">
<Tooltip
content={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
interactive={true}
>
<button
id="sidebar-toggle-button"
class="cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition"
on:click={() => {
showSidebar.set(!$showSidebar);
}}
>
<div class="self-center p-1.5">
<SidebarIcon className="size-4" />
</div>
</button>
</Tooltip>
</div>
{/if}
<div>
{$i18n.t('Notes')}
</div>
<div class="text-lg font-normal text-gray-500 dark:text-gray-500">
<div class="flex w-full items-center">
<div class="flex items-center gap-1 py-1 min-w-0">
<span class="min-w-fit px-1 text-sm select-none">{$i18n.t('Notes')}</span>
<span class="text-xs text-gray-500 dark:text-gray-500">
{total ?? ''}
</div>
</span>
</div>
<div class="flex w-full justify-end gap-1.5">
<div class="ml-auto flex items-center gap-1">
<button
class=" px-2 py-1.5 rounded-xl bg-black text-white dark:bg-white dark:text-black transition font-normal text-sm flex items-center"
class="ml-1 px-2 py-1.5 text-xs gap-1 rounded-xl bg-black text-white dark:bg-white dark:text-black transition flex items-center"
on:click={async () => {
const res = await createNoteHandler(dayjs().format('YYYY-MM-DD'));
src/lib/components/workspace/Models.svelte
+17 -13
View File
@@ -556,10 +556,10 @@
<Dropdown align="end">
<Tooltip content={$i18n.t('Actions')}>
<button
class="flex h-8 items-center gap-1.5 rounded-xl bg-transparent px-1.5 text-[13px] font-normal text-gray-700 transition hover:text-gray-900 dark:text-gray-200 dark:hover:text-gray-100"
class="flex h-8 min-w-0 max-w-28 items-center gap-1.5 rounded-xl bg-transparent px-1.5 text-[13px] font-normal text-gray-700 transition hover:text-gray-900 dark:text-gray-200 dark:hover:text-gray-100"
type="button"
>
<span>{$i18n.t('Actions')}</span>
<span class="min-w-0 truncate">{$i18n.t('Actions')}</span>
<ChevronDown className="size-3" strokeWidth="2.5" />
</button>
</Tooltip>
@@ -634,7 +634,7 @@
}
}}
>
<div class="flex group/item gap-3.5 w-full">
<div class="flex group/item min-w-0 gap-3.5 w-full">
<div class="self-center pl-0.5">
<div class="flex bg-white rounded-2xl">
<div
@@ -658,18 +658,22 @@
<div class=" shrink-0 flex w-full min-w-0 flex-1 pr-1 self-center">
<div class="flex h-full w-full flex-1 flex-col justify-start self-center group">
<div class="flex-1 w-full">
<div class="flex items-center justify-between w-full">
<Tooltip content={model.name} className=" w-fit" placement="top-start">
<div class="min-w-0 flex-1 w-full">
<div class="flex min-w-0 items-center justify-between w-full gap-2">
<Tooltip
content={model.name}
className="min-w-0 flex-1"
placement="top-start"
>
<a
class=" font-normal line-clamp-1 hover:underline capitalize"
class="font-normal line-clamp-1 hover:underline capitalize"
href={`/?models=${encodeURIComponent(model.id)}`}
>
{model.name}
</a>
</Tooltip>
<div class="flex items-center gap-1">
<div class="flex shrink-0 items-center gap-1">
{#if !model.write_access}
<div>
<Badge type="muted" content={$i18n.t('Read Only')} />
@@ -786,7 +790,7 @@
</div>
</div>
<div class=" flex gap-1 pr-2 -mt-1 items-center">
<div class="flex min-w-0 gap-1 pr-2 -mt-1 items-center">
<Tooltip
content={model?.user?.email ?? $i18n.t('Deleted User')}
className="flex shrink-0"
@@ -801,15 +805,15 @@
</div>
</Tooltip>
<div>·</div>
<div class="shrink-0">·</div>
<Tooltip
content={marked.parse(model?.meta?.description ?? model.id)}
className=" w-fit text-left"
className="min-w-0 text-left"
placement="top-start"
>
<div class="flex gap-1 text-xs overflow-hidden">
<div class="line-clamp-1">
<div class="flex min-w-0 gap-1 text-xs overflow-hidden">
<div class="line-clamp-1 min-w-0">
{#if (model?.meta?.description ?? '').trim()}
{model?.meta?.description}
{:else}
src/routes/(app)/admin/+layout.svelte
+7 -6
View File
@@ -35,12 +35,12 @@
<div
class=" flex flex-col h-screen max-h-[100dvh] flex-1 transition-width duration-200 ease-in-out {$showSidebar
? 'md:max-w-[calc(100%-var(--sidebar-width))]'
: ''} w-full max-w-full"
: 'md:max-w-[calc(100%-42px)]'} w-full max-w-full"
>
<nav class=" px-1.5 pt-0.5 backdrop-blur-xl drag-region select-none">
<div class=" flex items-center gap-1">
<div class=" flex items-center gap-0.5 md:gap-1">
{#if $mobile}
<div class="{$showSidebar ? 'md:hidden' : ''} flex flex-none items-center self-end">
<div class="{$showSidebar ? 'md:hidden' : ''} self-center flex flex-none items-center">
<Tooltip
content={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
interactive={true}
@@ -48,21 +48,22 @@
<button
id="sidebar-toggle-button"
class=" cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition cursor-"
aria-label={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
on:click={() => {
showSidebar.set(!$showSidebar);
}}
>
<div class=" self-center p-1.5">
<Sidebar />
<Sidebar className="size-4" />
</div>
</button>
</Tooltip>
</div>
{/if}
<div class=" flex w-full">
<div class="">
<div
class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-normal rounded-full bg-transparent pt-1"
class="flex gap-0.5 md:gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-normal rounded-full bg-transparent py-1 touch-auto pointer-events-auto"
>
<a
draggable="false"
src/routes/(app)/automations/+page.svelte
+28 -24
View File
@@ -260,35 +260,39 @@
<div class="flex-1 max-h-full overflow-y-auto">
{#if loaded}
<div class="pb-1 px-3 md:px-[18px] pt-2">
<div class="flex flex-col gap-1 px-1 mt-1.5 mb-2">
<div class="flex justify-between items-center">
<div class="flex items-center md:self-center text-xl font-normal px-0.5 gap-2 shrink-0">
{#if $mobile}
<Tooltip
content={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
<div class="flex items-center gap-0.5 md:gap-1 mb-2">
{#if $mobile}
<div class="{$showSidebar ? 'md:hidden' : ''} flex flex-none items-center">
<Tooltip
content={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
interactive={true}
>
<button
id="sidebar-toggle-button"
class="cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition"
on:click={() => {
showSidebar.set(!$showSidebar);
}}
>
<button
id="sidebar-toggle-button"
class="cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition"
on:click={() => {
showSidebar.set(!$showSidebar);
}}
>
<div class="self-center p-1.5">
<SidebarIcon />
</div>
</button>
</Tooltip>
{/if}
<div>{$i18n.t('Automations')}</div>
<div class="text-lg font-normal text-gray-500 dark:text-gray-500">
<div class="self-center p-1.5">
<SidebarIcon className="size-4" />
</div>
</button>
</Tooltip>
</div>
{/if}
<div class="flex w-full items-center">
<div class="flex items-center gap-1 py-1 min-w-0">
<span class="min-w-fit px-1 text-sm select-none">{$i18n.t('Automations')}</span>
<span class="text-xs text-gray-500 dark:text-gray-500">
{total ?? ''}
</div>
</span>
</div>
<div class="flex w-full justify-end gap-1.5">
<div class="ml-auto flex items-center gap-1">
<button
class="px-2 py-1.5 rounded-xl bg-black text-white dark:bg-white dark:text-black transition font-normal text-sm flex items-center"
class="ml-1 px-2 py-1.5 text-xs gap-1 rounded-xl bg-black text-white dark:bg-white dark:text-black transition flex items-center"
on:click={() => {
cloneFrom = null;
showCreateModal = true;
src/routes/(app)/calendar/+page.svelte
+2 -2
View File
@@ -230,7 +230,7 @@
{#if loaded}
<!-- Top Navbar — spans above sidebar and calendar -->
<nav class="px-3 pt-2 pb-2 backdrop-blur-xl drag-region select-none shrink-0">
<div class="flex items-center gap-1">
<div class="flex items-center gap-0.5 md:gap-1">
{#if $mobile}
<div class="{$showSidebar ? 'md:hidden' : ''} flex flex-none items-center">
<Tooltip
@@ -243,7 +243,7 @@
on:click={() => showSidebar.set(!$showSidebar)}
>
<div class="self-center p-1.5">
<SidebarIcon />
<SidebarIcon className="size-4" />
</div>
</button>
</Tooltip>
src/routes/(app)/home/+layout.svelte
+2 -2
View File
@@ -37,7 +37,7 @@
}}
>
<div class=" self-center p-1.5">
<Sidebar />
<Sidebar className="size-4" />
</div>
</button>
</Tooltip>
@@ -46,7 +46,7 @@
<div class=" flex w-full">
<div
class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-normal rounded-full bg-transparent pt-1"
class="flex gap-0.5 md:gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-normal rounded-full bg-transparent pt-1"
>
<a
class="min-w-fit p-1.5 {$page.url.pathname.includes('/home/notes')
src/routes/(app)/playground/+layout.svelte
+9 -10
View File
@@ -1,13 +1,11 @@
<script lang="ts">
import { onMount, getContext } from 'svelte';
import { WEBUI_NAME, showSidebar, functions, mobile } from '$lib/stores';
import { getContext } from 'svelte';
import { WEBUI_NAME, showSidebar, mobile } from '$lib/stores';
import { page } from '$app/stores';
import Tooltip from '$lib/components/common/Tooltip.svelte';
import Sidebar from '$lib/components/icons/Sidebar.svelte';
const i18n = getContext('i18n');
onMount(async () => {});
</script>
<svelte:head>
@@ -21,10 +19,10 @@
? 'md:max-w-[calc(100%-var(--sidebar-width))]'
: ''} max-w-full"
>
<nav class=" px-2.5 backdrop-blur-xl w-full drag-region select-none">
<div class=" flex items-center">
<nav class=" px-1.5 pt-0.5 backdrop-blur-xl drag-region select-none">
<div class=" flex items-center gap-0.5 md:gap-1">
{#if $mobile}
<div class="{$showSidebar ? 'md:hidden' : ''} flex flex-none items-center self-end">
<div class="{$showSidebar ? 'md:hidden' : ''} self-center flex flex-none items-center">
<Tooltip
content={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
interactive={true}
@@ -32,21 +30,22 @@
<button
id="sidebar-toggle-button"
class=" cursor-pointer flex rounded-lg hover:bg-gray-100 dark:hover:bg-gray-850 transition cursor-"
aria-label={$showSidebar ? $i18n.t('Close Sidebar') : $i18n.t('Open Sidebar')}
on:click={() => {
showSidebar.set(!$showSidebar);
}}
>
<div class=" self-center p-1.5">
<Sidebar />
<Sidebar className="size-4" />
</div>
</button>
</Tooltip>
</div>
{/if}
<div class=" flex w-full">
<div class="">
<div
class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-normal rounded-full bg-transparent pt-1"
class="flex gap-0.5 md:gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-normal rounded-full bg-transparent py-1 touch-auto pointer-events-auto"
>
<a
draggable="false"
src/routes/(app)/workspace/+layout.svelte
+3 -3
View File
@@ -61,7 +61,7 @@
: ''} max-w-full"
>
<nav class=" px-1.5 pt-0.5 backdrop-blur-xl drag-region select-none">
<div class=" flex items-center gap-1">
<div class=" flex items-center gap-0.5 md:gap-1">
{#if $mobile}
<div class="{$showSidebar ? 'md:hidden' : ''} self-center flex flex-none items-center">
<Tooltip
@@ -77,7 +77,7 @@
}}
>
<div class=" self-center p-1.5">
<Sidebar />
<Sidebar className="size-4" />
</div>
</button>
</Tooltip>
@@ -86,7 +86,7 @@
<div class="">
<div
class="flex gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-normal rounded-full bg-transparent py-1 touch-auto pointer-events-auto"
class="flex gap-0.5 md:gap-1 scrollbar-none overflow-x-auto w-fit text-center text-sm font-normal rounded-full bg-transparent py-1 touch-auto pointer-events-auto"
>
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.models}
<a