flowbite-vue icon indicating copy to clipboard operation
flowbite-vue copied to clipboard

Published 20 hours ago • verified publisher icon themesberg

feat: add positioning options to FwbModal

Open woodrunsdeep opened this issue 1 year ago • 2 comments

Currently FwbModal doesn't have position prop to control modal's placement on the screen. This PR adds this feature taking into consideration possible usage in RTL (Right-to-Left) mode.

  1. Modal's parent element is display: block and the position prop sets corresponding classes responsible for modal's alignment. Default position is center.
  2. There's a small fix of close button alignment in RTL mode - usage of logical property ms-auto instead of ml-auto.
  3. As was mentioned here on current implementation click outside (on top/under a modal specifically) doesn't close a modal. Fixed with this PR as well.

Closes: #279 #235

woodrunsdeep avatar Jun 22 '24 12:06 woodrunsdeep

Deploy Preview for sensational-seahorse-8635f8 ready!

Name Link
Latest commit ef68d30688addce1470e058e183b7a11ee68def1
Latest deploy log https://app.netlify.com/sites/sensational-seahorse-8635f8/deploys/6676dd670bbda100080b21f6
Deploy Preview https://deploy-preview-293--sensational-seahorse-8635f8.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] avatar Jun 22 '24 12:06 netlify[bot]

Although maybe I should have used Flowbite's implementation to be in line with the core lib:

  • Use flex on a parent and set alignment classes on a parent as well
  • Name prop placement

But I think we should keep logical prop value names (top-start, bottom-end, etc.) instead of Flowbite's top-left, bottom-right cause in RTL mode top-left will place a model to the top right corner.

@Sqrcz If my assumptions are correct please let me know and I'll do the rest.

woodrunsdeep avatar Jun 22 '24 13:06 woodrunsdeep

Thanks for the fix.

Any updates on a publish timeline? This would be a nice feature for a project right now. :) Or can I update the files manually, until a new version is ready?

Thanks!

fdeitelhoff avatar Jul 10 '24 18:07 fdeitelhoff

@Sqrcz @cogor

Hi. It's been a while since this PR was created. I would appreciate your feedback on it.

Thanks

woodrunsdeep avatar Jul 16 '24 07:07 woodrunsdeep

@Sqrcz @cogor

Hi. It's been a while since this PR was created. I would appreciate your feedback on it.

Thanks

Sorry, unfortunately I don't have much time for OS, but I'll do a review your PR ASAP

cogor avatar Jul 16 '24 08:07 cogor