Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Do not set height classes in ModalDialog when size is 'custom' #1443

Merged
merged 1 commit into from
Jan 31, 2024

Conversation

acelaya
Copy link
Contributor

@acelaya acelaya commented Jan 31, 2024

Part of hypothesis/client#6151 and hypothesis/client#6158

Depends on #1442

All ModalDialog instances have currently these hardcoded classes:

  • max-w-[90vw] max-h-[90vh] -> Ensure they don't span more than 90% of the viewport's width and height.
  • tall:fixed tall:max-h-[80vh] tall:top-[10vh] -> When the screen is tall ((min-height: 32rem)), ensure a fixed position of the modal.

This usually makes sense, as these play nicely with the regular sizes. However, when providing custom size, the classes which affect vertical size and positioning can get in the way and force you to override them with other classes including the important modifier (!).

This PR changes that behavior to make those classes be skipped when size is custom, so that consumer code has more control over how it behaves.

This is technically speaking a breaking change, but we are currently not using custom size modals in downstream projects.

The main motivation for this change is being able to use ModalDialog for the client's notebook, and benefit from its accessibility afordances.

@acelaya acelaya requested a review from robertknight January 31, 2024 14:59
Base automatically changed from custom-modal-dialog to main January 31, 2024 15:12
@acelaya acelaya force-pushed the custom-size-modals branch from ee3c016 to 1e3f910 Compare January 31, 2024 15:13
Copy link

codecov bot commented Jan 31, 2024

Codecov Report

All modified and coverable lines are covered by tests ✅

Comparison is base (97130ff) 100.00% compared to head (1e3f910) 100.00%.

Additional details and impacted files
@@            Coverage Diff            @@
##              main     #1443   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           60        60           
  Lines          934       936    +2     
  Branches       351       353    +2     
=========================================
+ Hits           934       936    +2     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@acelaya acelaya merged commit 18e70c9 into main Jan 31, 2024
4 checks passed
@acelaya acelaya deleted the custom-size-modals branch January 31, 2024 15:22
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
No open projects
Development

Successfully merging this pull request may close these issues.

2 participants