[gnome-shell/uajain/adapt-user-avatar-part2: 7/16] authPrompt: Move cancel button, entry and spinner to a single row

[Umang Jain <uajain src gnome org>]

commit b5344a2c9009cf554b6acd67c2257ed3e1ed933d
Author: Umang Jain <mailumangjain gmail com>
Date:   Wed Jan 15 00:32:24 2020 +0530

    authPrompt: Move cancel button, entry and spinner to a single row
    
    https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/922

 .../gnome-shell-sass/widgets/_login-dialog.scss    |  7 +-
 js/gdm/authPrompt.js                               | 81 ++++++++++------------
 2 files changed, 43 insertions(+), 45 deletions(-)
---
diff --git a/data/theme/gnome-shell-sass/widgets/_login-dialog.scss 
b/data/theme/gnome-shell-sass/widgets/_login-dialog.scss
index 536f635bec..44556684a1 100644
--- a/data/theme/gnome-shell-sass/widgets/_login-dialog.scss
+++ b/data/theme/gnome-shell-sass/widgets/_login-dialog.scss
@@ -72,7 +72,7 @@
 
 .login-dialog-logo-bin { padding: 24px 0px; }
 .login-dialog-banner { color: darken($osd_fg_color,10%); }
-.login-dialog-button-box { spacing: 5px; }
+.login-dialog-button-box { width: 23em; spacing: 5px; }
 .login-dialog-message-warning { color: $warning_color; }
 .login-dialog-message-hint { padding-top: 0; padding-bottom: 20px; }
 .login-dialog-user-selection-box { padding: 100px 0px; }
@@ -141,6 +141,11 @@
   width: 23em;
 }
 
+.login-dialog-prompt-entry {
+  width: 17.89em;
+  height: 1.5em;
+}
+
 .login-dialog-prompt-label {
   color: darken($osd_fg_color, 20%);
   @include fontsize($base_font_size + 1);
diff --git a/js/gdm/authPrompt.js b/js/gdm/authPrompt.js
index 13458eee56..ec19e54d62 100644
--- a/js/gdm/authPrompt.js
+++ b/js/gdm/authPrompt.js
@@ -97,25 +97,7 @@ var AuthPrompt = GObject.registerClass({
 
         this.add_child(this._label);
 
-        let entryParams = {
-            style_class: 'login-dialog-prompt-entry',
-            can_focus: true,
-            x_expand: false,
-            y_expand: true,
-        };
-
-        this._entry = null;
-
-        this._textEntry = new St.Entry(entryParams);
-        ShellEntry.addContextMenu(this._textEntry, { actionMode: Shell.ActionMode.NONE });
-
-        this._passwordEntry = new St.PasswordEntry(entryParams);
-        ShellEntry.addContextMenu(this._passwordEntry, { actionMode: Shell.ActionMode.NONE });
-
-        this._entry = this._passwordEntry;
-        this.add_child(this._entry);
-
-        this._entry.grab_key_focus();
+        this._initEntryRow();
 
         this._capsLockWarningLabel = new ShellEntry.CapsLockWarning();
         this.add_child(this._capsLockWarningLabel);
@@ -130,26 +112,6 @@ var AuthPrompt = GObject.registerClass({
         this._message.clutter_text.line_wrap = true;
         this._message.clutter_text.ellipsize = Pango.EllipsizeMode.NONE;
         this.add_child(this._message);
-
-        this._buttonBox = new St.BoxLayout({
-            style_class: 'login-dialog-button-box',
-            vertical: false,
-            y_align: Clutter.ActorAlign.END,
-        });
-        this.add_child(this._buttonBox);
-
-        this._defaultButtonWell = new St.Widget({
-            layout_manager: new Clutter.BinLayout(),
-            x_align: Clutter.ActorAlign.END,
-            y_align: Clutter.ActorAlign.CENTER,
-        });
-
-        this._initButtons();
-
-        this._spinner = new Animation.Spinner(DEFAULT_BUTTON_WELL_ICON_SIZE);
-        this._spinner.opacity = 0;
-        this._spinner.show();
-        this._defaultButtonWell.add_child(this._spinner);
     }
 
     _onDestroy() {
@@ -163,21 +125,42 @@ var AuthPrompt = GObject.registerClass({
         return Clutter.EVENT_PROPAGATE;
     }
 
-    _initButtons() {
+    _initEntryRow() {
+        let mainBox = new St.BoxLayout({
+            style_class: 'login-dialog-button-box',
+            vertical: false,
+        });
+        this.add_child(mainBox);
+
         this.cancelButton = new St.Button({
             style_class: 'modal-dialog-button button',
             button_mask: St.ButtonMask.ONE | St.ButtonMask.THREE,
             reactive: true,
             can_focus: true,
             label: _("Cancel"),
-            x_expand: true,
             x_align: Clutter.ActorAlign.START,
-            y_align: Clutter.ActorAlign.END,
+            y_align: Clutter.ActorAlign.CENTER,
         });
         this.cancelButton.connect('clicked', () => this.cancel());
-        this._buttonBox.add_child(this.cancelButton);
+        mainBox.add_child(this.cancelButton);
+
+        let entryParams = {
+            style_class: 'login-dialog-prompt-entry',
+            can_focus: true,
+            x_expand: true,
+        };
 
-        this._buttonBox.add_child(this._defaultButtonWell);
+        this._entry = null;
+
+        this._textEntry = new St.Entry(entryParams);
+        ShellEntry.addContextMenu(this._textEntry, { actionMode: Shell.ActionMode.NONE });
+
+        this._passwordEntry = new St.PasswordEntry(entryParams);
+        ShellEntry.addContextMenu(this._passwordEntry, { actionMode: Shell.ActionMode.NONE });
+
+        this._entry = this._passwordEntry;
+        mainBox.add_child(this._entry);
+        this._entry.grab_key_focus();
 
         this._entry.clutter_text.connect('text-changed', () => {
             if (!this._userVerifier.hasPendingMessages)
@@ -188,6 +171,16 @@ var AuthPrompt = GObject.registerClass({
             if (this._entry.reactive)
                 this.emit('next');
         });
+
+        this._defaultButtonWell = new St.Widget({
+            layout_manager: new Clutter.BinLayout(),
+            x_align: Clutter.ActorAlign.END,
+            y_align: Clutter.ActorAlign.CENTER,
+        });
+        mainBox.add_child(this._defaultButtonWell);
+
+        this._spinner = new Animation.Spinner(DEFAULT_BUTTON_WELL_ICON_SIZE);
+        this._defaultButtonWell.add_child(this._spinner);
     }
 
     _updateEntry(secret) {