search

formaat-design / reshaped

Community repository for storing examples, reporting issues and tracking roadmap
https://reshaped.so
97 stars 3 forks source link

Enable fullscreen modal #251

Closed randalmaia closed 1 month ago

randalmaia commented 2 months ago

Is your feature request related to a problem? Please describe. Enable fullscreen modal

Describe the solution you'd like I would like a modal that is fullscreen.

Describe alternatives you've considered Today the max-width of modal is calc(100vw-padding) Enable the dev to set his padding or create a prop for fullsize modal. Enable to have the same modal not fullscreen in desktop but full screen on mobile.

Additional context

Screenshot 2024-05-03 at 14 49 21

blvdmitry commented 1 month ago

Hey, thanks for the request. It shouldn't be hard to add it so I've added it as a pre 3.0 feature to the roadmap

blvdmitry commented 1 month ago

Code changes for this request should be out now in 2.11.10. Documentation and design changes will follow in the v3 release, we've added the changes to the release prep checklist.

Meanwhile you can use it in React with <Modal position="full-screen">. Since position property is responsive, you can use object syntax for it too: position={{ s: 'full-screen', m: 'center' }}

https://github.com/formaat-design/reshaped/assets/887379/1b22ab1d-b6b6-4af1-a11e-9eb4d5776314