diff --git a/changelog/unreleased/bugfix-oc-modal-scroll-small-screens b/changelog/unreleased/bugfix-oc-modal-scroll-small-screens new file mode 100644 index 00000000000..fd2e4c3314b --- /dev/null +++ b/changelog/unreleased/bugfix-oc-modal-scroll-small-screens @@ -0,0 +1,6 @@ +Bugfix: Vertical scroll for OcModal on small screens + +We've fixed an issue where modals were not scrollable on screens with small heights. + +https://github.com/owncloud/web/issues/10814 +https://github.com/owncloud/web/pull/10816 diff --git a/packages/design-system/src/components/OcModal/OcModal.vue b/packages/design-system/src/components/OcModal/OcModal.vue index c8cfaae15e9..58bce158972 100644 --- a/packages/design-system/src/components/OcModal/OcModal.vue +++ b/packages/design-system/src/components/OcModal/OcModal.vue @@ -434,12 +434,14 @@ export default defineComponent({ } .oc-modal { - max-width: 500px; - width: 100%; - box-shadow: 5px 0 25px rgba(0, 0, 0, 0.3); + background-color: var(--oc-color-background-default); border: 1px solid var(--oc-color-input-border); border-radius: 15px; - background-color: var(--oc-color-background-default); + box-shadow: 5px 0 25px rgba(0, 0, 0, 0.3); + max-height: 90vh; + max-width: 500px; + overflow: auto; + width: 100%; &:focus { outline: none;