hippoz/waffle
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

move "connecting..." indicator to the sidebar to prevent layout shifts

Browse source
This commit is contained in:
hippoz 2022-08-05 05:24:45 +03:00
parent 9540bc6178
commit f87077d381
No known key found for this signature in database
GPG key ID: 7C52899193467641
2 changed files with 8 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
frontend/src/components/Main.svelte
View file

@ -44,13 +44,6 @@
<OverlayProvider /> <OverlayProvider />
{#if !$gatewayStatus.ready}
<div class="top-bar darker">
<CloudIcon />
<span class="h5 top-bar-heading">connecting...</span>
</div>
{/if}
<div class="flex-container"> <div class="flex-container">
{#if $showSidebar || $selectedChannel.id === -1} {#if $showSidebar || $selectedChannel.id === -1}
<Sidebar /> <Sidebar />

10
frontend/src/components/Sidebar.svelte
View file

@ -1,8 +1,8 @@
<script> <script>
import { HashIcon, PlusIcon, MoreVerticalIcon, SettingsIcon } from "svelte-feather-icons"; import { HashIcon, PlusIcon, MoreVerticalIcon, SettingsIcon, CloudIcon } from "svelte-feather-icons";
import { quadInOut } from "svelte/easing"; import { quadInOut } from "svelte/easing";
import { maybeFly } from "../animations"; import { maybeFly } from "../animations";
import { channels, overlayStore, selectedChannel, showChannelView, showSidebar, smallViewport, userInfoStore } from "../stores"; import { channels, gatewayStatus, overlayStore, selectedChannel, showChannelView, showSidebar, smallViewport, userInfoStore } from "../stores";
import UserTopBar from "./UserTopBar.svelte"; import UserTopBar from "./UserTopBar.svelte";
let pendingSelectChannel = null; let pendingSelectChannel = null;
@ -64,6 +64,12 @@
<span>Settings</span> <span>Settings</span>
</button> </button>
</div> </div>
{#if !$gatewayStatus.ready}
<div class="top-bar darker">
<CloudIcon />
<span class="h5 top-bar-heading">connecting...</span>
</div>
{/if}
</div> </div>
<style> <style>