Compare commits

...

1 Commits

Author SHA1 Message Date
root
75cac363fc fix: chapter/voice modals in ListeningMode use fixed inset-0 with safe-area insets to fill full screen
All checks were successful
Release / Test backend (push) Successful in 45s
Release / Check ui (push) Successful in 1m41s
Release / Docker (push) Successful in 6m32s
Release / Gitea Release (push) Successful in 1m9s
2026-04-07 17:54:49 +05:00

View File

@@ -373,11 +373,11 @@
{#if showVoiceModal && voices.length > 0}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div
class="absolute inset-0 z-70 flex flex-col"
class="fixed inset-0 z-[80] flex flex-col"
style="background: var(--color-surface);"
>
<!-- Modal header -->
<div class="flex items-center gap-3 px-4 py-3 border-b border-(--color-border) shrink-0">
<div class="flex items-center gap-3 px-4 py-3 border-b border-(--color-border) shrink-0" style="padding-top: max(0.75rem, env(safe-area-inset-top));">
<button
type="button"
onclick={() => { stopSample(); showVoiceModal = false; voiceSearch = ''; }}
@@ -405,7 +405,7 @@
</div>
</div>
<!-- Voice list -->
<div class="flex-1 overflow-y-auto">
<div class="flex-1 overflow-y-auto overscroll-contain" style="padding-bottom: env(safe-area-inset-bottom);">
{#each ([['Kokoro', filteredKokoro], ['Pocket TTS', filteredPocket], ['CF AI', filteredCfai]] as [string, Voice[]][]) as [label, group]}
{#if group.length > 0}
<p class="text-[10px] font-semibold text-(--color-muted) uppercase tracking-wider px-4 py-2 sticky top-0 bg-(--color-surface) border-b border-(--color-border)/50">{label}</p>
@@ -454,8 +454,11 @@
<!-- Chapter modal (full-screen overlay) -->
{#if showChapterModal && audioStore.chapters.length > 0}
<!-- svelte-ignore a11y_no_static_element_interactions -->
<div class="absolute inset-0 z-70 flex flex-col" style="background: var(--color-surface);">
<div class="flex items-center gap-3 px-4 py-3 border-b border-(--color-border) shrink-0">
<div
class="fixed inset-0 z-[80] flex flex-col"
style="background: var(--color-surface);"
>
<div class="flex items-center gap-3 px-4 py-3 border-b border-(--color-border) shrink-0" style="padding-top: max(0.75rem, env(safe-area-inset-top));">
<button
type="button"
onclick={() => { showChapterModal = false; }}
@@ -481,7 +484,7 @@
/>
</div>
</div>
<div class="flex-1 overflow-y-auto">
<div class="flex-1 overflow-y-auto overscroll-contain" style="padding-bottom: env(safe-area-inset-bottom);">
{#each filteredChapters as ch (ch.number)}
<button
type="button"