From a0a39f83d3385c429c1badd69ce00a17ba59a0c8 Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Tue, 28 Apr 2020 14:50:35 +0200
Subject: [PATCH 1/7] Fix 'Add question' button overlapping navigation toggle

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
 src/views/Create.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/views/Create.vue b/src/views/Create.vue
index 12d6524..94e1251 100644
--- a/src/views/Create.vue
+++ b/src/views/Create.vue
@@ -429,6 +429,8 @@ export default {
 			align-items: center;
 			align-self: flex-start;
 			width: 44px;
+			// To not overlap navigation toggle
+			margin-left: 44px;
 			height: var(--top-bar-height);
 			// make sure this doesn't take any space and appear floating
 			margin-top: -44px;

From f57a18cad41d10b2dd6e9ff1d91ac3a0c70a5728 Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Tue, 28 Apr 2020 14:59:45 +0200
Subject: [PATCH 2/7] Improve vertical spacing

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
 src/components/Questions/Question.vue | 4 +---
 src/views/Create.vue                  | 5 +----
 2 files changed, 2 insertions(+), 7 deletions(-)

diff --git a/src/components/Questions/Question.vue b/src/components/Questions/Question.vue
index 59567b2..a79d367 100644
--- a/src/components/Questions/Question.vue
+++ b/src/components/Questions/Question.vue
@@ -162,7 +162,7 @@ export default {
 	align-items: stretch;
 	flex-direction: column;
 	justify-content: stretch;
-	margin-bottom: 22px;
+	margin: 80px 0;
 	padding-left: 44px;
 	user-select: none;
 	background-color: var(--color-main-background);
@@ -194,7 +194,6 @@ export default {
 	&__content {
 		flex: 1 1 100%;
 		max-width: 100%;
-		margin-bottom: 20px;
 		padding: 0;
 	}
 
@@ -204,7 +203,6 @@ export default {
 		flex: 1 1 100%;
 		justify-content: space-between;
 		width: auto;
-		margin-top: 20px;
 
 		// Using type to have a higher order than the input styling of server
 		&-title,
diff --git a/src/views/Create.vue b/src/views/Create.vue
index 94e1251..5c2e57c 100644
--- a/src/views/Create.vue
+++ b/src/views/Create.vue
@@ -384,13 +384,13 @@ export default {
 		#form-title,
 		#form-desc {
 			width: 100%;
-			margin: 16px 0; // aerate the header
 			padding: 0 16px;
 			border: none;
 		}
 		#form-title {
 			font-size: 2em;
 			font-weight: bold;
+			margin: 32px 0;
 			padding-left: 14px; // align with description (compensate font size diff)
 			overflow-x: hidden;
 			text-overflow: ellipsis;
@@ -399,7 +399,6 @@ export default {
 		#form-desc {
 			min-height: 60px;
 			max-height: 200px;
-			margin-top: 0;
 			resize: none;
 		}
 	}
@@ -432,8 +431,6 @@ export default {
 			// To not overlap navigation toggle
 			margin-left: 44px;
 			height: var(--top-bar-height);
-			// make sure this doesn't take any space and appear floating
-			margin-top: -44px;
 
 			.icon-add-white {
 				opacity: 1;

From e2f503e189b0e588668f42e5389fd3ff02724a5f Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Tue, 28 Apr 2020 15:13:02 +0200
Subject: [PATCH 3/7] Fix answer placeholder for long and short answer question

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
 src/components/Questions/Question.vue      | 2 +-
 src/components/Questions/QuestionLong.vue  | 2 +-
 src/components/Questions/QuestionShort.vue | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/Questions/Question.vue b/src/components/Questions/Question.vue
index a79d367..04272fd 100644
--- a/src/components/Questions/Question.vue
+++ b/src/components/Questions/Question.vue
@@ -36,7 +36,7 @@
 		<div class="question__header">
 			<input v-if="edit"
 				:placeholder="t('forms', 'Enter a title for this question')"
-				:aria-label="t('forms', 'The title of the question number {index}', {index})"
+				:aria-label="t('forms', 'Title of question number {index}', {index})"
 				:value="text"
 				class="question__header-title"
 				type="text"
diff --git a/src/components/Questions/QuestionLong.vue b/src/components/Questions/QuestionLong.vue
index 0c82860..2b9d9a3 100644
--- a/src/components/Questions/QuestionLong.vue
+++ b/src/components/Questions/QuestionLong.vue
@@ -31,7 +31,7 @@
 			<!-- TODO: properly choose max length -->
 			<textarea ref="textarea"
 				:aria-label="t('forms', 'A long answer for the question “{text}”', { text })"
-				:placeholder="t('forms', 'Long answer text')"
+				:placeholder="t('forms', 'People can enter a long answer')"
 				:required="true /* TODO: implement required option */"
 				:value="values[0]"
 				class="question__text"
diff --git a/src/components/Questions/QuestionShort.vue b/src/components/Questions/QuestionShort.vue
index e52e7c3..ce11c3c 100644
--- a/src/components/Questions/QuestionShort.vue
+++ b/src/components/Questions/QuestionShort.vue
@@ -31,7 +31,7 @@
 			<!-- TODO: properly choose max length -->
 			<input ref="input"
 				:aria-label="t('forms', 'A short answer for the question “{text}”', { text })"
-				:placeholder="t('forms', 'Short answer text')"
+				:placeholder="t('forms', 'People can enter a short answer')"
 				:required="true /* TODO: implement required option */"
 				:value="values[0]"
 				class="question__input"

From f68904c6196464f5fd8d9338ed713a278fe8d615 Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Tue, 28 Apr 2020 15:22:59 +0200
Subject: [PATCH 4/7] Remove max-height for description so it is always shown
 in full

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
 src/views/Create.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/views/Create.vue b/src/views/Create.vue
index 5c2e57c..7ecb43d 100644
--- a/src/views/Create.vue
+++ b/src/views/Create.vue
@@ -398,7 +398,6 @@ export default {
 		}
 		#form-desc {
 			min-height: 60px;
-			max-height: 200px;
 			resize: none;
 		}
 	}

From 62b9f0c959692ceb9cfb69e42ebe2a3eb030fe3b Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Tue, 28 Apr 2020 21:51:48 +0200
Subject: [PATCH 5/7] No need to show notification on successful delete

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
 src/components/AppNavigationForm.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/AppNavigationForm.vue b/src/components/AppNavigationForm.vue
index 4396ef3..1ede176 100644
--- a/src/components/AppNavigationForm.vue
+++ b/src/components/AppNavigationForm.vue
@@ -58,7 +58,7 @@
 
 <script>
 import { generateUrl } from '@nextcloud/router'
-import { showError, showSuccess } from '@nextcloud/dialogs'
+import { showError } from '@nextcloud/dialogs'
 import ActionButton from '@nextcloud/vue/dist/Components/ActionButton'
 import ActionLink from '@nextcloud/vue/dist/Components/ActionLink'
 import ActionRouter from '@nextcloud/vue/dist/Components/ActionRouter'
@@ -146,7 +146,6 @@ export default {
 			try {
 				await axios.delete(generateUrl('/apps/forms/api/v1/form/{id}', { id: this.form.id }))
 				this.$emit('delete', this.form.id)
-				showSuccess(t('forms', 'Deleted form “{title}”', { title: this.form.title }))
 			} catch (error) {
 				showError(t('forms', 'Error while deleting form “{title}”', { title: this.form.title }))
 				console.error(error.response)

From 0db9d183ca57a56a5aecd5c462978185744bf264 Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Wed, 29 Apr 2020 01:45:20 +0200
Subject: [PATCH 6/7] Make clear the heading is 'Form title'

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
 src/views/Create.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/views/Create.vue b/src/views/Create.vue
index 7ecb43d..79ca730 100644
--- a/src/views/Create.vue
+++ b/src/views/Create.vue
@@ -49,12 +49,12 @@
 
 		<!-- Forms title & description-->
 		<header>
-			<label class="hidden-visually" for="form-title">{{ t('forms', 'Title') }}</label>
+			<label class="hidden-visually" for="form-title">{{ t('forms', 'Form title') }}</label>
 			<input
 				id="form-title"
 				v-model="form.title"
 				:minlength="0"
-				:placeholder="t('forms', 'Title')"
+				:placeholder="t('forms', 'Form title')"
 				:required="true"
 				autofocus
 				type="text"
@@ -338,11 +338,11 @@ export default {
 		},
 
 		/**
-		 * Select the text in the input if it is still set to 'New form'
+		 * Select the text in the input if it is still set to 'Form title'
 		 * @param {Event} e the click event
 		 */
 		selectIfUnchanged(e) {
-			if (e.target && e.target.value === t('forms', 'New form')) {
+			if (e.target && e.target.value === t('forms', 'Form title')) {
 				e.target.select()
 			}
 		},

From ee65ef7d2d3ce3c679919e5326e8224468e04e3e Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <hey@jancborchardt.net>
Date: Wed, 29 Apr 2020 03:41:02 +0200
Subject: [PATCH 7/7] Design fixes for the submission view

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
---
 src/components/Questions/QuestionMultiple.vue |  2 ++
 src/views/Create.vue                          |  2 +-
 src/views/Submit.vue                          | 29 ++++++++++++++-----
 3 files changed, 25 insertions(+), 8 deletions(-)

diff --git a/src/components/Questions/QuestionMultiple.vue b/src/components/Questions/QuestionMultiple.vue
index 837115d..b6e80ad 100644
--- a/src/components/Questions/QuestionMultiple.vue
+++ b/src/components/Questions/QuestionMultiple.vue
@@ -284,6 +284,8 @@ export default {
 
 	.question__label {
 		flex: 1 1 100%;
+		// Overwrite guest page core styles
+		text-align: left !important;
 		&::before {
 			margin: 14px !important;
 		}
diff --git a/src/views/Create.vue b/src/views/Create.vue
index 79ca730..c1cc72f 100644
--- a/src/views/Create.vue
+++ b/src/views/Create.vue
@@ -392,7 +392,7 @@ export default {
 			font-weight: bold;
 			margin: 32px 0;
 			padding-left: 14px; // align with description (compensate font size diff)
-			overflow-x: hidden;
+			overflow: hidden;
 			text-overflow: ellipsis;
 			white-space: nowrap;
 		}
diff --git a/src/views/Submit.vue b/src/views/Submit.vue
index 7b81cef..0301e40 100644
--- a/src/views/Submit.vue
+++ b/src/views/Submit.vue
@@ -25,9 +25,9 @@
 		<AppContent>
 			<!-- Forms title & description-->
 			<header>
-				<h3 id="form-title">
+				<h2 id="form-title">
 					{{ form.title }}
-				</h3>
+				</h2>
 				<p v-if="!loading && !success" id="form-desc">
 					{{ form.description }}
 				</p>
@@ -59,7 +59,7 @@
 			</EmptyContent>
 
 			<EmptyContent v-else-if="success" icon="icon-checkmark">
-				{{ t('forms', 'Thank you for completing the survey!') }}
+				{{ t('forms', 'Thank you for completing the form!') }}
 			</EmptyContent>
 		</AppContent>
 	</Content>
@@ -153,6 +153,11 @@ export default {
 	align-items: center;
 	flex-direction: column;
 
+	// Force hide navigation toggle as there is no navigation
+	::v-deep #app-navigation-toggle {
+		display: none !important;
+	}
+
 	header,
 	form {
 		width: 100%;
@@ -163,18 +168,18 @@ export default {
 
 	// Title & description header
 	header {
-		margin: 44px;
+		margin-top: 44px;
 
 		#form-title,
 		#form-desc {
 			width: 100%;
-			margin: 16px 0; // aerate the header
 			padding: 0 16px;
 			border: none;
 		}
 		#form-title {
 			font-size: 2em;
 			font-weight: bold;
+			margin: 32px 0;
 			padding-left: 14px; // align with description (compensate font size diff)
 			overflow: hidden;
 			text-overflow: ellipsis;
@@ -182,16 +187,26 @@ export default {
 		}
 		#form-desc {
 			min-height: 60px;
-			max-height: 200px;
-			margin-top: 0;
 			resize: none;
 		}
 	}
 
 	form {
+		.question {
+			// Less padding needed as submit view does not have drag handles
+			padding-left: 16px;
+			::v-deep &__content {
+				// Left-align multiple choice and checkboxes with question text
+				// Only in submit view
+				// TODO: use variables
+				margin-left: -14px;
+			}
+		}
+
 		input[type=submit] {
 			align-self: flex-end;
 			margin: 5px;
+			margin-bottom: 160px;
 			padding: 10px 20px;
 		}
 	}