update styles of log in

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>

2 files changed, 27 insertions, 13 deletions

diff --git a/core/css/styles.css b/core/css/styles.css
index ae1459af9d4..d7b7a6d0b9b 100644
--- a/core/css/styles.css
+++ b/core/css/styles.css
@@ -398,7 +398,6 @@ label.infield {
 	position: relative;
 	margin: 0;
 	padding: 14px;
-	padding-left: 28px;
 	vertical-align: middle;
 	-webkit-user-select: none;
 	-moz-user-select: none;
@@ -420,6 +419,8 @@ label.infield {
 
 #body-login #remember_login:hover+label,
 #body-login #remember_login:focus+label,
+#body-login #forgot-password:hover,
+#body-login #forgot-password:focus,
 #body-login p.info a:hover,
 #body-login p.info a:focus  {
 	opacity: .6;
@@ -596,7 +597,6 @@ label.infield {
 #body-login input.login {
 	width: 269px;
 	background-position: right 16px center;
-	border-radius: 50px;
 }
 #body-login input[type="submit"] {
 	padding: 10px 20px; /* larger log in and installation buttons */
@@ -605,9 +605,15 @@ label.infield {
 	margin: 18px 5px 0 16px !important;
 }
 #body-login .remember-login-container {
+	display: inline-block;
 	margin: 10px 0;
 	text-align: center;
 }
+#body-login #forgot-password {
+	padding: 11px;
+	float: right;
+	color: #fff;
+}
 
 /* Sticky footer */
 #body-login .wrapper {
diff --git a/core/templates/login.php b/core/templates/login.php
index b6b42d3b65b..de9c1701cef 100644
--- a/core/templates/login.php
+++ b/core/templates/login.php
@@ -43,7 +43,7 @@ script('core', [
 				placeholder="<?php p($l->t('Username or email')); ?>"
 				value="<?php p($_['loginName']); ?>"
 				<?php p($_['user_autofocus'] ? 'autofocus' : ''); ?>
-				autocomplete="on" autocapitalize="off" autocorrect="off" required tabindex="1">
+				autocomplete="on" autocapitalize="off" autocorrect="off" required>
 			<label for="user" class="infield"><?php p($l->t('Username or email')); ?></label>
 		</p>
 
@@ -51,7 +51,7 @@ script('core', [
 			<input type="password" name="password" id="password" value=""
 				placeholder="<?php p($l->t('Password')); ?>"
 				<?php p($_['user_autofocus'] ? '' : 'autofocus'); ?>
-				autocomplete="on" autocapitalize="off" autocorrect="off" required tabindex="2">
+				autocomplete="on" autocapitalize="off" autocorrect="off" required>
 			<label for="password" class="infield"><?php p($l->t('Password')); ?></label>
 		</p>
 
@@ -65,18 +65,26 @@ script('core', [
 			</p>
 		<?php } ?>
 
-		<input type="submit" id="submit" class="login primary icon-confirm-white" title="" value="<?php p($l->t('Log in')); ?>" disabled="disabled" tabindex="4" />
+		<input type="submit" id="submit" class="login primary icon-confirm-white" title="" value="<?php p($l->t('Log in')); ?>" disabled="disabled" />
 
-		<?php if ($_['rememberLoginAllowed'] === true) : ?>
-		<div class="remember-login-container">
-			<?php if ($_['rememberLoginState'] === 0) { ?>
-			<input type="checkbox" name="remember_login" value="1" id="remember_login" class="checkbox checkbox--white" tabindex="3">
-			<?php } else { ?>
-			<input type="checkbox" name="remember_login" value="1" id="remember_login" class="checkbox checkbox--white" checked="checked" tabindex="3">
+		<div class="login-additional">
+			<?php if ($_['rememberLoginAllowed'] === true) : ?>
+			<div class="remember-login-container">
+				<?php if ($_['rememberLoginState'] === 0) { ?>
+				<input type="checkbox" name="remember_login" value="1" id="remember_login" class="checkbox checkbox--white">
+				<?php } else { ?>
+				<input type="checkbox" name="remember_login" value="1" id="remember_login" class="checkbox checkbox--white" checked="checked">
+				<?php } ?>
+				<label for="remember_login"><?php p($l->t('Stay logged in')); ?></label>
+			</div>
+			<?php endif; ?>
+
+			<?php if(!empty($_['canResetPassword'])) { ?>
+			<a id="forgot-password" href="<?php p($_['resetPasswordLink']); ?>">
+				<?php p($l->t('Forgot password?')); ?>
+			</a>
 			<?php } ?>
-			<label for="remember_login"><?php p($l->t('Stay logged in')); ?></label>
 		</div>
-		<?php endif; ?>
 
 		<input type="hidden" name="timezone-offset" id="timezone-offset"/>
 		<input type="hidden" name="timezone" id="timezone"/>