From 1512b0ede332e0fc5a35e1a36a290f33dde87dca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marcos=20Pe=C3=B1a?= <devilcius@gmail.com>
Date: Thu, 11 Nov 2021 08:54:59 +0000
Subject: [PATCH] Resolve "Don't show Delete account window if the user has not
 enetered a password"

---
 changes/changelog.d/1591.bugfix         |  1 +
 front/src/components/auth/Settings.vue  |  2 +-
 front/src/style/components/_button.scss | 10 +++++++++-
 3 files changed, 11 insertions(+), 2 deletions(-)
 create mode 100644 changes/changelog.d/1591.bugfix

diff --git a/changes/changelog.d/1591.bugfix b/changes/changelog.d/1591.bugfix
new file mode 100644
index 000000000..7945af2b8
--- /dev/null
+++ b/changes/changelog.d/1591.bugfix
@@ -0,0 +1 @@
+Fixed delete account button is not disalbed when missing password (#1591)
diff --git a/front/src/components/auth/Settings.vue b/front/src/components/auth/Settings.vue
index eea38d208..bbd4ec8c2 100644
--- a/front/src/components/auth/Settings.vue
+++ b/front/src/components/auth/Settings.vue
@@ -328,7 +328,7 @@
             <password-input field-id="current-password-field" required v-model="password" />
           </div>
           <dangerous-button
-            :class="['ui', {'loading': isDeletingAccount}, {disabled: !password}, 'danger', 'button']"
+            :class="['ui', {'loading': isDeletingAccount}, {disabled: !password}, {danger: password}, 'button']"
             :action="deleteAccount">
             <translate translate-context="*/*/Button.Label">Delete my account…</translate>
             <p slot="modal-header"><translate translate-context="Popup/Settings/Title">Do you want to delete your account?</translate></p>
diff --git a/front/src/style/components/_button.scss b/front/src/style/components/_button.scss
index 7cb685336..afb8b4e8c 100644
--- a/front/src/style/components/_button.scss
+++ b/front/src/style/components/_button.scss
@@ -92,10 +92,18 @@ button.reset {
   margin-right: 0;
 }
 
-
 .ui.inverted.buttons .button:hover,
 .ui.inverted.button:hover,
 .ui.inverted.buttons .button:focus,
 .ui.inverted.button:focus {
   color: white;
 }
+
+.ui.button:disabled, .ui.buttons .disabled.button:not(.basic), .ui.disabled.active.button, .ui.disabled.button, .ui.disabled.button:hover {
+  cursor: default;
+  opacity: .45 !important;
+  background-image: none;
+  -webkit-box-shadow: none;
+  box-shadow: none;
+  pointer-events: none !important;
+}