bring back dedicated log in button to make log in more usabletags/v11.0RC2
@@ -147,7 +147,10 @@ img.icon-loading-small-dark, object.icon-loading-small-dark, video.icon-loading- | |||
} | |||
.icon-confirm { | |||
background-image: url('../img/actions/confirm.svg?v=1'); | |||
background-image: url('../img/actions/confirm.svg?v=2'); | |||
} | |||
.icon-confirm-white { | |||
background-image: url('../img/actions/confirm-white.svg?v=2'); | |||
} | |||
.icon-delete, |
@@ -286,32 +286,10 @@ body { | |||
margin: -13px; | |||
} | |||
/* position log in button as confirm icon in right of password field */ | |||
#body-login #submit.login { | |||
position: absolute; | |||
right: 0; | |||
top: 0; | |||
border: none; | |||
background-color: transparent; | |||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; | |||
opacity: .3; | |||
} | |||
#body-login #submit.login:hover, | |||
#body-login #submit.login:focus { | |||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; | |||
opacity: .7; | |||
} | |||
#body-login input[type="password"], | |||
#body-login input[name="adminpass-clone"] { | |||
padding-right: 40px; | |||
box-sizing: border-box; | |||
min-width: 269px; | |||
} | |||
#body-login form { | |||
position: relative; | |||
width: 280px; | |||
margin: 32px auto; | |||
margin: 16px auto; | |||
padding: 0; | |||
} | |||
#body-login form fieldset { | |||
@@ -420,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; | |||
@@ -442,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; | |||
@@ -617,8 +596,8 @@ label.infield { | |||
width: 249px; | |||
} | |||
#body-login input.login { | |||
width: auto; | |||
float: right; | |||
width: 269px; | |||
background-position: right 16px center; | |||
} | |||
#body-login input[type="submit"] { | |||
padding: 10px 20px; /* larger log in and installation buttons */ | |||
@@ -627,8 +606,15 @@ label.infield { | |||
margin: 18px 5px 0 16px !important; | |||
} | |||
#body-login .remember-login-container { | |||
margin-top: 10px; | |||
display: inline-block; | |||
margin: 10px 0; | |||
text-align: center; | |||
width: 100%; | |||
} | |||
#body-login #forgot-password { | |||
padding: 11px; | |||
float: right; | |||
color: #fff; | |||
} | |||
/* Sticky footer */ |
@@ -0,0 +1,4 @@ | |||
<?xml version="1.0" encoding="UTF-8" standalone="no"?> | |||
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" version="1.1"> | |||
<path d="m8.6328 0.63477c-0.2556 0-0.5112 0.0971-0.707 0.29296-0.3918 0.39177-0.3918 1.0224 0 1.4141l4.6582 4.6582h-11.584c-0.554 0-1 0.446-1 1s0.446 1 1 1h11.586l-4.6583 4.658c-0.3917 0.392-0.3917 1.023 0 1.414 0.3918 0.392 1.0224 0.392 1.4141 0l6.3632-6.363v-0.002h0.002c0.093-0.093 0.166-0.2041 0.217-0.3281l0.002-0.0019v-0.002c0.02-0.0508 0.019-0.1053 0.031-0.1582 0.016-0.0718 0.043-0.14 0.043-0.2168 0-0.0714-0.027-0.1341-0.041-0.2012-0.012-0.0578-0.012-0.1202-0.033-0.1738v-0.002c-0.001-0.0013-0.002-0.0026-0.002-0.0039-0.051-0.1233-0.124-0.2335-0.217-0.3261-0.001-0.0007-0.001-0.0013-0.002-0.002l-6.3632-6.3633c-0.1959-0.19583-0.4534-0.29293-0.709-0.29293z" fill-rule="evenodd" fill="#fff"/> | |||
</svg> |
@@ -1 +1,4 @@ | |||
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"><path d="M1 11V5h7V1l7 7-7 7v-4z"/></svg> | |||
<?xml version="1.0" encoding="UTF-8" standalone="no"?> | |||
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" version="1.1"> | |||
<path d="m8.6328 0.63477c-0.2556 0-0.5112 0.0971-0.707 0.29296-0.3918 0.39177-0.3918 1.0224 0 1.4141l4.6582 4.6582h-11.584c-0.554 0-1 0.446-1 1s0.446 1 1 1h11.586l-4.6583 4.658c-0.3917 0.392-0.3917 1.023 0 1.414 0.3918 0.392 1.0224 0.392 1.4141 0l6.3632-6.363v-0.002h0.002c0.093-0.093 0.166-0.2041 0.217-0.3281l0.002-0.0019v-0.002c0.02-0.0508 0.019-0.1053 0.031-0.1582 0.016-0.0718 0.043-0.14 0.043-0.2168 0-0.0714-0.027-0.1341-0.041-0.2012-0.012-0.0578-0.012-0.1202-0.033-0.1738v-0.002c-0.001-0.0013-0.002-0.0026-0.002-0.0039-0.051-0.1233-0.124-0.2335-0.217-0.3261-0.001-0.0007-0.001-0.0013-0.002-0.002l-6.3632-6.3633c-0.1959-0.19583-0.4534-0.29293-0.709-0.29293z" fill-rule="evenodd"/> | |||
</svg> |
@@ -13,18 +13,18 @@ | |||
OC.Login = _.extend(OC.Login || {}, { | |||
onLogin: function () { | |||
$('#submit') | |||
.removeClass('icon-confirm') | |||
.removeClass('icon-confirm-white') | |||
.addClass('icon-loading-small') | |||
.css('opacity', '1'); | |||
.attr('value', t('core', 'Logging in …')); | |||
return true; | |||
}, | |||
rememberLogin: function(){ | |||
if($(this).is(":checked")){ | |||
if($("#user").val() && $("#password").val()) { | |||
$('#submit').trigger('click'); | |||
} | |||
} | |||
if($("#user").val() && $("#password").val()) { | |||
$('#submit').trigger('click'); | |||
} | |||
} | |||
} | |||
}); | |||
@@ -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,9 +51,8 @@ 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> | |||
<input type="submit" id="submit" class="login primary icon-confirm" title="<?php p($l->t('Log in')); ?>" value="" disabled="disabled" tabindex="4" /> | |||
</p> | |||
<?php if (!empty($_['invalidpassword']) && !empty($_['canResetPassword'])) { ?> | |||
@@ -65,16 +64,22 @@ script('core', [ | |||
<?php p($l->t('Wrong password.')); ?> | |||
</p> | |||
<?php } ?> | |||
<?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"> | |||
<?php } ?> | |||
<label for="remember_login"><?php p($l->t('Stay logged in')); ?></label> | |||
<input type="submit" id="submit" class="login primary icon-confirm-white" title="" value="<?php p($l->t('Log in')); ?>" disabled="disabled" /> | |||
<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; ?> | |||
</div> | |||
<?php endif; ?> | |||
<input type="hidden" name="timezone-offset" id="timezone-offset"/> | |||
<input type="hidden" name="timezone" id="timezone"/> | |||
<input type="hidden" name="requesttoken" value="<?php p($_['requesttoken']) ?>"> |