initiative/specs/022-fixed-layout-bars/research.md

Research: Fixed Layout Bars

R-001: Layout Strategy — Flexbox vs Fixed Positioning

Decision: Use CSS flexbox with flex-shrink-0 on fixed bars and flex-1 overflow-y-auto on the scrollable middle section.

Rationale: The current layout already uses a flex column (flex flex-col) inside a h-screen container. Converting from a single scrollable page to a three-zone layout (fixed top, scrollable middle, fixed bottom) requires only removing overflow-y-auto from the root and adding it to the combatant list wrapper. This avoids position: fixed which would require manual offset calculations and could conflict with the existing StatBlockPanel fixed positioning.

Alternatives considered:

• position: sticky on top/bottom bars: Would require the scroll container to be the viewport, and sticky bottom is unreliable across browsers.
• position: fixed on both bars with padding offsets: More complex, requires measuring bar heights to offset content, and creates z-index/stacking context issues with the StatBlockPanel.

R-002: Autocomplete Dropdown Behavior

Decision: The ActionBar suggestion dropdown (already z-50, absolute, bottom-full) will render upward from the fixed bottom bar. Since the dropdown uses absolute positioning within the ActionBar's relative container, it will naturally overlay the scrollable combatant list above it.

Rationale: The dropdown already positions itself above the input with bottom-full. With the ActionBar fixed at the bottom, the dropdown will appear overlaying the combatant list, which is the expected behavior. The z-50 ensures it renders above combatant rows. No changes needed to the dropdown positioning.

Alternatives considered: Portal-based rendering — unnecessary complexity given current positioning already works.

R-003: "Initiative Tracker" Heading Placement

Decision: The heading scrolls away with the combatant list (placed inside the scrollable area) or is removed from the visible area. Per the spec assumption, only the turn navigation bar and add-creature bar need to be fixed.

Rationale: Keeping the heading fixed would consume additional vertical space on small viewports. The heading is not a frequently-needed control.

Alternatives considered: Including heading in the fixed top area — rejected to maximize combatant list space.

R-004: StatBlockPanel Interaction

Decision: No changes to StatBlockPanel. It uses fixed top-0 right-0 bottom-0 on desktop and renders as a sibling outside the main content wrapper. The main content area already uses max-w-2xl which leaves room for the 400px panel.

Rationale: StatBlockPanel is positioned independently of the main content flow and will not be affected by changing the inner layout from single-scroll to flex zones.