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

refac: styling

Browse Source
This commit is contained in:
Timothy Jaeryang Baek 2025-01-12 11:44:43 -08:00
parent 5b1eb61ae2
commit 6d6b84d43c
1 changed files with 46 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
src/render/lib/components/Main.svelte
View File

@ -6,7 +6,6 @@
import ArrowRightCircle from './icons/ArrowRightCircle.svelte';
let installing = false;
const continueHandler = async () => {
if (window?.electronAPI) {
window.electronAPI.installPackage();
@ -21,11 +20,15 @@
<div class="flex-1 w-full flex justify-center relative">
<div class="m-auto">
<Spinner className="size-5" />
<img
src="./assets/images/splash.png"
class="size-18 rounded-full dark:invert"
alt="logo"
/>
</div>
</div>
</div>
{:else if $installStatus === false}
{:else}
<div class="flex flex-row w-full h-full relative dark:text-gray-100">
<div class="absolute top-0 left-0 w-full h-7 bg-transparent draggable"></div>
@ -33,7 +36,6 @@
<div class="flex space-x-2">
<div class=" self-center">
<img
crossorigin="anonymous"
src="./assets/images/splash.png"
class=" w-6 rounded-full dark:invert"
alt="logo"
@ -54,43 +56,53 @@
<div class="w-full h-full absolute top-0 left-0 backdrop-blur-sm bg-black/50"></div>
<div class="flex-1 w-full flex justify-center relative">
<div class="m-auto flex flex-col justify-center text-center max-w-md">
<div class=" font-medium text-5xl text-center mb-4 font-secondary">Open WebUI</div>
{#if $installStatus === false}
<div class="m-auto flex flex-col justify-center text-center max-w-md">
<div class=" font-medium text-5xl text-center mb-4 font-secondary">
Open WebUI
</div>
<div class=" text-sm text-center mb-3">To install Open WebUI, click Continue.</div>
</div>
<div class=" text-sm text-center mb-3">
To install Open WebUI, click Continue.
</div>
</div>
<div class="absolute bottom-0 pb-10">
<div class="flex justify-center mt-8">
<div class="flex flex-col justify-center items-center">
<button
class="relative z-20 flex p-1 rounded-full bg-white/5 hover:bg-white/10 transition font-medium text-sm cursor-pointer"
on:click={() => {
continueHandler();
}}
>
<ArrowRightCircle className="size-6" />
</button>
<div class="mt-1.5 font-primary text-base font-medium">
{`Continue`}
<div class="absolute bottom-0 pb-10">
<div class="flex justify-center mt-8">
<div class="flex flex-col justify-center items-center">
{#if installing}
<div class="flex flex-col gap-3">
<Spinner className="size-5" />
<div class=" font-secondary">Installing...</div>
</div>
{:else}
<button
class="relative z-20 flex p-1 rounded-full bg-white/5 hover:bg-white/10 transition font-medium text-sm cursor-pointer"
on:click={() => {
continueHandler();
}}
>
<ArrowRightCircle className="size-6" />
</button>
<div class="mt-1.5 font-primary text-base font-medium">
{`Continue`}
</div>
{/if}
</div>
</div>
</div>
</div>
</div>
</div>
{:else}
<div class="flex flex-row w-full h-full relative dark:text-gray-100">
<div class="absolute top-0 left-0 w-full h-7 bg-transparent draggable"></div>
{:else if $installStatus === true}
<div class="flex-1 w-full flex justify-center relative">
<div class="m-auto">
<div class="flex flex-col gap-3">
<Spinner className="size-5" />
<div class="flex-1 w-full flex justify-center relative">
<div class="m-auto">
<div class="flex flex-col gap-3">
<Spinner className="size-5" />
<div class=" font-secondary">Launching Open WebUI...</div>
<div class=" font-secondary">Launching Open WebUI...</div>
</div>
</div>
</div>
</div>
{/if}
</div>
</div>
{/if}