Modals in the Vue components (ERM, Preservation at least) are not displayed nicely. From bug 37733 comment 0 """ 2. "Add to waiting list" modal is not centered http://localhost:8081/cgi-bin/koha/preservation/waiting-list https://snipboard.io/mIBYkj.jpg 3. Confirmation box "Are you sure you want to remove this item" is not centered correctly https://snipboard.io/ZgJFGC.jpg """
Created attachment 170956 [details] [review] Bug 37812: Try to fix modal in the Preservation module We certainly need more as ERM module also use modals. And the Dialog component seems to have more elements affected.
I also started converting some from dialog to actual modal in Bug 37605 - Why do the vue apps use 'dialog' in place of modals?
Created attachment 171252 [details] [review] Bug 37812: Adjust modals from the Preservation module - bootstrap5
Created attachment 171253 [details] [review] Bug 37812: Adjust Dialog.vue component
This is how we should fix it IMO. However there are still quite a lot of work to do. https://snipboard.io/TJ9zek.jpg => OK https://snipboard.io/MQHoCt.jpg => Dropdown list's options are hidden behind the modal's footer https://snipboard.io/5ru41B.jpg => Could be better styled Do we want to go with toasts? (it's not introduced in Koha yet so I don't know if it's a good idea). There are also some "close"/"x" buttons that does not close/hide the modal. However the code is similar with other places where it is working... ? For discussion, please help!
And I forgot this one: https://snipboard.io/rY90KF.jpg
This must be part of 24.11. At least the preservation module is unusable.