Files
storkit/.storkit/specs/functional/UI_LAYOUT.md
Dave 9581e5d51a rename .story_kit directory to .storkit and update all references
Renames the config directory and updates 514 references across 42 Rust
source files, plus CLAUDE.md, .gitignore, Makefile, script/release,
and .mcp.json files. All 1205 tests pass.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-20 11:34:53 +00:00

1.4 KiB

Functional Spec: UI Layout

1. Global Structure

The application uses a fixed-layout strategy to maximize chat visibility.

+-------------------------------------------------------+
|  HEADER (Fixed Height, e.g., 50px)                    |
|  [Project: ~/foo/bar]  [Model: llama3]  [x] Tools     |
+-------------------------------------------------------+
|                                                       |
|  CHAT AREA (Flex Grow, Scrollable)                    |
|                                                       |
|  (User Message)                                       |
|  (Agent Message)                                      |
|                                                       |
+-------------------------------------------------------+
|  INPUT AREA (Fixed Height, Bottom)                    |
|  [ Input Field ........................... ] [Send]   |
+-------------------------------------------------------+

2. Components

  • Header: Contains global context (Project) and session config (Model/Tools).
    • Constraint: Must not scroll away.
  • ChatList: The scrollable container for messages.
  • InputBar: Pinned to the bottom.

3. Styling

  • Use Flexbox (flex-direction: column) on the main container.
  • Header: flex-shrink: 0.
  • ChatList: flex-grow: 1, overflow-y: auto.
  • InputBar: flex-shrink: 0.