Fix minor alignment jank
This commit is contained in:
@@ -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>
|
||||||
|
|||||||
Reference in New Issue
Block a user