Some checks failed
Validate / Hassfest (push) Has been cancelled
Backend: Fix CORS wildcard+credentials, add secret key warning, remove raw API keys from sync endpoint, fix N+1 queries in watcher/sync, fix AttributeError on event_types, delete dead scheduled.py/templates.py, add limit cap on history, re-validate server on URL/key update, apply tracking/template config IDs in update_target. HA Integration: Replace datetime.now() with dt_util.now(), fix notification queue to only remove successfully sent items, use album UUID for entity unique IDs, add shared links dirty flag and users cache hourly refresh, deduplicate _is_quiet_hours, add HTTP timeouts, cache albums in config flow, change iot_class to local_polling. Frontend: Make i18n reactive via $state (remove window.location.reload), add Modal transitions/a11y/Escape key, create ConfirmModal replacing all confirm() calls, add error handling to all pages, replace Unicode nav icons with MDI SVGs, add card hover effects, dashboard stat icons, global focus-visible styles, form slide transitions, mobile responsive bottom nav, fix password error color, add ~20 i18n keys (EN/RU). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
55 lines
1.5 KiB
Svelte
55 lines
1.5 KiB
Svelte
<script lang="ts">
|
|
import { fade, fly } from 'svelte/transition';
|
|
|
|
let { open = false, title = '', onclose, children } = $props<{
|
|
open: boolean;
|
|
title?: string;
|
|
onclose: () => void;
|
|
children: import('svelte').Snippet;
|
|
}>();
|
|
|
|
function handleKeydown(e: KeyboardEvent) {
|
|
if (e.key === 'Escape') onclose();
|
|
}
|
|
</script>
|
|
|
|
<svelte:window onkeydown={open ? handleKeydown : undefined} />
|
|
|
|
{#if open}
|
|
<div
|
|
role="presentation"
|
|
class="fixed inset-0 z-[9999] flex items-center justify-center"
|
|
transition:fade={{ duration: 150 }}
|
|
>
|
|
<!-- Backdrop -->
|
|
<div
|
|
class="absolute inset-0 bg-black/50"
|
|
onclick={onclose}
|
|
role="presentation"
|
|
></div>
|
|
|
|
<!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
|
|
<!-- Panel -->
|
|
<div
|
|
role="dialog"
|
|
aria-modal="true"
|
|
aria-label={title}
|
|
tabindex="-1"
|
|
class="relative bg-[var(--color-card)] border border-[var(--color-border)] rounded-lg shadow-xl w-full max-w-md mx-4 p-5"
|
|
onclick={(e) => e.stopPropagation()}
|
|
onkeydown={(e) => { if (e.key === 'Escape') onclose(); }}
|
|
transition:fly={{ y: -20, duration: 200 }}
|
|
>
|
|
<div class="flex items-center justify-between mb-4">
|
|
<h3 class="text-lg font-semibold">{title}</h3>
|
|
<button onclick={onclose}
|
|
class="text-[var(--color-muted-foreground)] hover:text-[var(--color-foreground)] text-xl leading-none cursor-pointer bg-transparent border-none p-1 transition-colors"
|
|
aria-label="Close">
|
|
×
|
|
</button>
|
|
</div>
|
|
{@render children()}
|
|
</div>
|
|
</div>
|
|
{/if}
|