From 34dc98af95d6853d00da934e67dd6c61946b367d Mon Sep 17 00:00:00 2001 From: hippoz <10706925-hippoz@users.noreply.gitlab.com> Date: Wed, 27 Apr 2022 22:03:51 +0300 Subject: [PATCH] frontend: add simple settings menu --- frontend/public/global.css | 21 +++++++ frontend/src/auth.js | 6 ++ frontend/src/components/Sidebar.svelte | 8 ++- .../overlays/OverlayProvider.svelte | 4 ++ .../src/components/overlays/Settings.svelte | 63 +++++++++++++++++++ frontend/src/gateway.js | 10 +++ frontend/src/stores.js | 6 +- 7 files changed, 116 insertions(+), 2 deletions(-) create mode 100644 frontend/src/components/overlays/Settings.svelte diff --git a/frontend/public/global.css b/frontend/public/global.css index b7474c4..68c8c8f 100644 --- a/frontend/public/global.css +++ b/frontend/public/global.css @@ -59,6 +59,15 @@ --radius-xxl: calc(5.25 * var(--sradius-unit)); } +.theme-light { + --foreground-color-1: hsl(180, 11%, 7%); + --foreground-color-2: hsl(180, 11%, 12%); + --foreground-color-3: hsl(180, 11%, 17%); + --background-color-1: rgb(253, 254, 255); + --background-color-2: rgb(218, 219, 220); + --background-color-3: rgb(153, 154, 155); +} + html, body { width: 100%; height: 100%; @@ -210,6 +219,18 @@ body { background-color: var(--purple-2); } +.button-red { + background-color: var(--red-2); +} + +.button-red:hover { + background-color: var(--red-1); +} + +.button-red:disabled { + background-color: var(--red-2); +} + .icon-button { display: flex; justify-content: center; diff --git a/frontend/src/auth.js b/frontend/src/auth.js index 2396204..0dfe85f 100644 --- a/frontend/src/auth.js +++ b/frontend/src/auth.js @@ -19,4 +19,10 @@ export function authWithToken(token, shouldUpdate=false) { gateway.init(token); } +export function logOut() { + setAuthToken(null); + gateway.close(); + gateway.dispatch(GatewayEventType.BadAuth, -1); +} + useAuthHandlers(); diff --git a/frontend/src/components/Sidebar.svelte b/frontend/src/components/Sidebar.svelte index f282425..3f7c63c 100644 --- a/frontend/src/components/Sidebar.svelte +++ b/frontend/src/components/Sidebar.svelte @@ -1,5 +1,5 @@ {#if $overlayStore.createChannel} @@ -26,3 +27,6 @@ {#if $overlayStore.editMessage} {/if} +{#if $overlayStore.settings} + +{/if} diff --git a/frontend/src/components/overlays/Settings.svelte b/frontend/src/components/overlays/Settings.svelte new file mode 100644 index 0000000..f44905d --- /dev/null +++ b/frontend/src/components/overlays/Settings.svelte @@ -0,0 +1,63 @@ + + + + +