Better error messages

4 files changed, 12 insertions, 6 deletions

diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.html b/client/src/app/account/account-settings/account-change-password/account-change-password.component.html
index c57e705f9..b0e3cada4 100644
--- a/client/src/app/account/account-settings/account-change-password/account-change-password.component.html
+++ b/client/src/app/account/account-settings/account-change-password/account-change-password.component.html
@@ -4,15 +4,15 @@
 
   <label for="new-password">Change password</label>
   <input
-    type="password" class="form-control" id="new-password" placeholder="Old password"
-    formControlName="new-password"
+    type="password" id="new-password" placeholder="New password"
+    formControlName="new-password" [ngClass]="{ 'input-error': formErrors['new-password'] }"
   >
-  <div *ngIf="formErrors['new-password']" class="alert alert-danger">
+  <div *ngIf="formErrors['new-password']" class="form-error">
     {{ formErrors['new-password'] }}
   </div>
 
   <input
-    type="password" id="new-confirmed-password" placeholder="New password"
+    type="password" id="new-confirmed-password" placeholder="Confirm new password"
     formControlName="new-confirmed-password"
   >
 
diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss b/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss
index 593355b70..75827abbf 100644
--- a/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss
+++ b/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss
@@ -1,9 +1,14 @@
 input[type=password] {
   @include peertube-input-text(340px);
   display: block;
-  margin-bottom: 10px;
+
+  &#new-confirmed-password {
+    margin-top: 15px;
+  }
 }
 
 input[type=submit] {
   @include peertube-button;
+  margin-top: 15px;
 }
+
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.html b/client/src/app/account/account-settings/account-details/account-details.component.html
index c3cf6b629..bc18b39b4 100644
--- a/client/src/app/account/account-settings/account-details/account-details.component.html
+++ b/client/src/app/account/account-settings/account-details/account-details.component.html
@@ -10,5 +10,5 @@
     {{ formErrors['displayNSFW'] }}
   </div>
 
-  <input type="submit" value="Update" [disabled]="!form.valid">
+  <input type="submit" value="Save" [disabled]="!form.valid">
 </form>
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.scss b/client/src/app/account/account-settings/account-details/account-details.component.scss
index b1810d4f9..687166d9e 100644
--- a/client/src/app/account/account-settings/account-details/account-details.component.scss
+++ b/client/src/app/account/account-settings/account-details/account-details.component.scss
@@ -8,4 +8,5 @@ input[type=submit] {
   @include peertube-button;
 
   display: block;
+  margin-top: 15px;
 }