From b3ab6e1b43f55eff52cc58189fa67422be1bb790 Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Wed, 14 Aug 2019 14:12:17 +0200
Subject: [PATCH] Suggestions implemented II

---
 .../Registration/CreateUserAccount.vue        | 156 ++++++++++--------
 webapp/locales/de.json                        |   4 +-
 webapp/locales/en.json                        |   4 +-
 3 files changed, 87 insertions(+), 77 deletions(-)

diff --git a/webapp/components/Registration/CreateUserAccount.vue b/webapp/components/Registration/CreateUserAccount.vue
index 37a1639d9..6cc1611cc 100644
--- a/webapp/components/Registration/CreateUserAccount.vue
+++ b/webapp/components/Registration/CreateUserAccount.vue
@@ -1,75 +1,83 @@
 <template>
-  <ds-card v-if="success" class="success">
-    <ds-space>
-      <sweetalert-icon icon="success" />
-      <ds-text align="center" bold color="success">
-        {{ $t('registration.create-user-account.success') }}
-      </ds-text>
-    </ds-space>
-  </ds-card>
-  <ds-form
-    v-else
-    class="create-user-account"
-    v-model="formData"
-    :schema="formSchema"
-    @submit="submit"
-  >
-    <template slot-scope="{ errors }">
-      <ds-card :header="$t('registration.create-user-account.title')">
-        <ds-input
-          id="name"
-          model="name"
-          icon="user"
-          :label="$t('settings.data.labelName')"
-          :placeholder="$t('settings.data.namePlaceholder')"
-        />
-        <ds-input
-          id="bio"
-          model="about"
-          type="textarea"
-          rows="3"
-          :label="$t('settings.data.labelBio')"
-          :placeholder="$t('settings.data.labelBio')"
-        />
-        <ds-input
-          id="password"
-          model="password"
-          type="password"
-          autocomplete="off"
-          :label="$t('settings.security.change-password.label-new-password')"
-        />
-        <ds-input
-          id="passwordConfirmation"
-          model="passwordConfirmation"
-          type="password"
-          autocomplete="off"
-          :label="$t('settings.security.change-password.label-new-password-confirm')"
-        />
-        <password-strength :password="formData.password" />
-        <ds-section>
+  <ds-container width="small">
+    <ds-card v-if="success" class="success">
+      <ds-space>
+        <sweetalert-icon icon="success" />
+        <ds-text align="center" bold color="success">
+          {{ $t('registration.create-user-account.success') }}
+        </ds-text>
+      </ds-space>
+    </ds-card>
+    <ds-form
+      v-else
+      class="create-user-account"
+      v-model="formData"
+      :schema="formSchema"
+      @submit="submit"
+    >
+      <template slot-scope="{ errors }">
+        <ds-card :header="$t('registration.create-user-account.title')">
+          <ds-input
+            id="name"
+            model="name"
+            icon="user"
+            :label="$t('settings.data.labelName')"
+            :placeholder="$t('settings.data.namePlaceholder')"
+          />
+          <ds-input
+            id="bio"
+            model="about"
+            type="textarea"
+            rows="3"
+            :label="$t('settings.data.labelBio')"
+            :placeholder="$t('settings.data.labelBio')"
+          />
+          <ds-input
+            id="password"
+            model="password"
+            type="password"
+            autocomplete="off"
+            :label="$t('settings.security.change-password.label-new-password')"
+          />
+          <ds-input
+            id="passwordConfirmation"
+            model="passwordConfirmation"
+            type="password"
+            autocomplete="off"
+            :label="$t('settings.security.change-password.label-new-password-confirm')"
+          />
+          <password-strength :password="formData.password" />
+
           <ds-text>
-            <input id="checkbox" type="checkbox" v-model="checkedDefault" @change="checked" />
-            <label for="checkbox" v-html="$t('site.termsAndConditionsCeckbox')"></label>
+            <input
+              id="checkbox"
+              type="checkbox"
+              v-model="checkedConfimed"
+              @change="checked"
+              :checked="checkedConfimed"
+            />
+            <label for="checkbox" v-html="$t('site.termsAndConditionsRead')"></label>
           </ds-text>
-        </ds-section>
-        <template slot="footer">
-          <ds-space class="backendErrors" v-if="backendErrors">
-            <ds-text align="center" bold color="danger">{{ backendErrors.message }}</ds-text>
-          </ds-space>
-          <ds-button
-            style="float: right;"
-            icon="check"
-            type="submit"
-            :loading="$apollo.loading"
-            :disabled="errors"
-            primary
-          >
-            {{ $t('actions.save') }}
-          </ds-button>
-        </template>
-      </ds-card>
-    </template>
-  </ds-form>
+
+          <template slot="footer">
+            <ds-space class="backendErrors" v-if="backendErrors">
+              <ds-text align="center" bold color="danger">{{ backendErrors.message }}</ds-text>
+            </ds-space>
+            <ds-button
+              style="float: right;"
+              icon="check"
+              type="submit"
+              :loading="$apollo.loading"
+              :disabled="errors"
+              primary
+            >
+              {{ $t('actions.save') }}
+            </ds-button>
+          </template>
+        </ds-card>
+      </template>
+    </ds-form>
+  </ds-container>
 </template>
 
 <script>
@@ -112,7 +120,7 @@ export default {
       disabled: true,
       success: null,
       backendErrors: null,
-      checkedDefault: false,
+      checkedConfimed: false,
     }
   },
   props: {
@@ -121,10 +129,12 @@ export default {
   },
   methods: {
     checked: function() {
-      this.backendErrors = { message: '' }
+      this.backendErrors = { message: null }
+      console.log('tzzzzzzzzzz')
+      this.disabled = true
     },
     async submit() {
-      if (this.checkedDefault) {
+      if (this.checkedConfimed) {
         const { name, password, about } = this.formData
         const { email, nonce } = this
         try {
@@ -143,7 +153,7 @@ export default {
           this.backendErrors = err
         }
       } else {
-        this.backendErrors = { message: this.$t(`site.termsAndConditionsNoChecked`) }
+        this.backendErrors = { message: this.$t(`site.confirmTermsAndConditions`) }
       }
     },
   },
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index d9b551477..52649aa7f 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -23,8 +23,8 @@
     "bank": "Bankverbindung",
     "germany": "Deutschland",
     "code-of-conduct": "Verhaltenscodex",
-    "termsAndConditionsCeckbox": "<a href=\"/terms-and-conditions\" target=\"_blank\">Nutzungsbedingungen</a> gelesen und verstanden",
-    "termsAndConditionsNoChecked": "Bitte lies und bestätige die Nutzungsbednigungen!"
+    "termsAndConditionsRead": "<a href=\"/terms-and-conditions\" target=\"_blank\">Nutzungsbedingungen</a> gelesen und verstanden",
+    "confirmTermsAndConditions": "Bitte lies und bestätige die Nutzungsbednigungen!"
   },
   "sorting": {
     "newest": "Neuste",
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index 1930be537..129e8204f 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -23,8 +23,8 @@
     "bank": "bank account",
     "germany": "Germany",
     "code-of-conduct": "Code of Conduct",
-    "termsAndConditionsCeckbox": "<a href=\"/terms-and-conditions\" target=\"_blank\">Terms and conditions</a> read and understood",
-    "termsAndConditionsNoChecked": "Please read and confirm the Terms and conditions!"
+    "termsAndConditionsRead": "<a href=\"/terms-and-conditions\" target=\"_blank\">Terms and conditions</a> read and understood",
+    "confirmTermsAndConditions": "Please read and confirm the Terms and conditions!"
   },
   "sorting": {
     "newest": "Newest",