nextcloud-libraries / nextcloud-vue

🍱 Vue.js components for Nextcloud app development ✌ https://npmjs.org/@nextcloud/vue
https://nextcloud-vue-components.netlify.app/
Other
215 stars 85 forks source link

Date picker z-index troubles with modal #2097

Open PVince81 opened 3 years ago

PVince81 commented 3 years ago

When using the date picker within a modal, the popup is rendered to the body and its z-index is too low to be visible.

Observed in Talk: https://github.com/nextcloud/spreed/issues/5980

Workaround was to increase the z-index from 2000 to 10000

raimund-schluessler commented 3 years ago

I am not sure, this is a valid issue of nextcloud-vue. You explicitly append the datepicker to body in https://github.com/nextcloud/spreed/pull/4990 (it's appended to the containing element by default). When the datepicker is appended to the body, I think it is the responsibility of the app dev to make sure the picker is visible and nothing overlaps, since it is unknown which z-index would be the correct one. E.g. who says 10000 would be enough, maybe there is an element in the app with 10001 which then again overlaps?