mirror of
https://gitee.com/dromara/MaxKey.git
synced 2025-12-07 17:38:32 +08:00
Login UI optimize
This commit is contained in:
parent
72f1868e4f
commit
b44b32a34f
@ -59,7 +59,7 @@ login.text.username=\u7528\u6237\u540D
|
||||
login.text.mobile=\u624B\u673A\u53F7\u7801
|
||||
login.text.password=\u5BC6 \u7801
|
||||
login.text.captcha=\u9A8C\u8BC1\u7801
|
||||
login.text.smscode=\u77ED\u4FE1\u9A8C\u8BC1\u7801
|
||||
login.text.smscode=\u9A8C \u8BC1 \u7801
|
||||
login.text.remeberme=\u8BB0\u4F4F\u767B\u5F55
|
||||
login.text.forgotpassword=\u5FD8\u8BB0\u5BC6\u7801
|
||||
login.button.login=\u767B\u5F55
|
||||
|
||||
@ -59,7 +59,7 @@ login.text.username=Username
|
||||
login.text.mobile=Phone Number
|
||||
login.text.password=Password
|
||||
login.text.captcha=CAPTCHA
|
||||
login.text.smscode=Message Code
|
||||
login.text.smscode=Code
|
||||
login.text.remeberme=RemeberMe
|
||||
login.text.forgotpassword=Forgot Password
|
||||
login.button.login=Login
|
||||
|
||||
@ -59,7 +59,7 @@ login.text.username=\u7528\u6237\u540D
|
||||
login.text.mobile=\u624B\u673A\u53F7\u7801
|
||||
login.text.password=\u5BC6 \u7801
|
||||
login.text.captcha=\u9A8C\u8BC1\u7801
|
||||
login.text.smscode=\u77ED\u4FE1\u9A8C\u8BC1\u7801
|
||||
login.text.smscode=\u9A8C \u8BC1 \u7801
|
||||
login.text.remeberme=\u8BB0\u4F4F\u767B\u5F55
|
||||
login.text.forgotpassword=\u5FD8\u8BB0\u5BC6\u7801
|
||||
login.button.login=\u767B\u5F55
|
||||
|
||||
@ -7,23 +7,27 @@
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><@locale code="login.text.mobile"/>:</td>
|
||||
<td><@locale code="login.text.mobile"/></td>
|
||||
<td>
|
||||
<div class="wrapper">
|
||||
<i class="fa fa-mobile"></i>
|
||||
<input required="" class="form-control" type='text' id='mobile_j_username' name='username' value="" tabindex="1"/>
|
||||
<div class="input-group" style="width:250px;">
|
||||
<i class="fa fa-mobile"></i>
|
||||
<input required="" class="form-control" type='text' id='mobile_j_username' name='username' value="" tabindex="1"/>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><@locale code="login.text.smscode"/>:</td>
|
||||
<td><@locale code="login.text.smscode"/></td>
|
||||
<td>
|
||||
<div class="wrapper">
|
||||
<i class="fa fa-lock fa-2"></i>
|
||||
<input required="" class="form-control" type='password' id='mobile_j_password' name='password' value="" tabindex="2" style="float: left;"/>
|
||||
<button class="btn btn-outline-secondary" id="mobile_j_otp_button" tabindex="5" type="button" >
|
||||
<@locale code="login.text.login.mobile.obtain"/>
|
||||
</button>
|
||||
<div class="input-group" style="width:250px;">
|
||||
<i class="fa fa-lock fa-2"></i>
|
||||
<input required="" class="form-control" type='password' id='mobile_j_password' name='password' value="" tabindex="2" style="float: left;"/>
|
||||
<button class="btn btn-outline-secondary" id="mobile_j_otp_button" tabindex="5" type="button" >
|
||||
<@locale code="login.text.login.mobile.obtain"/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
@ -7,30 +7,39 @@
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><@locale code="login.text.username"/>:</td>
|
||||
<td><@locale code="login.text.username"/></td>
|
||||
<td>
|
||||
<div class="wrapper">
|
||||
<i class="fa fa-user"></i>
|
||||
<input required="" class="form-control" type='text' id='j_username' name='username' value="admin" tabindex="1"/>
|
||||
<div class="input-group" style="width:250px;">
|
||||
<i class="fa fa-user" ></i>
|
||||
<input required="" class="form-control" type='text' id='j_username' name='username' value="admin" tabindex="1"/>
|
||||
</div >
|
||||
</div >
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><@locale code="login.text.password"/>:</td>
|
||||
<td><@locale code="login.text.password"/></td>
|
||||
<td>
|
||||
<div class="wrapper">
|
||||
<i class="fa fa-key fa-2" style="color: #FFD700;"></i>
|
||||
<input required="" class="form-control" type='password' id='j_password' name='password' value="maxkey" tabindex="2"/>
|
||||
<div class="input-group" style="width:250px;">
|
||||
<i class="fa fa-key fa-2" style="color: #FFD700;"></i>
|
||||
<input required="" class="form-control" type='password' id='j_password' name='password' value="maxkey" tabindex="2"/>
|
||||
<i class="passwdeye fa fa-eye-slash fa-2" style="left: 220px; color: gainsboro;" refid="j_password" ></i>
|
||||
</div >
|
||||
</div >
|
||||
</td>
|
||||
</tr>
|
||||
<#if true==isCaptcha>
|
||||
<tr>
|
||||
<td><@locale code="login.text.captcha"/>:</td>
|
||||
<td><@locale code="login.text.captcha"/></td>
|
||||
<td>
|
||||
<div class="wrapper">
|
||||
<i class="fa fa-lock fa-2"></i>
|
||||
<input required="" class="form-control " type='text' id="j_captcha" name="captcha" tabindex="3" value="" style="float: left;"/><img id="j_captchaimg" class="captcha-image" src="<@base/>/captcha"/>
|
||||
|
||||
<div class="input-group" style="width:250px;">
|
||||
<i class="fa fa-lock fa-2" ></i>
|
||||
<input required="" class="form-control " type='text' id="j_captcha" name="captcha" tabindex="3" value="" style="float: left;"/>
|
||||
<img id="j_captchaimg" class="captcha-image" src="<@base/>/captcha"/>
|
||||
</div >
|
||||
</div >
|
||||
</td>
|
||||
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><@locale code="login.text.username"/>:</td>
|
||||
<td><@locale code="login.text.username"/></td>
|
||||
<td>
|
||||
<div class="wrapper">
|
||||
<i class="fa fa-user"></i>
|
||||
@ -16,7 +16,7 @@
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><@locale code="login.text.password"/>:</td>
|
||||
<td><@locale code="login.text.password"/></td>
|
||||
<td>
|
||||
<div class="wrapper">
|
||||
<i class="fa fa-key fa-2" style="color: #FFD700;"></i>
|
||||
@ -26,7 +26,7 @@
|
||||
</tr>
|
||||
<#if true==isMfa >
|
||||
<tr>
|
||||
<td><@locale code="login.text.captcha"/>:</td>
|
||||
<td><@locale code="login.text.captcha"/></td>
|
||||
<td>
|
||||
<div class="wrapper">
|
||||
<i class="fa fa-lock fa-2"></i>
|
||||
|
||||
@ -18,24 +18,24 @@
|
||||
<div class="card-body">
|
||||
<main class ="form-signin">
|
||||
<form class="form-horizontal m-t-20 needs-validation" id="loginForm" name="loginForm" action="<@base />/logon.do" method="post" novalidate>
|
||||
<div class="row g-3">
|
||||
<div class="row g-4">
|
||||
<div class="">
|
||||
<div class="input-group">
|
||||
<span class="input-group-text fa fa-user"></span>
|
||||
<span class="input-group-text fa fa-user d-flex justify-content-center"></span>
|
||||
<input id='j_username' name='username' value="admin" class="form-control" type="text" required="" placeholder="<@locale code="login.text.username"/>">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="">
|
||||
<div class="input-group">
|
||||
<span class="input-group-text fa fa-key"></span>
|
||||
<span class="input-group-text fa fa-key d-flex justify-content-center"></span>
|
||||
<input id='j_password' name='password' class="form-control" type="password" required="" placeholder="<@locale code="login.text.password"/>">
|
||||
</div>
|
||||
</div>
|
||||
<#if true==isCaptcha>
|
||||
<div class="">
|
||||
<div class="input-group">
|
||||
<span class="input-group-text fa fa-refresh"></span>
|
||||
<span class="input-group-text fa fa-refresh d-flex justify-content-center"></span>
|
||||
<input id="j_captcha" name="captcha" class="form-control" value="" type="text" required="" placeholder="<@locale code="login.text.captcha"/>">
|
||||
<img id="j_captchaimg" class="captcha-image" src="<@base/>/captcha" />
|
||||
</div>
|
||||
|
||||
@ -256,8 +256,8 @@ body{
|
||||
}
|
||||
|
||||
.login_form_table td, .login_form_table th {
|
||||
padding: .2rem;
|
||||
vertical-align: top;
|
||||
height: 60px;
|
||||
vertical-align: middle;
|
||||
border-top: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
@ -283,7 +283,7 @@ body{
|
||||
|
||||
#j_captchaimg{
|
||||
width:70px;
|
||||
height: 33px;
|
||||
height: 35px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
@ -308,6 +308,7 @@ body{
|
||||
#register a{
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
text-decoration-line: none;
|
||||
}
|
||||
|
||||
.login_error_message{
|
||||
@ -346,8 +347,9 @@ body{
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 5px;
|
||||
font-size: 22px;
|
||||
color: gray;
|
||||
font-size: 24px;
|
||||
color: black;
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
#tfa_j_otp_button,#mobile_j_otp_button{
|
||||
|
||||
@ -534,7 +534,7 @@ header .header-container .nav-left>li, .header .header-container .nav-right>li {
|
||||
|
||||
#j_captchaimg{
|
||||
width:70px;
|
||||
height: 33px;
|
||||
height: 35px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
|
||||
@ -33,6 +33,18 @@ $(function(){
|
||||
$('.captcha-image').click(function () {//
|
||||
$(this).attr("src", webContextPath + "/captcha?"+(new Date()).getTime());
|
||||
});
|
||||
|
||||
//passwdeye
|
||||
$('.passwdeye').click(function () {//
|
||||
if($(this).hasClass("fa-eye-slash")){
|
||||
$(this).removeClass("fa-eye-slash").addClass("fa-eye");
|
||||
$("#"+$(this).attr("refid")).attr("type","text");
|
||||
}else{
|
||||
$(this).removeClass("fa-eye").addClass("fa-eye-slash");
|
||||
$("#"+$(this).attr("refid")).attr("type","password");
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
/*side-nav-menu side navigation*/
|
||||
if($('#side-nav-menu').length > 0){
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user