refac: styling
Some checks are pending
Deploy to HuggingFace Spaces / check-secret (push) Waiting to run
Deploy to HuggingFace Spaces / deploy (push) Blocked by required conditions
Create and publish Docker images with specific build args / build-main-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Create and publish Docker images with specific build args / build-main-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Create and publish Docker images with specific build args / build-cuda-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Create and publish Docker images with specific build args / build-cuda-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Create and publish Docker images with specific build args / build-cuda126-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Create and publish Docker images with specific build args / build-cuda126-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Create and publish Docker images with specific build args / build-ollama-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Create and publish Docker images with specific build args / build-ollama-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Create and publish Docker images with specific build args / build-slim-image (linux/amd64, ubuntu-latest) (push) Waiting to run
Create and publish Docker images with specific build args / build-slim-image (linux/arm64, ubuntu-24.04-arm) (push) Waiting to run
Create and publish Docker images with specific build args / merge-main-images (push) Blocked by required conditions
Create and publish Docker images with specific build args / merge-cuda-images (push) Blocked by required conditions
Create and publish Docker images with specific build args / merge-cuda126-images (push) Blocked by required conditions
Create and publish Docker images with specific build args / merge-ollama-images (push) Blocked by required conditions
Create and publish Docker images with specific build args / merge-slim-images (push) Blocked by required conditions
Python CI / Format Backend (push) Waiting to run
Frontend Build / Format & Build Frontend (push) Waiting to run
Frontend Build / Frontend Unit Tests (push) Waiting to run

This commit is contained in:
Timothy Jaeryang Baek 2025-11-28 23:10:01 -05:00
parent ff121413da
commit 6c53bf7175

View file

@ -562,7 +562,7 @@
{#if !$mobile && !$showSidebar}
<div
class=" pt-[7px] pb-2 px-1.5 flex flex-col justify-between text-black dark:text-white hover:bg-gray-50/30 dark:hover:bg-gray-950/30 h-full z-10 transition-all border-e-[0.5px] border-gray-50 dark:border-gray-850"
class=" pt-[7px] pb-2 px-2 flex flex-col justify-between text-black dark:text-white hover:bg-gray-50/30 dark:hover:bg-gray-950/30 h-full z-10 transition-all border-e-[0.5px] border-gray-50 dark:border-gray-850"
id="sidebar"
>
<button
@ -703,7 +703,7 @@
<div>
<div>
<div class=" py-0.5">
<div class=" py-2 flex justify-center items-center">
{#if $user !== undefined && $user !== null}
<UserMenu
role={$user?.role}
@ -717,13 +717,26 @@
<div
class=" cursor-pointer flex rounded-xl hover:bg-gray-100 dark:hover:bg-gray-850 transition group"
>
<div class=" self-center flex items-center justify-center size-9">
<div class="self-center relative">
<img
src={`${WEBUI_API_BASE_URL}/users/${$user?.id}/profile/image`}
class=" size-6 object-cover rounded-full"
class=" size-7 object-cover rounded-full"
alt={$i18n.t('Open User Profile Menu')}
aria-label={$i18n.t('Open User Profile Menu')}
/>
<div class="absolute -bottom-0.5 -right-0.5">
<span class="relative flex size-2.5">
<span
class="absolute inline-flex h-full w-full animate-ping rounded-full bg-green-400 opacity-75"
></span>
<span
class="relative inline-flex size-2.5 rounded-full {true
? 'bg-green-500'
: 'bg-gray-300 dark:bg-gray-700'} border-2 border-white dark:border-gray-900"
></span>
</span>
</div>
</div>
</div>
</UserMenu>
@ -756,7 +769,7 @@
: 'invisible'}"
>
<div
class="sidebar px-2 pt-2 pb-1.5 flex justify-between space-x-1 text-gray-600 dark:text-gray-400 sticky top-0 z-10 -mb-3"
class="sidebar px-[0.5625rem] pt-2 pb-1.5 flex justify-between space-x-1 text-gray-600 dark:text-gray-400 sticky top-0 z-10 -mb-3"
>
<a
class="flex items-center rounded-xl size-8.5 h-full justify-center hover:bg-gray-100/50 dark:hover:bg-gray-850/50 transition no-drag-region"
@ -817,7 +830,7 @@
}}
>
<div class="pb-1.5">
<div class="px-1.5 flex justify-center text-gray-800 dark:text-gray-200">
<div class="px-[0.4375rem] flex justify-center text-gray-800 dark:text-gray-200">
<a
id="sidebar-new-chat-button"
class="group grow flex items-center space-x-3 rounded-2xl px-2.5 py-2 hover:bg-gray-100 dark:hover:bg-gray-900 transition outline-none"
@ -838,7 +851,7 @@
</a>
</div>
<div class="px-1.5 flex justify-center text-gray-800 dark:text-gray-200">
<div class="px-[0.4375rem] flex justify-center text-gray-800 dark:text-gray-200">
<button
id="sidebar-search-button"
class="group grow flex items-center space-x-3 rounded-2xl px-2.5 py-2 hover:bg-gray-100 dark:hover:bg-gray-900 transition outline-none"
@ -860,7 +873,7 @@
</div>
{#if ($config?.features?.enable_notes ?? false) && ($user?.role === 'admin' || ($user?.permissions?.features?.notes ?? true))}
<div class="px-1.5 flex justify-center text-gray-800 dark:text-gray-200">
<div class="px-[0.4375rem] flex justify-center text-gray-800 dark:text-gray-200">
<a
id="sidebar-notes-button"
class="grow flex items-center space-x-3 rounded-2xl px-2.5 py-2 hover:bg-gray-100 dark:hover:bg-gray-900 transition"
@ -881,7 +894,7 @@
{/if}
{#if $user?.role === 'admin' || $user?.permissions?.workspace?.models || $user?.permissions?.workspace?.knowledge || $user?.permissions?.workspace?.prompts || $user?.permissions?.workspace?.tools}
<div class="px-1.5 flex justify-center text-gray-800 dark:text-gray-200">
<div class="px-[0.4375rem] flex justify-center text-gray-800 dark:text-gray-200">
<a
id="sidebar-workspace-button"
class="grow flex items-center space-x-3 rounded-2xl px-2.5 py-2 hover:bg-gray-100 dark:hover:bg-gray-900 transition"
@ -1267,13 +1280,26 @@
<div
class=" flex items-center rounded-2xl py-2 px-1.5 w-full hover:bg-gray-100/50 dark:hover:bg-gray-900/50 transition"
>
<div class=" self-center mr-3">
<div class=" self-center mr-3 relative">
<img
src={`${WEBUI_API_BASE_URL}/users/${$user?.id}/profile/image`}
class=" size-6 object-cover rounded-full"
class=" size-7 object-cover rounded-full"
alt={$i18n.t('Open User Profile Menu')}
aria-label={$i18n.t('Open User Profile Menu')}
/>
<div class="absolute -bottom-0.5 -right-0.5">
<span class="relative flex size-2.5">
<span
class="absolute inline-flex h-full w-full animate-ping rounded-full bg-green-400 opacity-75"
></span>
<span
class="relative inline-flex size-2.5 rounded-full {true
? 'bg-green-500'
: 'bg-gray-300 dark:bg-gray-700'} border-2 border-white dark:border-gray-900"
></span>
</span>
</div>
</div>
<div class=" self-center font-medium">{$user?.name}</div>
</div>