style(layout): add RefreshCw icon to offline/retry buttons, adjust error banner color

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
2026-04-01 09:33:26 -04:00
parent 63ec7f4cc2
commit 62e1115b05

View File

@@ -10,6 +10,9 @@ import { goto, invalidateAll } from '$app/navigation';
import '../app.css';
// *** Import other supporting libraries
import {
RefreshCw,
} from '@lucide/svelte';
// Highlight JS
import hljs from 'highlight.js/lib/core';
@@ -352,12 +355,14 @@ $effect(() => {
{#if browser && (is_offline || api_unreachable)}
<div
class="preset-filled-error-500 fixed top-0 right-0 left-0 z-100 flex items-center justify-center gap-4 p-4 text-center shadow-2xl print:hidden">
class="preset-filled-error-200-800 fixed top-0 right-0 left-0 z-100 flex items-center justify-center gap-4 p-4 text-center shadow-2xl print:hidden">
<span class="text-xl font-bold"
>{is_offline ? 'Offline' : api_error_msg}</span>
<button
class="btn btn-sm preset-tonal-surface"
onclick={() => window.location.reload()}>Retry</button>
onclick={() => window.location.reload()}>
<RefreshCw size="1em" class="opacity-60" /> Retry
</button>
</div>
{/if}
@@ -370,7 +375,9 @@ $effect(() => {
<div class="flex shrink-0 items-center gap-2">
<button
class="btn btn-sm preset-tonal-surface"
onclick={() => window.location.reload()}>Reload</button>
onclick={() => window.location.reload()}>
<RefreshCw size="1em" class="opacity-60" /> Reload
</button>
<button
class="btn btn-sm preset-outlined-surface"
onclick={() => {