fix(matrix-web): prevent chat input bar from being hidden behind PillNavigation

Replace padding-bottom on .main-content with a flex spacer element to
properly reserve space for the fixed PillNavigation, and remove redundant
lg:pb-20 from MessageInput.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-03-07 10:30:53 +01:00
parent b840a21af6
commit f784612f83
2 changed files with 9 additions and 2 deletions

View file

@ -505,7 +505,7 @@
}
</script>
<div class="p-3 pb-4 lg:pb-20 safe-area-bottom">
<div class="p-3 pb-4 safe-area-bottom">
<!-- Reply/Edit Preview -->
{#if replyTo || editMessage}
<div class="mb-2 flex items-center gap-2 rounded-xl bg-surface border border-border px-3 py-2">

View file

@ -339,6 +339,9 @@
<main class="main-content bg-background">
{@render children()}
</main>
<!-- Spacer for PillNavigation -->
<div class="pill-nav-spacer"></div>
</div>
{:else}
<!-- Unknown state - redirect to login -->
@ -359,6 +362,10 @@
flex: 1;
min-height: 0;
overflow: hidden;
padding-bottom: 80px;
}
.pill-nav-spacer {
flex-shrink: 0;
height: 80px;
}
</style>