Skip to content

Conversation

@maxtara
Copy link
Collaborator

@maxtara maxtara commented Feb 12, 2026

Problem

The settings modal had two issues:

  1. Content was not scrollable when it exceeded the modal height
  2. On small windows, the modal could get clipped at the top/bottom edges

Changes

Modal.tsx:

  • Added max-h-[90vh] to limit modal to 90% of viewport height
  • Added lex flex-col to make modal a flex container for proper child layout
  • Added my-4 for vertical margin to prevent edge clipping

SettingsModal.tsx:

  • Changed container to use lex-1 overflow-hidden instead of fixed max-height
  • Content area already has overflow-y-auto for scrolling

Result

  • Settings content now scrolls properly when needed
  • Modal never clips at viewport edges
  • Works correctly on any window size

Testing

  • ✅ Build passes
  • ✅ All unit tests pass (395/395)
  • ✅ Manually tested with small window - no clipping
  • ✅ Manually tested with long content - scrolls properly

Before:
image

After:
image

- Add overflow-y-auto to settings content area to enable scrolling
- Add max-h-[90vh] and my-4 to Modal component to prevent clipping
- Make Modal a flex container for proper height distribution
- Fixes issue where settings content was not scrollable on small windows
@maxtara maxtara marked this pull request as ready for review February 12, 2026 10:28
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