Consolidate mobile and desktop designs for login form

* Stop sign up button from being a button
* Move password reset to bottom of form

Bug: T85189
Change-Id: I175e9f515d962f9078845f25f9b96079819444c6

diff --git a/includes/templates/Userlogin.php b/includes/templates/Userlogin.php
index adf8947..69266c8 100644 (file)
--- a/includes/templates/Userlogin.php
+++ b/includes/templates/Userlogin.php
@@ -90,14 +90,6 @@ class UserloginTemplate extends BaseTemplate {
                                <label for='wpPassword1'>
                                        <?php
                                        $this->msg( 'userlogin-yourpassword' );
-
-                                       if ( $this->data['useemail'] && $this->data['canreset'] && $this->data['resetlink'] === true ) {
-                                               echo ' ' . Linker::link(
-                                                       SpecialPage::getTitleFor( 'PasswordReset' ),
-                                                       $this->getMsg( 'userlogin-resetpassword-link' )->parse(),
-                                                       array( 'class' => 'mw-ui-flush-right' )
-                                               );
-                                       }
                                        ?>
                                </label>
                                <?php
@@ -160,7 +152,7 @@ class UserloginTemplate extends BaseTemplate {
                                ?>
                        </div>
 
-                       <div class="mw-ui-vform-field" id="mw-userlogin-help">
+                       <div class="mw-ui-vform-field mw-form-related-link-container" id="mw-userlogin-help">
                                <?php
                                echo Html::element(
                                        'a',
@@ -173,14 +165,26 @@ class UserloginTemplate extends BaseTemplate {
                                );
                                ?>
                        </div>
-
-                       <?php if ( $this->haveData( 'createOrLoginHref' ) ) { ?>
-                               <?php if ( $this->data['loggedin'] ) { ?>
-                                       <div id="mw-createaccount-another">
-                                               <a href="<?php $this->text( 'createOrLoginHref' ); ?>" id="mw-createaccount-join" tabindex="7"  class="mw-ui-button"><?php $this->msg( 'userlogin-createanother' ); ?></a>
+                       <?php
+                       if ( $this->haveData( 'createOrLoginHref' ) ) {
+                               if ( $this->data['useemail'] && $this->data['canreset'] && $this->data['resetlink'] === true ) {
+                                       echo Html::openElement( 'div',
+                                                       array(
+                                                               'class' => 'mw-ui-vform-field mw-form-related-link-container',
+                                                       )
+                                               ) .
+                                               Linker::link(
+                                                       SpecialPage::getTitleFor( 'PasswordReset' ),
+                                                       $this->getMsg( 'userlogin-resetpassword-link' )->parse()
+                                               ) .
+                                               Html::closeElement( 'div' );
+                               }
+                               if ( $this->data['loggedin'] ) { ?>
+                                       <div id="mw-createaccount-another" class="mw-form-related-link-container mw-ui-vform-field">
+                                               <a href="<?php $this->text( 'createOrLoginHref' ); ?>" id="mw-createaccount-join" tabindex="7"><?php $this->msg( 'userlogin-createanother' ); ?></a>
                                        </div>
                                <?php } else { ?>
-                                       <div id="mw-createaccount-cta">
+                                       <div id="mw-createaccount-cta" class="mw-form-related-link-container mw-ui-vform-field">
                                                <?php $this->msg( 'userlogin-noaccount' ); ?><a href="<?php $this->text( 'createOrLoginHref' ); ?>" id="mw-createaccount-join" tabindex="7"  class="mw-ui-button mw-ui-progressive"><?php $this->msg( 'userlogin-joinproject' ); ?></a>
                                        </div>
                                <?php } ?>

diff --git a/resources/src/mediawiki.special/mediawiki.special.userlogin.common.css b/resources/src/mediawiki.special/mediawiki.special.userlogin.common.css
index 28b1446..30f000b 100644 (file)
--- a/resources/src/mediawiki.special/mediawiki.special.userlogin.common.css
+++ b/resources/src/mediawiki.special/mediawiki.special.userlogin.common.css
@@ -1,5 +1,5 @@
 /* Styles for user login and signup forms */
-#mw-userlogin-help {
+.mw-form-related-link-container {
        text-align: center;
 }
 

diff --git a/resources/src/mediawiki.special/mediawiki.special.userlogin.login.css b/resources/src/mediawiki.special/mediawiki.special.userlogin.login.css
index 64471b2..df3db57 100644 (file)
--- a/resources/src/mediawiki.special/mediawiki.special.userlogin.login.css
+++ b/resources/src/mediawiki.special/mediawiki.special.userlogin.login.css
@@ -7,16 +7,3 @@
        margin: 0 auto;
        padding-top: 4em;
 }
-
-#mw-createaccount-cta,
-#mw-createaccount-another {
-       font-size: 0.9em;
-       font-weight: normal;
-       text-align: center;
-}
-
-#mw-createaccount-join {
-       margin-left: 0.75em;
-       width: auto;
-       display: inline-block;
-}