Skip to content

[UX] Focus indicators — double border + dimmed inactive panes #14

@fissible

Description

@fissible

Summary

It is currently unclear what is focused, what keys apply, and how to move focus to another area. This affects every screen in the app.

Problems

  • Focused and unfocused panes look nearly identical
  • No visual affordance tells the user which pane owns keyboard input
  • Single border is used for all panes regardless of focus state
  • Default terminal white is used for focus highlight

Proposed rules (global)

Focused element (or nearest container)

  • Double-line border
  • Active theme color (bold or accent)

Everything else

  • Single border
  • Dimmed (\033[2m) or muted theme color
  • Never pure white as a default focus indicator

No-theme fallback: active = white/bold, inactive = dim/default

Scope

All focusable panes: Schema browser (Tables, DDL), Table view (Structure, Data, Query), Welcome screen list.

Implementation notes

  • SHELLFRAME_PANEL_FOCUSED is already passed to shellframe_panel_render — border style should change based on this flag ("double" focused, "single" unfocused)
  • Theme variables: add SHQL_THEME_PANEL_STYLE_FOCUSED (default "double") alongside existing SHQL_THEME_PANEL_STYLE
  • Dimming inactive content: render functions apply $SHELLFRAME_DIM / $SHELLFRAME_RESET around unfocused region content

Files

  • src/theme.sh — new focused/unfocused theme variables
  • src/screens/schema.sh, table.sh, query.sh, welcome.sh — use focused style in render

Effort

S (1–2h)

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions