Merge pull request #1641 from nextcloud/log-in-button
bring back dedicated log in button to make log in more usable
This commit is contained in:
commit
cf5d30387b
|
@ -147,7 +147,10 @@ img.icon-loading-small-dark, object.icon-loading-small-dark, video.icon-loading-
|
||||||
}
|
}
|
||||||
|
|
||||||
.icon-confirm {
|
.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,
|
.icon-delete,
|
||||||
|
|
|
@ -286,32 +286,10 @@ body {
|
||||||
margin: -13px;
|
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 {
|
#body-login form {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 280px;
|
width: 280px;
|
||||||
margin: 32px auto;
|
margin: 16px auto;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
#body-login form fieldset {
|
#body-login form fieldset {
|
||||||
|
@ -420,7 +398,6 @@ label.infield {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 14px;
|
padding: 14px;
|
||||||
padding-left: 28px;
|
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
-webkit-user-select: none;
|
-webkit-user-select: none;
|
||||||
-moz-user-select: none;
|
-moz-user-select: none;
|
||||||
|
@ -442,6 +419,8 @@ label.infield {
|
||||||
|
|
||||||
#body-login #remember_login:hover+label,
|
#body-login #remember_login:hover+label,
|
||||||
#body-login #remember_login:focus+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:hover,
|
||||||
#body-login p.info a:focus {
|
#body-login p.info a:focus {
|
||||||
opacity: .6;
|
opacity: .6;
|
||||||
|
@ -617,8 +596,8 @@ label.infield {
|
||||||
width: 249px;
|
width: 249px;
|
||||||
}
|
}
|
||||||
#body-login input.login {
|
#body-login input.login {
|
||||||
width: auto;
|
width: 269px;
|
||||||
float: right;
|
background-position: right 16px center;
|
||||||
}
|
}
|
||||||
#body-login input[type="submit"] {
|
#body-login input[type="submit"] {
|
||||||
padding: 10px 20px; /* larger log in and installation buttons */
|
padding: 10px 20px; /* larger log in and installation buttons */
|
||||||
|
@ -627,8 +606,15 @@ label.infield {
|
||||||
margin: 18px 5px 0 16px !important;
|
margin: 18px 5px 0 16px !important;
|
||||||
}
|
}
|
||||||
#body-login .remember-login-container {
|
#body-login .remember-login-container {
|
||||||
margin-top: 10px;
|
display: inline-block;
|
||||||
|
margin: 10px 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
#body-login #forgot-password {
|
||||||
|
padding: 11px;
|
||||||
|
float: right;
|
||||||
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Sticky footer */
|
/* 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>
|
After Width: | Height: | Size: 841 B |
|
@ -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>
|
||||||
|
|
Before Width: | Height: | Size: 104 B After Width: | Height: | Size: 829 B |
|
@ -13,18 +13,18 @@
|
||||||
OC.Login = _.extend(OC.Login || {}, {
|
OC.Login = _.extend(OC.Login || {}, {
|
||||||
onLogin: function () {
|
onLogin: function () {
|
||||||
$('#submit')
|
$('#submit')
|
||||||
.removeClass('icon-confirm')
|
.removeClass('icon-confirm-white')
|
||||||
.addClass('icon-loading-small')
|
.addClass('icon-loading-small')
|
||||||
.css('opacity', '1');
|
.attr('value', t('core', 'Logging in …'));
|
||||||
return true;
|
return true;
|
||||||
},
|
},
|
||||||
|
|
||||||
rememberLogin: function(){
|
rememberLogin: function(){
|
||||||
if($(this).is(":checked")){
|
if($(this).is(":checked")){
|
||||||
if($("#user").val() && $("#password").val()) {
|
if($("#user").val() && $("#password").val()) {
|
||||||
$('#submit').trigger('click');
|
$('#submit').trigger('click');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -43,7 +43,7 @@ script('core', [
|
||||||
placeholder="<?php p($l->t('Username or email')); ?>"
|
placeholder="<?php p($l->t('Username or email')); ?>"
|
||||||
value="<?php p($_['loginName']); ?>"
|
value="<?php p($_['loginName']); ?>"
|
||||||
<?php p($_['user_autofocus'] ? 'autofocus' : ''); ?>
|
<?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>
|
<label for="user" class="infield"><?php p($l->t('Username or email')); ?></label>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
@ -51,9 +51,8 @@ script('core', [
|
||||||
<input type="password" name="password" id="password" value=""
|
<input type="password" name="password" id="password" value=""
|
||||||
placeholder="<?php p($l->t('Password')); ?>"
|
placeholder="<?php p($l->t('Password')); ?>"
|
||||||
<?php p($_['user_autofocus'] ? '' : 'autofocus'); ?>
|
<?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>
|
<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>
|
</p>
|
||||||
|
|
||||||
<?php if (!empty($_['invalidpassword']) && !empty($_['canResetPassword'])) { ?>
|
<?php if (!empty($_['invalidpassword']) && !empty($_['canResetPassword'])) { ?>
|
||||||
|
@ -65,16 +64,22 @@ script('core', [
|
||||||
<?php p($l->t('Wrong password.')); ?>
|
<?php p($l->t('Wrong password.')); ?>
|
||||||
</p>
|
</p>
|
||||||
<?php } ?>
|
<?php } ?>
|
||||||
<?php if ($_['rememberLoginAllowed'] === true) : ?>
|
|
||||||
<div class="remember-login-container">
|
<input type="submit" id="submit" class="login primary icon-confirm-white" title="" value="<?php p($l->t('Log in')); ?>" disabled="disabled" />
|
||||||
<?php if ($_['rememberLoginState'] === 0) { ?>
|
|
||||||
<input type="checkbox" name="remember_login" value="1" id="remember_login" class="checkbox checkbox--white" tabindex="3">
|
<div class="login-additional">
|
||||||
<?php } else { ?>
|
<?php if ($_['rememberLoginAllowed'] === true) : ?>
|
||||||
<input type="checkbox" name="remember_login" value="1" id="remember_login" class="checkbox checkbox--white" checked="checked" tabindex="3">
|
<div class="remember-login-container">
|
||||||
<?php } ?>
|
<?php if ($_['rememberLoginState'] === 0) { ?>
|
||||||
<label for="remember_login"><?php p($l->t('Stay logged in')); ?></label>
|
<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>
|
</div>
|
||||||
<?php endif; ?>
|
|
||||||
<input type="hidden" name="timezone-offset" id="timezone-offset"/>
|
<input type="hidden" name="timezone-offset" id="timezone-offset"/>
|
||||||
<input type="hidden" name="timezone" id="timezone"/>
|
<input type="hidden" name="timezone" id="timezone"/>
|
||||||
<input type="hidden" name="requesttoken" value="<?php p($_['requesttoken']) ?>">
|
<input type="hidden" name="requesttoken" value="<?php p($_['requesttoken']) ?>">
|
||||||
|
|
Loading…
Reference in New Issue