feat: 后台登录调整

This commit is contained in:
gcd 2025-05-14 23:58:05 +08:00
parent 83982cac9f
commit 2ae23df2c9
3 changed files with 48 additions and 108 deletions

View File

@ -5,138 +5,78 @@
<style type="text/css"> <style type="text/css">
body { body {
color: #999; background-color: #FAFAFA;
background-color: #f1f4fd;
background-size: cover; background-size: cover;
} }
a { .container {
color: #444; width: 100%;
height: 100%;
background: url("/assets/img/login-background.png") no-repeat center / 100%;
} }
.login-ctr {
.login-screen { width: 1073px;
max-width: 430px; height: 642px;
padding: 0; background: #FFFFFF;
margin: 100px auto 0 auto; box-shadow: 0px 4px 8px 2px rgba(0,0,0,0.04), 0px 2px 6px 0px rgba(0,0,0,0.06), 0px 0px 4px 0px rgba(0,0,0,0.08);
border-radius: 12px;
} }
.login-screen .well { .flex-c {
border-radius: 3px; display: flex;
-webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); justify-content: center;
box-shadow: 0 0 30px rgba(0, 0, 0, 0.1); align-items: center;
background: rgba(255, 255, 255, 1);
border: none;
/*overflow: hidden;*/
padding: 0;
} }
@media (max-width: 767px) { .flex-r {
.login-screen { display: flex;
padding: 0 20px; justify-content: flex-end;
} align-items: center;
} }
.profile-img-card { .flex-l {
width: 100px; display: flex;
height: 100px; justify-content: flex-start;
display: block; align-items: center;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
margin: -93px auto 30px;
border: 5px solid #fff;
} }
.profile-name-card { .flex-sb {
text-align: center; display: flex;
justify-content: space-between;
align-items: center;
}
.container .login-ctr .left {
width: 400px;
height: 360px;
background: url("/assets/img/login-image.png") no-repeat center / 100%;
} }
.login-head { .container .login-ctr .right {
background: #899fe1; width: 482px;
border-radius: 3px 3px 0 0; height: 445px;
} }
.login-form { .container .login-ctr .right {
padding: 40px 30px; margin-left: 100px;
position: relative;
z-index: 99;
} }
#login-form { .container .login-ctr .right .title {
margin-top: 20px; height: 67px;
} font-weight: 700;
font-size: 40px;
#login-form .input-group { color: rgba(0,0,0,0.9);
margin-bottom: 15px;
}
#login-form .form-control {
font-size: 13px;
} }
</style> </style>
<!--@formatter:off-->
{if $background}
<style type="text/css">
body{
background-image: url('{$background|htmlentities}');
}
</style>
{/if}
<!--@formatter:on-->
</head> </head>
<body> <body>
<div class="container"> <div class="container flex-c">
<div class="login-wrapper"> <div class="login-ctr flex-c">
<div class="login-screen"> <div class="left"></div>
<div class="well"> <div class="right">
<div class="login-head"> <div class="title">
<img src="__CDN__/assets/img/login-head.png" style="width:100%;"/> 欢迎登录 超邦手后台
</div>
<div class="login-form">
<img id="profile-img" class="profile-img-card" src="__CDN__/assets/img/avatar.png"/>
<p id="profile-name" class="profile-name-card"></p>
<form action="" method="post" id="login-form">
<!--@AdminLoginFormBegin-->
<div id="errtips" class="hide"></div>
{:token()}
<div class="input-group">
<div class="input-group-addon"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></div>
<input type="text" class="form-control" id="pd-form-username" placeholder="{:__('Username')}" name="username" autocomplete="off" value="" data-rule="{:__('Username')}:required;username"/>
</div>
<div class="input-group">
<div class="input-group-addon"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span></div>
<input type="password" class="form-control" id="pd-form-password" placeholder="{:__('Password')}" name="password" autocomplete="off" value="" data-rule="{:__('Password')}:required;password"/>
</div>
<!--@CaptchaBegin-->
{if $Think.config.fastadmin.login_captcha}
<div class="input-group">
<div class="input-group-addon"><span class="glyphicon glyphicon-option-horizontal" aria-hidden="true"></span></div>
<input type="text" name="captcha" class="form-control" placeholder="{:__('Captcha')}" data-rule="{:__('Captcha')}:required;length({$Think.config.captcha.length|htmlentities})" autocomplete="off"/>
<span class="input-group-addon" style="padding:0;border:none;cursor:pointer;">
<img src="{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha" width="100" height="30" onclick="this.src = '{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha&r=' + Math.random();"/>
</span>
</div>
{/if}
<!--@CaptchaEnd-->
{if $keeyloginhours>0}
<div class="form-group checkbox">
<label class="inline" for="keeplogin" data-toggle="tooltip" title="{:__('The duration of the session is %s hours', $keeyloginhours)}">
<input type="checkbox" name="keeplogin" id="keeplogin" value="1"/>
{:__('Keep login')}
</label>
</div>
{/if}
<div class="form-group">
<button type="submit" class="btn btn-success btn-lg btn-block" style="background:#708eea;">{:__('Sign in')}</button>
</div>
<!--@AdminLoginFormEnd-->
</form>
</div>
</div> </div>
</div> </div>
</div> </div>

Binary file not shown.

After

Width:  |  Height:  |  Size: 287 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 37 KiB