[gnome-shell-sass] polkitAgent: Implement new design for polkit dialog

[Florian Müllner <fmuellner src gnome org>]

commit 3748d33f4e4434e4d8b6829c4fad9c469e456506
Author: Jonas Dreßler <verdre v0yd nl>
Date:   Mon Jan 20 14:55:24 2020 +0100

    polkitAgent: Implement new design for polkit dialog
    
    Implement the new design for the polkit according to the mockups in
    https://gitlab.gnome.org/GNOME/gnome-shell/issues/1343:
    
    - Center-align all the parts of the dialog
    - Use a larger user avatar
    - Remove the work-spinner because requests usually finish fast enough
    - Show the entry-labels as hint text of the entry
    
    https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/942

 widgets/_dialogs.scss | 43 +++++++++++++++++++------------------------
 widgets/_misc.scss    |  2 +-
 2 files changed, 20 insertions(+), 25 deletions(-)
---
diff --git a/widgets/_dialogs.scss b/widgets/_dialogs.scss
index 4664b67..48f8b0b 100644
--- a/widgets/_dialogs.scss
+++ b/widgets/_dialogs.scss
@@ -84,27 +84,30 @@
 /* Password or Authentication Dialog */
 
 .prompt-dialog {
-  //this is the width of the entire modal popup
-  width: 34em;
+  width: 28em;
 
-  .message-dialog-content { spacing: $base_spacing * 4; }
-  .message-dialog-title { color: lighten($fg_color,15%); }
+  .modal-dialog-content-box {
+    margin-bottom: 24px;
+  }
 }
 
 .prompt-dialog-description:rtl {
   text-align: right;
 }
 
-.prompt-dialog-password-box {
-  spacing: 1em;
-  padding-bottom: 1em;
+.prompt-dialog-password-layout {
+  spacing: 8px;
+}
+
+.prompt-dialog-password-entry {
+  width: 20em;
 }
 
 .prompt-dialog-error-label,
 .prompt-dialog-info-label,
 .prompt-dialog-null-label {
+  text-align: center;
   @include fontsize($base_font_size - 1);
-  padding-bottom: 8px;
 }
 
 .prompt-dialog-error-label {
@@ -120,23 +123,15 @@
 /* Polkit Dialog */
 
 .polkit-dialog-user-layout {
-  padding-left: 10px;
-  spacing: 10px;
-  &:rtl {
-    padding-left: 0px;
-    padding-right: 10px;
-  }
-}
+  text-align: center;
+  spacing: 8px;
+  margin-bottom: 6px;
 
-.polkit-dialog-user-root-label {
-  color: $warning_color;
-}
-
-.polkit-dialog-user-icon {
-  border-radius: 99px;
-  background-size: contain;
-  width: 48px;
-  height: 48px;
+  .polkit-dialog-user-icon {
+    border-radius: 99px;
+    background-size: contain;
+  }
+  .polkit-dialog-user-root-label { color: $warning_color; }
 }
 
 /* Audio selection dialog */
diff --git a/widgets/_misc.scss b/widgets/_misc.scss
index f05436d..296632b 100644
--- a/widgets/_misc.scss
+++ b/widgets/_misc.scss
@@ -60,8 +60,8 @@
 
 // Caps-lock warning
 .caps-lock-warning-label {
+  text-align: center;
   padding-bottom: 8px;
-  padding-left: 6.2em;
   @include fontsize($base_font_size - 1);
   color: $warning_color;
 }