diff --git a/src/app.css b/src/app.css index 16c1def..34d0321 100644 --- a/src/app.css +++ b/src/app.css @@ -97,7 +97,7 @@ input::placeholder { @apply hover:px-4; - @apply flex items-center justify-between gap-2 w-full truncate; + @apply flex items-center gap-2 w-full truncate; } .close-button { diff --git a/src/lib/components/BrowserWindow.svelte b/src/lib/components/BrowserWindow.svelte index 2107966..52af1ce 100644 --- a/src/lib/components/BrowserWindow.svelte +++ b/src/lib/components/BrowserWindow.svelte @@ -4,24 +4,39 @@ import Renderer from "./DaletlRenderer/Renderer.svelte"; import { isLoading, state } from "$lib/stores"; import type { VigiState } from "$lib/types"; + import GooLoadSpin from "$lib/icons/GooLoadSpin.svelte"; + import { slide } from "svelte/transition"; let loading = false; let data: Root; + let tabId = 0; state.subscribe((st) => { data = (st as VigiState).current_data; + + if (!loading) { + tabId = (st as VigiState).current_tab_index; + } }); isLoading.subscribe((val) => { loading = val; + + if (loading) { + tabId = -1; + } }); - {#if loading} -
Loading...
- {:else} +
+ {#if loading} +
+ +
+ {/if} + - {/if} +
diff --git a/src/lib/components/Sidebar.svelte b/src/lib/components/Sidebar.svelte index 861fcd8..42f3b53 100644 --- a/src/lib/components/Sidebar.svelte +++ b/src/lib/components/Sidebar.svelte @@ -1,6 +1,4 @@
removeTab(id)}> removeTab(id)} > + + {/if}
diff --git a/src/lib/icons/GooLoad.svelte b/src/lib/icons/GooLoad.svelte new file mode 100644 index 0000000..bb7fb6b --- /dev/null +++ b/src/lib/icons/GooLoad.svelte @@ -0,0 +1,57 @@ + + + + + + + + + + + + + + + + + + + diff --git a/src/lib/icons/GooLoadSpin.svelte b/src/lib/icons/GooLoadSpin.svelte new file mode 100644 index 0000000..aafd46e --- /dev/null +++ b/src/lib/icons/GooLoadSpin.svelte @@ -0,0 +1,48 @@ + + + + + + + + + + + + + + + + + +