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-08-10 18:52:18 -06:00
parent eeaf1a1df0
commit d4461bd6f3
139 changed files with 470 additions and 470 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/lib/components/common/Badge.svelte
+1 -1
View File
@@ -13,7 +13,7 @@
<div
class=" text-xs font-normal {classNames[type] ??
classNames['info']} w-fit px-[5px] rounded-lg uppercase line-clamp-1 mr-0.5"
classNames['info']} w-fit px-[0.3125rem] rounded-lg uppercase line-clamp-1 mr-0.5"
>
{content}
</div>
src/lib/components/common/DocxPreview.svelte
+2 -2
View File
@@ -164,7 +164,7 @@
{:else if fallbackHtml}
<div bind:this={outerContainer} class="h-full overflow-auto overscroll-contain">
<div
class="max-w-[816px] min-h-[1056px] my-4 mx-auto py-14 px-16 bg-white text-gray-900 shadow rounded-sm font-[Calibri,Arial,sans-serif] text-base leading-[1.45] [&_.docx-title]:m-0 [&_.docx-title]:mb-4 [&_.docx-title]:text-3xl [&_.docx-title]:leading-[1.2] [&_.docx-subtitle]:mt-[-0.5rem] [&_.docx-subtitle]:mb-5 [&_.docx-subtitle]:text-xl [&_.docx-subtitle]:text-gray-500 [&_.docx-caption]:text-center [&_.docx-caption]:text-sm [&_.docx-caption]:text-gray-500 [&_p]:mt-0 [&_p]:mb-[0.65rem] [&_img]:block [&_img]:max-w-full [&_img]:h-auto [&_img]:my-3 [&_img]:mx-auto [&_table]:w-full [&_table]:my-3 [&_table]:border-collapse [&_table]:font-[Calibri,Arial,sans-serif] [&_table]:text-[0.95rem] [&_td]:border [&_td]:border-gray-300/70 [&_td]:px-2 [&_td]:py-1.5 [&_td]:align-top [&_th]:border [&_th]:border-gray-300/70 [&_th]:px-2 [&_th]:py-1.5 [&_th]:align-top [&_blockquote]:my-4 [&_blockquote]:border-l-[3px] [&_blockquote]:border-gray-300 [&_blockquote]:pl-4 [&_blockquote]:text-gray-700"
class="max-w-[51rem] min-h-[66rem] my-4 mx-auto py-14 px-16 bg-white text-gray-900 shadow rounded-sm font-[Calibri,Arial,sans-serif] text-base leading-[1.45] [&_.docx-title]:m-0 [&_.docx-title]:mb-4 [&_.docx-title]:text-3xl [&_.docx-title]:leading-[1.2] [&_.docx-subtitle]:mt-[-0.5rem] [&_.docx-subtitle]:mb-5 [&_.docx-subtitle]:text-xl [&_.docx-subtitle]:text-gray-500 [&_.docx-caption]:text-center [&_.docx-caption]:text-sm [&_.docx-caption]:text-gray-500 [&_p]:mt-0 [&_p]:mb-[0.65rem] [&_img]:block [&_img]:max-w-full [&_img]:h-auto [&_img]:my-3 [&_img]:mx-auto [&_table]:w-full [&_table]:my-3 [&_table]:border-collapse [&_table]:font-[Calibri,Arial,sans-serif] [&_table]:text-[0.95rem] [&_td]:border [&_td]:border-gray-300/70 [&_td]:px-2 [&_td]:py-1.5 [&_td]:align-top [&_th]:border [&_th]:border-gray-300/70 [&_th]:px-2 [&_th]:py-1.5 [&_th]:align-top [&_blockquote]:my-4 [&_blockquote]:border-l-[3px] [&_blockquote]:border-gray-300 [&_blockquote]:pl-4 [&_blockquote]:text-gray-700"
>
<!-- eslint-disable-next-line svelte/no-at-html-tags -->
{@html fallbackHtml}
@@ -205,7 +205,7 @@
</button>
<button
type="button"
class="shrink-0 min-w-12 h-7 px-1.5 py-1 text-center text-[11px] font-normal text-gray-500 dark:text-gray-400 rounded-md hover:bg-gray-100 dark:hover:bg-gray-800 transition tabular-nums"
class="shrink-0 min-w-12 h-7 px-1.5 py-1 text-center text-[0.6875rem] font-normal text-gray-500 dark:text-gray-400 rounded-md hover:bg-gray-100 dark:hover:bg-gray-800 transition tabular-nums"
on:click={resetView}
aria-label="Reset zoom"
>
src/lib/components/common/DropdownMenu.svelte
+1 -1
View File
@@ -4,7 +4,7 @@
</script>
<div
class={`rounded-xl! p-0.5! border border-gray-100 dark:border-gray-800 z-50 bg-white text-gray-900 dark:bg-gray-850 dark:text-white shadow-lg ${className} [&_button:hover]:bg-gray-50/40! dark:[&_button:hover]:bg-gray-800/40! [&_a:hover]:bg-gray-50/40! dark:[&_a:hover]:bg-gray-800/40! [&_button:hover]:text-gray-900 dark:[&_button:hover]:text-gray-100 [&_a:hover]:text-gray-900 dark:[&_a:hover]:text-gray-100 [&>button]:flex [&>button]:w-full [&>button]:h-[1.6875rem]! [&>button]:items-center [&>button]:gap-2! [&>button]:rounded-xl! [&>button]:bg-transparent [&>button]:px-2! [&>button]:text-[13px]! [&>button]:font-normal! [&>a]:flex [&>a]:w-full [&>a]:h-[1.6875rem]! [&>a]:items-center [&>a]:gap-2! [&>a]:rounded-xl! [&>a]:bg-transparent [&>a]:px-2! [&>a]:text-[13px]! [&>a]:font-normal! [&_button_svg]:size-3.5! [&_a_svg]:size-3.5! [&>hr]:my-0.5 [&>hr]:mx-1`}
class={`rounded-xl! p-0.5! border border-gray-100 dark:border-gray-800 z-50 bg-white text-gray-900 dark:bg-gray-850 dark:text-white shadow-lg ${className} [&_button:hover]:bg-gray-50/40! dark:[&_button:hover]:bg-gray-800/40! [&_a:hover]:bg-gray-50/40! dark:[&_a:hover]:bg-gray-800/40! [&_button:hover]:text-gray-900 dark:[&_button:hover]:text-gray-100 [&_a:hover]:text-gray-900 dark:[&_a:hover]:text-gray-100 [&>button]:flex [&>button]:w-full [&>button]:h-[1.6875rem]! [&>button]:items-center [&>button]:gap-2! [&>button]:rounded-xl! [&>button]:bg-transparent [&>button]:px-2! [&>button]:text-[0.8125rem]! [&>button]:font-normal! [&>a]:flex [&>a]:w-full [&>a]:h-[1.6875rem]! [&>a]:items-center [&>a]:gap-2! [&>a]:rounded-xl! [&>a]:bg-transparent [&>a]:px-2! [&>a]:text-[0.8125rem]! [&>a]:font-normal! [&_button_svg]:size-3.5! [&_a_svg]:size-3.5! [&>hr]:my-0.5 [&>hr]:mx-1`}
{style}
>
<slot />
src/lib/components/common/DropdownOptions.svelte
+2 -2
View File
@@ -30,8 +30,8 @@
{align}
triggerClass={className
? className
: 'flex h-8 shrink-0 items-center gap-1.5 rounded-xl bg-transparent px-1.5 text-[13px] font-normal text-gray-700 transition placeholder-gray-400 outline-hidden hover:text-gray-900 focus:outline-hidden dark:text-gray-200 dark:hover:text-gray-100'}
itemClass="flex h-[1.6875rem] w-full cursor-pointer items-center gap-2 rounded-xl bg-transparent px-2 text-[13px] hover:bg-gray-50/40 hover:text-gray-900 dark:hover:bg-gray-800/40 dark:hover:text-gray-100"
: 'flex h-8 shrink-0 items-center gap-1.5 rounded-xl bg-transparent px-1.5 text-[0.8125rem] font-normal text-gray-700 transition placeholder-gray-400 outline-hidden hover:text-gray-900 focus:outline-hidden dark:text-gray-200 dark:hover:text-gray-100'}
itemClass="flex h-[1.6875rem] w-full cursor-pointer items-center gap-2 rounded-xl bg-transparent px-2 text-[0.8125rem] hover:bg-gray-50/40 hover:text-gray-900 dark:hover:bg-gray-800/40 dark:hover:text-gray-100"
onChange={(v) => {
onChange(v);
}}
src/lib/components/common/EmojiPicker.svelte
+2 -2
View File
@@ -171,14 +171,14 @@
<div class="mb-0.5 px-3 pt-2 pb-1.5">
<input
type="text"
class="w-full text-[13px] bg-transparent outline-hidden"
class="w-full text-[0.8125rem] bg-transparent outline-hidden"
placeholder={$i18n.t('Search all emojis')}
bind:value={search}
/>
</div>
<!-- Virtualized Emoji List -->
<div class="w-full flex justify-start h-96 overflow-y-auto px-2.5 pb-2.5 text-[13px]">
<div class="w-full flex justify-start h-96 overflow-y-auto px-2.5 pb-2.5 text-[0.8125rem]">
{#if emojiRows.length === 0}
<div class="text-center text-xs text-gray-500 dark:text-gray-400">
{$i18n.t('No results')}
src/lib/components/common/Folder.svelte
+1 -1
View File
@@ -158,7 +158,7 @@
>
<button class="w-full py-1.5 pl-2 flex items-center gap-1.5 text-xs font-normal">
{#if chevron}
<div class=" p-[1px]">
<div class=" p-[0.0625rem]">
{#if open}
<ChevronDown className=" size-3" strokeWidth="2" />
{:else}
src/lib/components/common/MultiSelect.svelte
+1 -1
View File
@@ -105,7 +105,7 @@
{#if open}
<div use:portal bind:this={contentEl} transition:flyAndScale>
<div
class="rounded-2xl min-w-[170px] max-h-72 overflow-y-auto p-1 border border-gray-100 dark:border-gray-800 bg-white dark:bg-gray-850 dark:text-white shadow-lg"
class="rounded-2xl min-w-[10.625rem] max-h-72 overflow-y-auto p-1 border border-gray-100 dark:border-gray-800 bg-white dark:bg-gray-850 dark:text-white shadow-lg"
>
{#each items as item}
<button
src/lib/components/common/PDFViewer.svelte
+1 -1
View File
@@ -309,7 +309,7 @@
</button>
<button
type="button"
class="shrink-0 min-w-12 h-7 px-1.5 py-1 text-center text-[11px] font-normal text-gray-500 dark:text-gray-400 rounded-md hover:bg-gray-100 dark:hover:bg-gray-800 transition tabular-nums"
class="shrink-0 min-w-12 h-7 px-1.5 py-1 text-center text-[0.6875rem] font-normal text-gray-500 dark:text-gray-400 rounded-md hover:bg-gray-100 dark:hover:bg-gray-800 transition tabular-nums"
on:click={resetView}
aria-label="Reset zoom"
>
src/lib/components/common/Pagination.svelte
+3 -3
View File
@@ -15,7 +15,7 @@
{#snippet children({ pages })}
<div class="my-2 flex items-center">
<Pagination.PrevButton
class="mr-[25px] inline-flex size-8 items-center justify-center rounded-[9px] bg-transparent hover:bg-gray-50 dark:hover:bg-gray-850 active:scale-98 disabled:cursor-not-allowed disabled:text-gray-400 dark:disabled:text-gray-700 hover:disabled:bg-transparent dark:hover:disabled:bg-transparent"
class="mr-[1.5625rem] inline-flex size-8 items-center justify-center rounded-[0.5625rem] bg-transparent hover:bg-gray-50 dark:hover:bg-gray-850 active:scale-98 disabled:cursor-not-allowed disabled:text-gray-400 dark:disabled:text-gray-700 hover:disabled:bg-transparent dark:hover:disabled:bg-transparent"
>
<ChevronLeft className="size-4" strokeWidth="2" />
</Pagination.PrevButton>
@@ -26,7 +26,7 @@
{:else}
<Pagination.Page
{page}
class="inline-flex size-8 items-center justify-center rounded-[9px] bg-transparent hover:bg-gray-50 dark:hover:bg-gray-850 text-sm font-normal hover:bg-dark-10 active:scale-98 disabled:cursor-not-allowed disabled:opacity-50 hover:disabled:bg-transparent data-selected:bg-gray-50 data-selected:text-gray-700 data-selected:hover:bg-gray-100 dark:data-selected:bg-gray-850 dark:data-selected:text-gray-50 dark:data-selected:hover:bg-gray-800 transition"
class="inline-flex size-8 items-center justify-center rounded-[0.5625rem] bg-transparent hover:bg-gray-50 dark:hover:bg-gray-850 text-sm font-normal hover:bg-dark-10 active:scale-98 disabled:cursor-not-allowed disabled:opacity-50 hover:disabled:bg-transparent data-selected:bg-gray-50 data-selected:text-gray-700 data-selected:hover:bg-gray-100 dark:data-selected:bg-gray-850 dark:data-selected:text-gray-50 dark:data-selected:hover:bg-gray-800 transition"
>
{page.value}
</Pagination.Page>
@@ -34,7 +34,7 @@
{/each}
</div>
<Pagination.NextButton
class="ml-[25px] inline-flex size-8 items-center justify-center rounded-[9px] bg-transparent hover:bg-gray-50 dark:hover:bg-gray-850 active:scale-98 disabled:cursor-not-allowed disabled:text-gray-400 dark:disabled:text-gray-700 hover:disabled:bg-transparent dark:hover:disabled:bg-transparent"
class="ml-[1.5625rem] inline-flex size-8 items-center justify-center rounded-[0.5625rem] bg-transparent hover:bg-gray-50 dark:hover:bg-gray-850 active:scale-98 disabled:cursor-not-allowed disabled:text-gray-400 dark:disabled:text-gray-700 hover:disabled:bg-transparent dark:hover:disabled:bg-transparent"
>
<ChevronRight className="size-4" strokeWidth="2" />
</Pagination.NextButton>
src/lib/components/common/PptxPreview.svelte
+3 -3
View File
@@ -150,7 +150,7 @@
aria-current={safeSlide === index ? 'true' : undefined}
>
<span
class="pt-[7px] text-xs font-medium text-right {safeSlide === index
class="pt-[0.4375rem] text-xs font-medium text-right {safeSlide === index
? 'text-gray-900 dark:text-gray-100'
: 'text-gray-500 dark:text-gray-400'}">{index + 1}</span
>
@@ -221,7 +221,7 @@
</svg>
</button>
<span
class="shrink-0 min-w-12 text-center text-[11px] text-gray-500 dark:text-gray-400 tabular-nums"
class="shrink-0 min-w-12 text-center text-[0.6875rem] text-gray-500 dark:text-gray-400 tabular-nums"
>{safeSlide + 1} / {slides.length}</span
>
<button
@@ -265,7 +265,7 @@
</button>
<button
type="button"
class="shrink-0 min-w-12 h-7 px-1.5 py-1 text-center text-[11px] font-normal text-gray-500 dark:text-gray-400 rounded-md hover:bg-gray-100 dark:hover:bg-gray-800 transition tabular-nums"
class="shrink-0 min-w-12 h-7 px-1.5 py-1 text-center text-[0.6875rem] font-normal text-gray-500 dark:text-gray-400 rounded-md hover:bg-gray-100 dark:hover:bg-gray-800 transition tabular-nums"
on:click={resetView}
aria-label="Reset zoom"
>
src/lib/components/common/Select.svelte
+2 -2
View File
@@ -22,14 +22,14 @@
export let labelClass = '';
/** CSS classes for the dropdown content container */
export let contentClass = 'min-w-[170px]';
export let contentClass = 'min-w-[10.625rem]';
/** Max height for the dropdown content */
export let maxHeight = '18rem';
/** CSS classes for each item button */
export let itemClass =
'flex h-[1.6875rem] w-full cursor-pointer items-center gap-2 rounded-xl bg-transparent px-2 text-[13px] hover:bg-gray-50/40 hover:text-gray-900 dark:hover:bg-gray-800/40 dark:hover:text-gray-100';
'flex h-[1.6875rem] w-full cursor-pointer items-center gap-2 rounded-xl bg-transparent px-2 text-[0.8125rem] hover:bg-gray-50/40 hover:text-gray-900 dark:hover:bg-gray-800/40 dark:hover:text-gray-100';
/** Alignment of the dropdown: 'start' | 'end' */
export let align = 'start';
src/lib/components/common/SplitCreateButton.svelte
+1 -1
View File
@@ -80,7 +80,7 @@
</button>
<div slot="content">
<DropdownMenu className="min-w-[170px]">
<DropdownMenu className="min-w-[10.625rem]">
{#each visibleActions as action (action.id)}
{@const Icon = getActionIcon(action.id)}
{#if action.href}
src/lib/components/common/Switch.svelte
+1 -1
View File
@@ -30,7 +30,7 @@
{id}
aria-labelledby={ariaLabelledbyId || undefined}
aria-label={ariaLabel || undefined}
class="relative h-4 min-h-4 w-7 shrink-0 cursor-pointer rounded-full mx-[1px] transition-colors duration-150 {($settings?.highContrastMode ??
class="relative h-4 min-h-4 w-7 shrink-0 cursor-pointer rounded-full mx-[0.0625rem] transition-colors duration-150 {($settings?.highContrastMode ??
false)
? 'focus:outline focus:outline-2 focus:outline-gray-800 focus:dark:outline-gray-200'
: 'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-400 dark:focus-visible:outline-gray-500'} {state
src/lib/components/common/Tags.svelte
+1 -1
View File
@@ -134,7 +134,7 @@
{#each filteredSuggestionTags as tag (tag)}
<button
type="button"
class="flex w-full items-center rounded-xl px-2 py-[5px] text-left text-xs text-gray-700 transition-colors hover:bg-gray-50 dark:text-gray-200 dark:hover:bg-gray-800"
class="flex w-full items-center rounded-xl px-2 py-[0.3125rem] text-left text-xs text-gray-700 transition-colors hover:bg-gray-50 dark:text-gray-200 dark:hover:bg-gray-800"
role="option"
on:mousedown={(event) => {
event.preventDefault();
src/lib/components/common/Tags/TagItem.svelte
+2 -2
View File
@@ -13,14 +13,14 @@
{#if tag}
{#if disabled}
<span
class="flex items-center gap-1 px-1.5 py-[1px] rounded-full bg-gray-100/50 dark:bg-gray-800/50 border border-gray-100 dark:border-gray-800 text-gray-600 dark:text-gray-300 text-xs font-normal"
class="flex items-center gap-1 px-1.5 py-[0.0625rem] rounded-full bg-gray-100/50 dark:bg-gray-800/50 border border-gray-100 dark:border-gray-800 text-gray-600 dark:text-gray-300 text-xs font-normal"
>
<span class="line-clamp-1">{tag.name}</span>
</span>
{:else}
<button
type="button"
class="flex items-center gap-1 px-1.5 py-[1px] rounded-full bg-gray-100/50 dark:bg-gray-800/50 border border-gray-100 dark:border-gray-800 text-gray-600 dark:text-gray-300 text-xs font-normal hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors"
class="flex items-center gap-1 px-1.5 py-[0.0625rem] rounded-full bg-gray-100/50 dark:bg-gray-800/50 border border-gray-100 dark:border-gray-800 text-gray-600 dark:text-gray-300 text-xs font-normal hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors"
on:click={() => {
onDelete();
}}
src/lib/components/common/ToolCallDisplay.svelte
+2 -2
View File
@@ -180,7 +180,7 @@
{#if args}
<div>
<div
class="text-[10px] uppercase tracking-wider font-normal text-gray-400 dark:text-gray-500 mb-1.5 px-1"
class="text-[0.625rem] uppercase tracking-wider font-normal text-gray-400 dark:text-gray-500 mb-1.5 px-1"
>
{$i18n.t('Input')}
</div>
@@ -213,7 +213,7 @@
{#if isDone && result}
<div>
<div
class="text-[10px] uppercase tracking-wider font-normal text-gray-400 dark:text-gray-500 mb-1.5 px-1"
class="text-[0.625rem] uppercase tracking-wider font-normal text-gray-400 dark:text-gray-500 mb-1.5 px-1"
>
{$i18n.t('Output')}
</div>