Skip to content

Conversation

@kion
Copy link

@kion kion commented Nov 8, 2025

Summary

Adds user-configurable width controls to improve screen space utilization in Magazine and List views.

Why: the List view side pane and the Magazine view central pane (both containing the list of articles) were too narrow on my 4K 32" monitor screen - it was hard to read and there was way too much wasted screen estate, so I thought it'd be great to be able to resize / set width for these panels. After implementing this tweak, it became much more convenient to use List/Magazine view modes.

fluent-reader-adjustable-width-controls-1 fluent-reader-adjustable-width-controls-2

Changes

  • Magazine view: Added width dropdown (50%-95%) in View menu, visible only when Magazine view is active. Content is centered at all width settings.
  • List view: Added draggable resize handle for the article list panel (300px - 50% of window width). Content pane temporarily hidden during resize for smooth performance.
  • Both settings persist across application restarts via electron-store.

Technical Details

  • Magazine width applied via inline styles to ensure proper centering
  • List panel width uses direct DOM manipulation during drag, only persisting to Redux/electron-store on mouse up
  • Default values:
    • Magazine view width 70%
    • List panel width 350px

Testing

  • Verified width persistence after app restart
  • Tested resize performance with and without selected items
  • Confirmed centering works at all Magazine width percentages

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