1
0
mirror of https://github.com/pocket-id/pocket-id.git synced 2026-02-14 18:47:30 +00:00

fix: explicitly cache images to prevent unexpected behavior

This commit is contained in:
Elias Schneider
2025-06-16 15:59:14 +02:00
parent 4ed312251e
commit 2e5d268798
17 changed files with 142 additions and 58 deletions

View File

@@ -1,6 +1,7 @@
<script lang="ts">
import { page } from '$app/state';
import { m } from '$lib/paraglide/messages';
import { cachedBackgroundImage } from '$lib/utils/cached-image-util';
import { cn } from '$lib/utils/style';
import type { Snippet } from 'svelte';
import { MediaQuery } from 'svelte/reactivity';
@@ -54,7 +55,7 @@
<!-- Background image with slide animation -->
<div class="{cn(animate && 'animate-slide-bg-container')} absolute top-0 right-0 bottom-0 z-0">
<img
src="/api/application-configuration/background-image"
src={cachedBackgroundImage.getUrl()}
class="h-screen rounded-l-[60px] object-cover {animate
? 'w-full'
: 'w-[calc(100vw-650px)]'}"
@@ -64,7 +65,7 @@
</div>
{:else}
<div
class="flex h-screen items-center justify-center bg-[url('/api/application-configuration/background-image')] bg-cover bg-center text-center"
class="flex h-screen items-center justify-center bg-[url('{cachedBackgroundImage.getUrl()}')] bg-cover bg-center text-center"
>
<Card.Root class="mx-3 w-full max-w-md" style={animate ? 'animation-delay: 200ms;' : ''}>
<Card.CardContent