frio: tweak login template, fix style

move lost pwd link and register to submit wrapper,
use flexbox for submit row in login form,
show register link as button
fix form label colors in mobile
This commit is contained in:
fabrixxm 2018-01-17 16:01:34 +01:00
parent 9862194914
commit 2c8bbea65d
2 changed files with 27 additions and 16 deletions

View file

@ -3008,6 +3008,14 @@ section .profile-match-wrapper {
/** /**
* Login page * Login page
*/ */
#login-submit-wrapper {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
#lost-password-link { flex-grow: 2; }
.mod-home.is-not-singleuser, .mod-home.is-not-singleuser,
.mod-login { .mod-login {
background-image: linear-gradient(to right, rgba(0,0,0, 0.7) , rgba(0,0,0, 0.4)), url($login_bg_image); background-image: linear-gradient(to right, rgba(0,0,0, 0.7) , rgba(0,0,0, 0.4)), url($login_bg_image);
@ -3030,11 +3038,12 @@ section .profile-match-wrapper {
margin-top: 2.5%; margin-top: 2.5%;
} }
.mod-home.is-not-singleuser .login-form > #login-form, .mod-home.is-not-singleuser .login-form > #login-form label,
.mod-login .login-form > #login-form { .mod-login #content #login-form label {
color: #eee; color: #eee;
} }
.mod-home.is-not-singleuser .login-panel-content, .mod-home.is-not-singleuser .login-panel-content,
.mod-login .login-panel-content { .mod-login .login-panel-content {
background-color: rgba(255,255,255,.85); background-color: rgba(255,255,255,.85);
@ -3047,19 +3056,21 @@ section .profile-match-wrapper {
margin-top: 100px!important; margin-top: 100px!important;
} }
.mod-home.is-not-singleuser .login-form > #login-form, .mod-home.is-not-singleuser .login-form > #login-form,
.mod-login .login-form > #login-form { .mod-login #content #login-form {
background-color: #fff; background-color: #fff;
color: #444;
padding: 1em; padding: 1em;
position: relative; position: relative;
margin-top: 4em; margin-top: 4em;
} }
.mod-home.is-not-singleuser .login-form > #login-form:before, .mod-home.is-not-singleuser .login-form > #login-form label,
.mod-login .login-form > #login-form:before { .mod-login #content #login-form label {
color: #444;
}
.mod-home.is-not-singleuser .login-form > #login-form::before,
.mod-login #content #login-form::before {
display: block; display: block;
position: absolute; position: absolute;
content: " "; content: " ";
@ -3071,8 +3082,8 @@ section .profile-match-wrapper {
z-index: -1; z-index: -1;
} }
.mod-home.is-not-singleuser .login-form > #login-form:after, .mod-home.is-not-singleuser .login-form > #login-form::after,
.mod-login .login-form > #login-form:after { .mod-login #content #login-form::after {
display: block; display: block;
position: absolute; position: absolute;
content: " "; content: " ";

View file

@ -18,15 +18,15 @@
{{include file="field_checkbox.tpl" field=$lremember}} {{include file="field_checkbox.tpl" field=$lremember}}
<div id="login-extra-links" class="list-unstyled"> <div id="login-submit-wrapper">
{{if $register}}<a href="register" title="{{$register.title|escape:'html'}}" id="register-link">{{$register.desc}}</a>{{/if}}
<a href="lostpass" title="{{$lostpass|escape:'html'}}" id="lost-password-link">{{$lostlink}}</a> <a href="lostpass" title="{{$lostpass|escape:'html'}}" id="lost-password-link">{{$lostlink}}</a>
</div>
<div id="login-submit-wrapper" class="pull-right" > <div class="pull-right" >
{{if $register}}<a href="register" title="{{$register.title|escape:'html'}}" id="register-link" class="btn btn-default">{{$register.desc}}</a>{{/if}}
<button type="submit" name="submit" id="login-submit-button" class="btn btn-primary" value="{{$login|escape:'html'}}">{{$login|escape:'html'}}</button> <button type="submit" name="submit" id="login-submit-button" class="btn btn-primary" value="{{$login|escape:'html'}}">{{$login|escape:'html'}}</button>
</div> </div>
<div class="clear"></div> </div>
{{foreach $hiddens as $k=>$v}} {{foreach $hiddens as $k=>$v}}
<input type="hidden" name="{{$k}}" value="{{$v|escape:'html'}}" /> <input type="hidden" name="{{$k}}" value="{{$v|escape:'html'}}" />