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 />
{#if !$gatewayStatus.ready}
<div class="top-bar darker">
<CloudIcon />
<span class="h5 top-bar-heading">connecting...</span>
</div>
{/if}
<div class="flex-container">
{#if $showSidebar || $selectedChannel.id === -1}
<Sidebar />

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

@ -1,8 +1,8 @@
<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 { 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";
let pendingSelectChannel = null;
@ -64,6 +64,12 @@
<span>Settings</span>
</button>
</div>
{#if !$gatewayStatus.ready}
<div class="top-bar darker">
<CloudIcon />
<span class="h5 top-bar-heading">connecting...</span>
</div>
{/if}
</div>
<style>