Move 'show password' widget on Login UI (#18661)

* Move 'show password' widget on Login UI

* Update translations

* Lint it!

Author: nlhkabu

warehouse/locale/messages.pot

@@ -1140,7 +1140,7 @@ msgid "Sponsors"
 msgstr ""
 
 #: warehouse/templates/accounts/login.html:7
-#: warehouse/templates/accounts/login.html:80 warehouse/templates/base.html:44
+#: warehouse/templates/accounts/login.html:87 warehouse/templates/base.html:44
 #: warehouse/templates/base.html:78
 msgid "Log in"
 msgstr ""
@@ -1603,18 +1603,18 @@ msgstr ""
 msgid "(required)"
 msgstr ""
 
-#: warehouse/templates/accounts/login.html:62
+#: warehouse/templates/accounts/login.html:69
 #: warehouse/templates/re-auth.html:55
 msgid "Your password"
 msgstr ""
 
-#: warehouse/templates/accounts/login.html:88
+#: warehouse/templates/accounts/login.html:66
 #: warehouse/templates/manage/manage_base.html:457
 #: warehouse/templates/re-auth.html:82
 msgid "Show password"
 msgstr ""
 
-#: warehouse/templates/accounts/login.html:92
+#: warehouse/templates/accounts/login.html:91
 #: warehouse/templates/re-auth.html:86
 msgid "Forgot password?"
 msgstr ""

warehouse/templates/accounts/login.html

@@ -51,13 +51,20 @@ <h1 class="page-title">{% trans title=title %}Log in to {{ title }}{% endtrans %
           </div>
         </div>
         <div data-controller="password" class="form-group">
-          <div>
+          <div class="split-layout">
             <label for="password" class="form-group__label">
               {% trans %}Password{% endtrans %}
               {% if form.password.flags.required %}
                 <span class="form-group__required">{% trans %}(required){% endtrans %}</span>
               {% endif %}
             </label>
+            <label for="show-password">
+              <input data-action="change->password#togglePasswords"
+                     data-password-target="showPassword"
+                     id="show-password"
+                     type="checkbox">
+              &nbsp;{% trans %}Show password{% endtrans %}
+            </label>
           </div>
           {{ form.password(placeholder=gettext("Your password") ,
           required="required",
@@ -80,17 +87,10 @@ <h1 class="page-title">{% trans title=title %}Log in to {{ title }}{% endtrans %
                        value="{% trans %}Log in{% endtrans %}"
                        class="button button--primary">
               </div>
-              <label for="show-password">
-                <input data-action="change->password#togglePasswords"
-                       data-password-target="showPassword"
-                       id="show-password"
-                       type="checkbox">
-                &nbsp;{% trans %}Show password{% endtrans %}
-              </label>
+              <span>
+                <a href="{{ request.route_url('accounts.request-password-reset') }}">{% trans %}Forgot password?{% endtrans %}</a>
+              </span>
             </div>
-            <span>
-              <a href="{{ request.route_url('accounts.request-password-reset') }}">{% trans %}Forgot password?{% endtrans %}</a>
-            </span>
           </div>
         </div>
       </form>