fix(flowpilot): make action bar fixed to viewport bottom

Previous approach tried to fix the flex height chain, but it proved fragile
across grid → main → outlet → page transitions. New approach: action bar is
position:fixed at the bottom of the viewport, offset by sidebar width via
CSS variable --sidebar-w. Conversation area has pb-20 for clearance.

This works regardless of the height chain, email verification banner,
or any other variable-height elements above the session.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-20 06:00:11 +00:00
parent 09a42a943a
commit 9d202c67f2
3 changed files with 7 additions and 9 deletions

View File

@@ -53,10 +53,10 @@ export function FlowPilotActionBar({
return (
<>
{/* Bottom bar */}
{/* Bottom bar — fixed to viewport bottom, works regardless of height chain */}
<div
className="flex flex-col gap-2 sm:flex-row sm:items-center sm:gap-3 border-t px-3 py-3 sm:px-5"
style={{ borderColor: 'var(--glass-border)', background: 'rgba(16, 17, 20, 0.8)', backdropFilter: 'blur(12px)' }}
className="fixed bottom-0 right-0 z-40 flex flex-col gap-2 sm:flex-row sm:items-center sm:gap-3 border-t px-3 py-3 sm:px-5"
style={{ borderColor: 'var(--glass-border)', background: 'rgba(16, 17, 20, 0.95)', backdropFilter: 'blur(16px)', left: 'var(--sidebar-w, 0px)' }}
>
<div className="flex gap-2 sm:gap-3">
<button