feat: Enhance template picker size and layout depending on aspect ratio

Signed-off-by: Julius Härtl <jus@bitgrid.net>

Author: juliusknorr

apps/files/src/views/TemplatePicker.vue

@@ -24,7 +24,7 @@
 	<NcModal v-if="opened"
 		:clear-view-delay="-1"
 		class="templates-picker"
-		size="normal"
+		size="large"
 		@close="close">
 		<form class="templates-picker__form"
 			:style="style"
@@ -75,7 +75,6 @@ import TemplatePreview from '../components/TemplatePreview.vue'
 
 const border = 2
 const margin = 8
-const width = margin * 20
 
 export default {
 	name: 'TemplatePicker',
@@ -136,6 +135,11 @@ export default {
 		 * @return {object}
 		 */
 		style() {
+			// Fallback to 16:9 landscape ratio
+			const ratio = this.provider.ratio ? this.provider.ratio : 1.77
+			// Landscape templates should be wider than tall ones
+			// We fit 3 templates per row at max for landscape and 4 for portrait
+			const width = ratio > 1 ? margin * 30 : margin * 20
 			return {
 				'--margin': margin + 'px',
 				'--width': width + 'px',