fix: proper scroll containment — no body scroll, panel overflow-y with bind:this ref
This commit is contained in:
@@ -8,6 +8,7 @@
|
||||
let isSyncing = $state(false);
|
||||
let syncMessage = $state('');
|
||||
let theme = $state(localStorage.getItem('theme') || 'dark');
|
||||
let summaryPanel = $state(null);
|
||||
|
||||
function toggleTheme() {
|
||||
theme = theme === 'dark' ? 'light' : 'dark';
|
||||
@@ -59,10 +60,8 @@
|
||||
|
||||
$effect(() => { if (activeTab) loadVideos(); });
|
||||
$effect(() => {
|
||||
if (selectedVideo) {
|
||||
tick().then(() => {
|
||||
document.getElementById('summary-panel')?.scrollTo({ top: 0, behavior: 'instant' });
|
||||
});
|
||||
if (selectedVideo && summaryPanel) {
|
||||
tick().then(() => summaryPanel.scrollTop = 0);
|
||||
}
|
||||
});
|
||||
onMount(() => {
|
||||
@@ -114,7 +113,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div style="background:var(--bg-primary);color:var(--text-primary);min-height:100vh">
|
||||
<div style="background:var(--bg-primary);color:var(--text-primary);height:100vh;overflow:hidden;display:flex;flex-direction:column">
|
||||
<!-- Top bar -->
|
||||
<header style="background:var(--bg-secondary);border-bottom:1px solid var(--border);" class="flex items-center justify-between px-5 py-2.5">
|
||||
<div class="flex items-center space-x-3">
|
||||
@@ -135,7 +134,7 @@
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="flex" style="min-height:calc(100vh - 44px)">
|
||||
<div class="flex flex-1 overflow-hidden">
|
||||
<!-- Left: video list -->
|
||||
<aside style="width:280px;background:var(--bg-secondary);border-right:1px solid var(--border)" class="flex flex-col flex-shrink-0">
|
||||
<div class="flex p-1.5" style="border-bottom:1px solid var(--border)">
|
||||
@@ -167,7 +166,7 @@
|
||||
</aside>
|
||||
|
||||
<!-- Right: summary PRIMARY -->
|
||||
<main id="summary-panel" class="flex-1 overflow-y-auto" style="background:var(--bg-primary)">
|
||||
<main bind:this={summaryPanel} id="summary-panel" class="flex-1 overflow-y-auto" style="background:var(--bg-primary);min-height:0">
|
||||
{#if selectedVideo}
|
||||
<div class="p-6 max-w-3xl mx-auto space-y-4">
|
||||
<!-- ★ AI Digest -->
|
||||
|
||||
Reference in New Issue
Block a user