Skip to content

Add pane swap control with persisted split layout preference#5

Open
jphavill wants to merge 1 commit into
Amoner:mainfrom
jphavill:split-view-swap-button
Open

Add pane swap control with persisted split layout preference#5
jphavill wants to merge 1 commit into
Amoner:mainfrom
jphavill:split-view-swap-button

Conversation

@jphavill

@jphavill jphavill commented Apr 21, 2026

Copy link
Copy Markdown

Summary

  • Add a small swap button () at the top of the split-pane divider to switch editor/preview sides.
  • Persist pane swap preference across restarts using the existing frontend localStorage settings pattern.
  • Keep divider drag-resize behavior correct after swapping by mapping ratio to the visible left/right panes.
  • Update README to document the new swap control.
Screenshot 2026-04-21 at 14 05 18

Why

I have dual vertical monitors and wanted to edit on the screen directly in front of me, while the preview was on the screen to my left. Other people may also prefer to edit on the right.

Implementation Notes

  • Added panesSwapped state in app state.
  • Loaded/saved inkwell-panes-swapped in settings.
  • Added swap button to divider UI.
  • Applied swapped pane ordering via CSS class on #app.
  • Updated divider drag width assignment logic for swapped mode.

Validation

  • npm run build passes successfully.

  • Manually verified:

    • swap toggles pane sides,
    • preference persists after restart,
    • drag resize behaves correctly in both swapped and default layouts.

Add a divider-top pane swap button and persist the swap preference in localStorage. Update split-pane drag behavior to stay intuitive when panes are swapped, and refresh docs to describe pane-agnostic split editing plus the new swap control.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant