From c6c4b4f735bd4f4f94f02e380bbcb87caced2c8a Mon Sep 17 00:00:00 2001
From: Oliver Schramm <oliver.schramm97@gmail.com>
Date: Wed, 6 Nov 2024 17:10:31 +0100
Subject: [PATCH] Add padding and max width so they don't stick to right screen
 border

Also make them align
---
 src/components/Questions/QuestionDate.vue | 3 ++-
 src/components/Questions/QuestionFile.vue | 3 ++-
 src/views/Submit.vue                      | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/Questions/QuestionDate.vue b/src/components/Questions/QuestionDate.vue
index d45c4555c..ff8e4810a 100644
--- a/src/components/Questions/QuestionDate.vue
+++ b/src/components/Questions/QuestionDate.vue
@@ -129,7 +129,8 @@ export default {
 
 <style lang="scss" scoped>
 .mx-datepicker {
-	width: 300px;
+	width: 100%;
+	max-width: 300px;
 
 	&.disabled {
 		inset-inline-start: -12px;
diff --git a/src/components/Questions/QuestionFile.vue b/src/components/Questions/QuestionFile.vue
index 78087c932..d7926df63 100644
--- a/src/components/Questions/QuestionFile.vue
+++ b/src/components/Questions/QuestionFile.vue
@@ -435,7 +435,8 @@ export default {
 		padding-inline: calc(3 * var(--default-grid-baseline)) var(--focus-offset);
 		padding-block: var(--focus-offset);
 		height: var(--default-clickable-area);
-		width: 300px;
+		width: 100%;
+		max-width: 300px;
 
 		label {
 			color: var(--color-text-maxcontrast);
diff --git a/src/views/Submit.vue b/src/views/Submit.vue
index 3bd91bd0f..332fac4f1 100644
--- a/src/views/Submit.vue
+++ b/src/views/Submit.vue
@@ -808,7 +808,7 @@ export default {
 	form {
 		.question {
 			// Less padding needed as submit view does not have drag handles
-			padding-inline-start: var(--default-clickable-area);
+			padding-inline: var(--default-clickable-area);
 		}
 
 		.form-buttons {