From 0f9a21934bfee61345894a38e89d7228cf1c07f1 Mon Sep 17 00:00:00 2001 From: Owen Jacobson Date: Tue, 5 Nov 2024 19:02:23 -0500 Subject: File off some rough spots in the DOM. * We had an unused layer of divs in the main UI. * The
div was superfluous with the body-level div in app.html. * Some formatting changes in one component?? Weird. --- ui/app.html | 2 +- ui/lib/components/Message.svelte | 12 ++++++------ ui/routes/+layout.svelte | 42 ++++++++++++++-------------------------- 3 files changed, 22 insertions(+), 34 deletions(-) diff --git a/ui/app.html b/ui/app.html index 51a6780..10525fe 100644 --- a/ui/app.html +++ b/ui/app.html @@ -7,6 +7,6 @@ %sveltekit.head% -
%sveltekit.body%
+
%sveltekit.body%
diff --git a/ui/lib/components/Message.svelte b/ui/lib/components/Message.svelte index ea6e304..68c5c91 100644 --- a/ui/lib/components/Message.svelte +++ b/ui/lib/components/Message.svelte @@ -26,12 +26,12 @@ display: flex; } .message-body { - overflow: auto; - max-width: 80vw; - @media (width > 640px) { - /* 21rem is width of the nav bar in full-screen mode. */ - max-width: calc(90vw - 21rem); - } + overflow: auto; + max-width: 80vw; + @media (width > 640px) { + /* 21rem is width of the nav bar in full-screen mode. */ + max-width: calc(90vw - 21rem); + } } .message-body:empty:after { content: '.'; diff --git a/ui/routes/+layout.svelte b/ui/routes/+layout.svelte index d786389..30634e9 100644 --- a/ui/routes/+layout.svelte +++ b/ui/routes/+layout.svelte @@ -20,30 +20,18 @@ let { children } = $props(); -
-
- - - - - understory - - {#if $currentUser} - - {/if} - - -
- - {@render children?.()} -
- - + + + + + understory + + {#if $currentUser} + + {/if} + + + +{@render children?.()} -- cgit v1.2.3 From fc73108b07e61ab0159ada120f2fb60c430b1d4c Mon Sep 17 00:00:00 2001 From: Owen Jacobson Date: Tue, 5 Nov 2024 19:25:20 -0500 Subject: Move `showMenu` out of globals and into page state. I generally don't love globals, and the scope of this global is pretty narrow. Let's use the context hierarchy for this, instead. (Kit mentioned that it might be possible to use CSS variables for this.) --- ui/lib/store.js | 1 - ui/routes/(app)/+layout.svelte | 7 ++++--- ui/routes/+layout.svelte | 12 +++++++++--- 3 files changed, 13 insertions(+), 7 deletions(-) diff --git a/ui/lib/store.js b/ui/lib/store.js index bdd3e3b..ae17ffa 100644 --- a/ui/lib/store.js +++ b/ui/lib/store.js @@ -3,7 +3,6 @@ import { Channels } from '$lib/store/channels'; import { Messages } from '$lib/store/messages'; import { Logins } from '$lib/store/logins'; -export const showMenu = writable(false); export const currentUser = writable(null); export const logins = writable(new Logins()); export const channelsList = writable(new Channels()); diff --git a/ui/routes/(app)/+layout.svelte b/ui/routes/(app)/+layout.svelte index ae3dc6a..0a8c58d 100644 --- a/ui/routes/(app)/+layout.svelte +++ b/ui/routes/(app)/+layout.svelte @@ -1,16 +1,17 @@