Fix minor alignment jank

This commit is contained in:
daylily
2026-01-13 18:04:58 -04:00
parent 63134df7d6
commit 13db361cb9
3 changed files with 11 additions and 9 deletions
+1 -1
View File
@@ -9,7 +9,7 @@ import Main from '$lib/layouts/Main.svelte'
<ModeWatcher /> <ModeWatcher />
<Toaster position="bottom-center" duration={2000} theme={mode.current} invert /> <Toaster position="bottom-center" duration={2000} theme={mode.current} invert />
<div class="max-w-7xl min-h-dvh m-auto p-6 stack gap-4"> <div class="max-w-7xl min-h-dvh m-auto p-6 lg:py-8 stack gap-4">
<Main /> <Main />
<Footer /> <Footer />
</div> </div>
@@ -41,11 +41,12 @@ $effect(() => {
<div class="grow"> <div class="grow">
<h2 class="font-semibold text-xl/8" id="connect-section-label">Connect to a device</h2> <h2 class="font-semibold text-xl/8" id="connect-section-label">Connect to a device</h2>
<div class="row gap-1 text-sm" aria-live="polite"> <div class="stack-h gap-1 text-sm" aria-live="polite">
{#if deviceCtx.device === null} {#if deviceCtx.device === null}
<IconPending aria-hidden /> Not connected to any device yet. Plug in your device to connect. <IconPending class="mt-0.5 shrink-0" aria-hidden /> Not connected to any device yet. Plug in your
device to connect.
{:else} {:else}
<MoreInfo> <MoreInfo class="mt-0.5 shrink-0">
{#snippet icon()} {#snippet icon()}
<IconCheckCircle aria-hidden /> <IconCheckCircle aria-hidden />
{/snippet} {/snippet}
@@ -15,14 +15,15 @@ let inProgress = $state(false)
<div class="grow"> <div class="grow">
<h2 class="font-semibold text-xl/8" id="write-section-label">Write pattern to device</h2> <h2 class="font-semibold text-xl/8" id="write-section-label">Write pattern to device</h2>
<div class="row gap-1 text-sm" aria-live="polite"> <div class="text-sm stack-h gap-1" aria-live="polite">
{#if imageCtx.image === null} {#if imageCtx.image === null}
<IconPending aria-hidden /> Select an image file in order to write it onto your device. <IconPending class="mt-0.5 shrink-0" aria-hidden /> Select an image file in order to write it
onto your device.
{:else if !inProgress} {:else if !inProgress}
<IconArrowUploadProgress aria-hidden /> Write the pattern onto your device if you have finished <IconArrowUploadProgress class="mt-0.5 shrink-0" aria-hidden /> Write the pattern onto your device
editing the image. if you have finished editing the image.
{:else} {:else}
<IconWarning aria-hidden /> Refresh in progress. Do not disconnect device. <IconWarning class="mt-0.5 shrink-0" aria-hidden /> Refresh in progress. Do not disconnect device.
{/if} {/if}
</div> </div>
</div> </div>