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 23:25:00 -08:00
parent 7b69e0a6bb
commit 646270d4b1
2 changed files with 34 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/main.ts
View File

@ -177,7 +177,7 @@ if (!gotTheLock) {
} }
}, },
{ {
label: 'Reset', label: 'Uninstall',
click: () => { click: () => {
loadDefaultView(); loadDefaultView();
removePackage(); removePackage();

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

@ -1,5 +1,5 @@
<script lang="ts"> <script lang="ts">
import { onMount } from 'svelte'; import { onMount, tick } from 'svelte';
import { fly } from 'svelte/transition'; import { fly } from 'svelte/transition';
import { installStatus, serverStatus, serverStartedAt } from '../stores'; import { installStatus, serverStatus, serverStartedAt } from '../stores';
@ -9,6 +9,7 @@
import backgroundImage from '../assets/images/green.jpg'; import backgroundImage from '../assets/images/green.jpg';
let mounted = false;
let currentTime = Date.now(); let currentTime = Date.now();
let installing = false; let installing = false;
@ -20,6 +21,13 @@
}; };
onMount(() => { onMount(() => {
installStatus.subscribe(async (value) => {
if (value !== null) {
await tick();
mounted = true;
}
});
const interval = setInterval(() => { const interval = setInterval(() => {
currentTime = Date.now(); currentTime = Date.now();
}, 1000); // Update every second }, 1000); // Update every second
@ -74,15 +82,21 @@
<div class="flex-1 w-full flex justify-center relative"> <div class="flex-1 w-full flex justify-center relative">
{#if $installStatus === false} {#if $installStatus === false}
<div class="m-auto flex flex-col justify-center text-center max-w-md"> <div class="m-auto flex flex-col justify-center text-center max-w-md">
<div {#if mounted}
class=" font-medium text-5xl xl:text-7xl text-center mb-4 xl:mb-5 font-secondary" <div
> class=" font-medium text-5xl xl:text-7xl text-center mb-4 xl:mb-5 font-secondary"
Open WebUI in:fly={{ duration: 750, y: 20 }}
</div> >
Open WebUI
</div>
<div class=" text-sm xl:text-lg text-center mb-3"> <div
To install Open WebUI, click Continue. class=" text-sm xl:text-lg text-center mb-3"
</div> in:fly={{ delay: 250, duration: 750, y: 10 }}
>
To install Open WebUI, click Continue.
</div>
{/if}
</div> </div>
<div class="absolute bottom-0 pb-10"> <div class="absolute bottom-0 pb-10">
@ -92,26 +106,32 @@
<div class="flex flex-col gap-3 text-center"> <div class="flex flex-col gap-3 text-center">
<Spinner className="size-5" /> <Spinner className="size-5" />
<div class=" font-secondary xl:text-lg">Installing...</div> <div class=" font-secondary xl:text-lg -mt-0.5">
Installing...
</div>
<div <div
class=" font-default text-xs" class=" font-default text-xs"
in:fly={{ duration: 500, y: 10 }} in:fly={{ delay: 100, duration: 500, y: 10 }}
> >
This might take a few minutes, We’ll notify you when it’s This might take a few minutes, We’ll notify you when it’s
ready. ready.
</div> </div>
</div> </div>
{:else} {:else if mounted}
<button <button
class="relative z-20 flex p-1 rounded-full bg-white/5 hover:bg-white/10 transition font-medium text-sm cursor-pointer" 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={() => { on:click={() => {
continueHandler(); continueHandler();
}} }}
in:fly={{ delay: 500, duration: 750, y: 10 }}
> >
<ArrowRightCircle className="size-6" /> <ArrowRightCircle className="size-6" />
</button> </button>
<div class="mt-1.5 font-primary text-base font-medium"> <div
class="mt-1.5 font-primary text-base font-medium"
in:fly={{ delay: 500, duration: 750, y: 10 }}
>
{`Continue`} {`Continue`}
</div> </div>
{/if} {/if}