diff --git a/website/client/components/settings/site.vue b/website/client/components/settings/site.vue
index d01dc6a76b..e00e359936 100644
--- a/website/client/components/settings/site.vue
+++ b/website/client/components/settings/site.vue
@@ -139,12 +139,11 @@
             .iconalert.iconalert-warning(v-else)
               div.align-middle
                 span {{ $t('usernameNotVerified') }}
-                button.btn.btn-secondary.btn-small.float-right(@click='changeUser("username", {username: user.auth.local.username})') {{ $t('confirmUsername') }}
             .form-group
-              input#changeUsername.form-control(type='text', :placeholder="$t('newUsername')", v-model='usernameUpdates.username', :class='{"is-invalid input-invalid": usernameInvalid}')
+              input#changeUsername.form-control(@blur='restoreEmptyUsername()',type='text', :placeholder="$t('newUsername')", v-model='usernameUpdates.username', :class='{"is-invalid input-invalid": usernameInvalid}')
               .input-error(v-for="issue in usernameIssues") {{ issue }}
               small.form-text.text-muted {{ $t('changeUsernameDisclaimer') }}
-            button.btn.btn-primary(type='submit', @click='changeUser("username", usernameUpdates)', :disabled='usernameCanSubmit') {{ $t('submit') }}
+            button.btn.btn-primary(type='submit', @click='changeUser("username", usernameUpdates)', :disabled='usernameCannotSubmit') {{ $t('saveAndConfirm') }}
           h5(v-if='user.auth.local.email') {{ $t('changeEmail') }}
           .form(v-if='user.auth.local.email', name='changeEmail', novalidate)
             .form-group
@@ -264,6 +263,7 @@ export default {
     this.usernameUpdates.username = this.user.auth.local.username || null;
     this.temporaryDisplayName = this.user.profile.name;
     this.emailUpdates.newEmail = this.user.auth.local.email || null;
+    this.localAuth.username = this.user.auth.local.username || null;
     hello.init({
       facebook: process.env.FACEBOOK_KEY, // eslint-disable-line no-process-env
       google: process.env.GOOGLE_CLIENT_ID, // eslint-disable-line no-process-env
@@ -320,7 +320,7 @@ export default {
       if (this.usernameUpdates.username.length <= 1) return false;
       return !this.usernameValid;
     },
-    usernameCanSubmit () {
+    usernameCannotSubmit () {
       if (this.usernameUpdates.username.length <= 1) return true;
       return !this.usernameValid;
     },
@@ -424,6 +424,7 @@ export default {
       await axios.put(`/api/v4/user/auth/update-${attribute}`, updates);
       if (attribute === 'username') {
         this.user.auth.local.username = updates[attribute];
+        this.localAuth.username = this.user.auth.local.username;
         this.user.flags.verifiedUsername = true;
       } else if (attribute === 'email') {
         this.user.auth.local.email = updates[attribute];
@@ -469,6 +470,11 @@ export default {
     addLocalAuth () {
       axios.post('/api/v4/user/auth/local/register', this.localAuth, 'addedLocalAuth');
     },
+    restoreEmptyUsername () {
+      if (this.usernameUpdates.username.length < 1) {
+        this.usernameUpdates.username = this.user.auth.local.username;
+      }
+    },
   },
 };
 </script>
diff --git a/website/common/locales/en/generic.json b/website/common/locales/en/generic.json
index ba3e948db1..202b0e0ba6 100644
--- a/website/common/locales/en/generic.json
+++ b/website/common/locales/en/generic.json
@@ -75,6 +75,7 @@
   "submit": "Submit",
   "close": "Close",
   "saveAndClose": "Save & Close",
+  "saveAndConfirm": "Save & Confirm",
   "cancel": "Cancel",
   "ok": "OK",
   "add": "Add",
diff --git a/website/common/locales/en/settings.json b/website/common/locales/en/settings.json
index e8e15d66f7..789294db6e 100644
--- a/website/common/locales/en/settings.json
+++ b/website/common/locales/en/settings.json
@@ -193,10 +193,10 @@
     "about": "About",
     "setUsernameNotificationTitle": "Confirm your username!",
     "setUsernameNotificationBody": "We will be transitioning login names to unique, public usernames soon. This username will be used for invitations, @mentions in chat, and messaging.",
-    "usernameIssueSlur": "Usernames may not contain inapporpriate language.",
+    "usernameIssueSlur": "Usernames may not contain inappropriate language.",
     "usernameIssueForbidden": "Usernames may not contain restricted words.",
     "usernameIssueLength": "Usernames must be between 1 and 20 characters.",
-    "usernameIssueInvalidCharacters": "Usernames can only contain letters, numbers and underscores.",
+    "usernameIssueInvalidCharacters": "Usernames can only contain letters a to z, numbers 0 to 9, hyphens, or underscores.",
     "currentUsername": "Current username:",
     "displaynameIssueLength": "Display Names must be between 1 and 30 characters.",
     "displaynameIssueSlur": "Display Names may not contain inappropriate language",