[stable24] Fix modal heights

src/components/EditorWrapper.vue

@@ -632,7 +632,6 @@ export default {
 		max-width: 100%;
 		height: 100%;
 		left: 0;
-		top: 50px;
 		margin: 0 auto;
 		position: relative;
 		background-color: var(--color-main-background);

src/components/HelpModal.vue

@@ -1,5 +1,5 @@
 <template>
-	<Modal size="large"
+	<Modal size="normal"
 		:title="t('text', 'Formatting help')"
 		@close="$emit('close')">
 		<h2>{{ t('text', 'Formatting help') }}</h2>
@@ -204,26 +204,15 @@ export default {
 
 <style lang="scss" scoped>
 	::v-deep .modal-wrapper {
-		// TODO: can be removed once migrated to @nextcloud-vue >= 5.0
-		.prev, .next {
-			display: none !important;
-		}
-
 		.modal-container {
-			// TODO: can be removed once migrated to @nextcloud-vue >= 5.0
-			overflow: auto;
-			// Diverge from upstream modal styling
 			padding: 30px 40px 20px;
 			user-select: text;
 		}
 
-		// TODO: can be removed once migrated to @nextcloud-vue >= 5.0
-		// Make modal full screen on mobile
+		// Remove padding-right on mobile, screen might not be wide enough
 		@media only screen and (max-width: 512px) {
 			.modal-container {
-				position: absolute;
-				top: var(--header-height);
-				height: calc(100% - var(--header-height));
+				padding: 30px 0px 20px 40px;
 			}
 		}
 	}

src/components/ViewerComponent.vue

@@ -69,9 +69,15 @@ export default {
 	},
 }
 </script>
-<style>
+<style lang="scss">
 #editor-container {
-	height: calc(100% - 50px);
-	top: 50px;
+	top: var(--header-height);
+}
+
+@media only screen and (max-width: 512px) {
+	// on mobile, modal-container has top: 50px
+	#editor-container {
+		top: auto;
+	}
 }
 </style>