blackteay/ThinkAdmin
1
0
Fork 0
mirror of https://gitee.com/zoujingli/ThinkAdmin.git synced 2025-04-05 19:41:44 +08:00
Code Issues Projects Releases Wiki Activity

更新登录界面

Browse Source
This commit is contained in:
Anyon 2017-02-12 22:43:46 -05:00
parent c42f7e0fac
commit ff271afd5b
20 changed files with 138 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

107
application/admin/view/login.index.html
View File

@ -1,57 +1,68 @@
{extend name="extra@admin/header" /}
{block name="style"}
<link rel="stylesheet" href="__STATIC__/theme/default/css/login.css">
{/block}
{block name="bodyTag"}
<body class="gray-bg full-height full-width login-container">
<style>
html {
height: 100%
}
</style>
<div class="text-center layer-box">
<div class="animated fadeInDown layer-content">
<div class='logo'><img
src="{:sysconf('site_logo')}"
onerror='this.src="http://basic.demo.cuci.cc/static/theme/img/cuci.png"' alt=""/></div>
<form onsubmit="return false;" data-callback='logincallback' data-time="0.01" data-auto role="form"
method="POST">
<div class="form-group has-feedback">
<span class="fa fa-user input-icon"></span>
<input autofocus="true" autocomplete="off" class="form-control" name="username" placeholder="Username"
title="请输入用户帐号" required type="text"/>
<body>
<div class="login-container" style="height:100%">
<div class="clouds clouds-footer"></div>
<div class="clouds"></div>
<div class="clouds clouds-fast"></div>
<div class="header">
<span>欢迎登录后台管理界面平台</span>
<ul>
<li><a href="/">回首页</a></li>
<li><a href="javascript:void(0)" target="_blank"><b><font color="#FFF">帮助</font></b></a></li>
<li>
<a href="http://sw.bos.baidu.com/sw-search-sp/software/4bcf5e4f1835b/ChromeStandalone_54.0.2840.99_Setup.exe"
target="_blank"><b><font color="#fff">推荐谷歌浏览器</font></b></a></li>
<li><a href="http://www.cuci.cc">楚才官网</a></li>
</ul>
</div>
<div class="container" style="top:50%;margin-top:-300px">
<form onsubmit="return false;" method="post" class="content layui-form">
<div class="people">
<div class="tou"></div>
<div class="initial_left_hand"
data-ng-class="{false:'initial_left_hand', true:'left_hand'}[hideEye]"></div>
<div class="initial_right_hand"
data-ng-class="{false:'initial_right_hand', true:'right_hand'}[hideEye]"></div>
</div>
<div class="form-group has-feedback">
<span class="fa fa-key input-icon"></span>
<input autocomplete="off" class="form-control" name="password" placeholder="Password" title="请输入登录密码"
required type="password"/>
</div>
<div class="form-group has-feedback verify-label clearfix hide">
<span class="fa fa-gg input-icon"></span>
<span class='input'>
<input maxlength='4' autocomplete="off" class="form-control" name="verify"
placeholder="Verify" title="请输入验证码" required type="text"/>
</span>
<img data-tips-text='刷新验证码' class='pointer' onclick="this.src = this.src + '?'"
src="http://basic.demo.cuci.cc/admin-login-verify.html"/>
</div>
<button type="submit" class="btn btn-primary btn-lg full-width login-btn">登录</button>
<ul>
<li>
<input required="required"
pattern="^\S{4,}$"
title="请输入4位及以上的字符"
type="text"
name="username"
class="layui-input username"
autocomplete="off"
autofocus="autofocus"
placeholder="请输入用户名/手机号码"/>
</li>
<li>
<input required="required"
pattern="^\S{4,}$"
title="请输入4位及以上的字符"
type="password"
name="password"
class="layui-input password"
autocomplete="off" placeholder="请输入密码"/>
</li>
<li class="text-center">
<button type="submit" class="layui-btn layui-btn">立 即 登 入</button>
<a style="position:absolute;display:block;right:0" href="javascript:void(0)">忘记密码？</a>
</li>
</ul>
</form>
</div>
<p class='copyright'>
<small>{:sysconf('site_company')} &copy; {:date('Y')}</small>
</p>
</div>
<div class="hide">
<script>
window.login_error_num = parseInt('0');
window.logincallback = function (ret) {
if (ret.code !== 'SUCCESS') {
window.login_error_num += 1;
if (window.login_error_num >= 3) {
$('.verify-label').removeClass('hide');
}
}
};
</script>
<div class="footer">{:sysconf('site_company')} &copy; {:date('Y')}</div>
</div>
</body>
{/block}

24
public/static/theme/default/css/console.css
View File

@ -128,18 +128,18 @@ td .text-explode:first-child{opacity:0;display:none}
.mobile-footer .arrow_out {bottom:-6px;border-top-color:#d0d0d0}
/** 登录页面样式 */
.login-container{min-width:560px;position:absolute;left:0;top:0;display:table;-webkit-transform:translateZ(0);background:#e9e9e9 url(../img/login_bg.jpg) no-repeat center !important;background-size:100% auto}
.login-container input{padding-left:33px}
.login-container .logo img{margin-bottom:48px;max-width: 200px;}
.login-container .layer-box{height:100%;vertical-align:middle;display:table-cell;-webkit-animation-duration:.5s;animation-duration:.5s}
.login-container .layer-content{box-shadow:0px 0px 10px #ccc;width:490px;background-color:#f7f7f7;padding:98px 98px 160px 98px;margin:-80px auto auto auto}
.login-container .input-icon{position:absolute;top:0;left:0;z-index:2;display:block;width:34px;height:34px;line-height:34px;text-align:center;pointer-events:none}
.login-container .copyright{position:absolute;left:0;bottom:30px;width:100%}
.login-container .wrapper{min-width:0!important}
.login-container .verify-label span.input{position:relative;float:left}
.login-container .verify-label input{width:208px;display:inline-block;}
.login-container .verify-label img{height:34px;width:80px;border:1px solid #e5e6e7;float:right}
.login-container .login-btn{margin-top:15px;}
/*.login-container{min-width:560px;position:absolute;left:0;top:0;display:table;-webkit-transform:translateZ(0);background:#e9e9e9 url(../img/login_bg.jpg) no-repeat center !important;background-size:100% auto}*/
/*.login-container input{padding-left:33px}*/
/*.login-container .logo img{margin-bottom:48px;max-width: 200px;}*/
/*.login-container .layer-box{height:100%;vertical-align:middle;display:table-cell;-webkit-animation-duration:.5s;animation-duration:.5s}*/
/*.login-container .layer-content{box-shadow:0px 0px 10px #ccc;width:490px;background-color:#f7f7f7;padding:98px 98px 160px 98px;margin:-80px auto auto auto}*/
/*.login-container .input-icon{position:absolute;top:0;left:0;z-index:2;display:block;width:34px;height:34px;line-height:34px;text-align:center;pointer-events:none}*/
/*.login-container .copyright{position:absolute;left:0;bottom:30px;width:100%}*/
/*.login-container .wrapper{min-width:0!important}*/
/*.login-container .verify-label span.input{position:relative;float:left}*/
/*.login-container .verify-label input{width:208px;display:inline-block;}*/
/*.login-container .verify-label img{height:34px;width:80px;border:1px solid #e5e6e7;float:right}*/
/*.login-container .login-btn{margin-top:15px;}*/
/** 后台框架结构 */
html{overflow:auto;overflow-y:scroll!important}body{font-size:12px}

67
public/static/theme/default/css/login.css Normal file
View File

@ -0,0 +1,67 @@
@charset "utf-8";
html,body{height:100%;width:100%}
/* login */
.login-container {background-color:#1c77ac; overflow:hidden;font-family:'微软雅黑'; margin:0 auto;min-width:980px;font-size:9pt}
.login-container ul{display:block;margin:0;padding:0;list-style:none;}
.login-container ul li{display:block;margin:0;padding:0;list-style: none;}
.login-container img{border:0;}
.login-container .clouds {
background: url("../img/login/cloud_three.png") repeat-x left 15% ;
position: absolute;left: 0;top: 0;height: 100%;width: 300%;
-webkit-animation: cloudmove 200s linear infinite;
-moz-animation: cloudmove 200s linear infinite;
-o-animation: cloudmove 200s linear infinite;
animation: cloudmove 200s linear infinite;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.login-container .clouds-fast {
background: url("../img/login/cloud.png") no-repeat 0px 40% ;
-webkit-animation: cloudmove 30s linear infinite;
-moz-animation: cloudmove 30s linear infinite;
-o-animation: cloudmove 30s linear infinite;
animation: cloudmove 30s linear infinite;
}
.login-container .clouds-footer {
background: url("../img/login/cloud_one.png") no-repeat left 100% ;
animation:none
}
@-webkit-keyframes cloudmove {0% {left: -50%}100% {left: 150%}}
@-moz-keyframes cloudmove {0% {left: -50%}100% {left: 150%}}
@keyframes cloudmove {0% {left: -50%}100% {left: 150%}}
.login-container a,
.login-container a:focus{text-decoration:none;color:#000;outline:none;blur:expression(this.onFocus=this.blur());}
.login-container a:hover{color:#00a4ac;text-decoration:none;}
.login-container .header{height:47px;position:absolute; position:fixed; top:0; background:url(../img/login/loginbg1.png) repeat-x;z-index:100; width:100%;}
.login-container .header span{line-height:47px; text-indent:44px; float:left;font-family: "Helvetica Neue","Hiragino Sans GB","Microsoft YaHei","\9ED1\4F53",Arial,sans-serif;color:#DDD;font-size: 12px;}
.login-container .header ul{float:right; padding-right:30px;}
.login-container .header ul li{float:left; margin-left:20px; line-height:47px;}
.login-container .header ul li a{color:#afc5d2;}
.login-container .header ul li a:hover{color:#fff;}
.login-container .container{background:url(../img/login/loginbg3.png) no-repeat center center; width:100%; height:585px; overflow:hidden; position:relative; top:47px;}
.login-container .logo{background:url(http://static.cdn.cuci.cc/2016/0414/af3c5d9fcf94b34113274f8c047755fc.png?imageMogr2/thumbnail/!160x56r/gravity/Center/crop/160x56/interlace/1) no-repeat center;width:100%; height:170px; margin-top:40px;}
/* 登录表单 */
.login-container .content{width:692px; height:336px; background:url(../img/login/logininfo.png) no-repeat; margin:80px auto auto auto;position:relative;display:block;}
.login-container .content ul{margin-left:285px;margin-right:60px;}
.login-container .content ul li{margin-bottom:25px;position:relative}
.login-container .content ul li input{margin-bottom:25px;position:relative;background:url(../img/icon.png) no-repeat;background-size:20px;padding-left:38px}
.login-container .content ul li input.username{background-position: 8px 7px}
.login-container .content ul li input.password{background-position: 8px -20px}
/* 头像 */
.login-container .people{width:165px; height:96px;position:relative;top:8px;left:-70px}
.login-container .people .tou{background: url("../img/login/tou.png") no-repeat;width: 97px;height: 92px;position: absolute;top: -87px;left: 140px;}
.login-container .people .left_hand{background: url("../img/login/left_hand.png") no-repeat;width: 32px;height: 37px;position: absolute;top: -38px;left: 150px}
.login-container .people .right_hand{background: url("../img/login/right_hand.png") no-repeat;width: 32px;height: 37px;position: absolute;top: -38px;right: -64px;}
.login-container .people .initial_left_hand{background: url("../img/login/hand.png") no-repeat;width: 30px;height: 20px;position: absolute;top: -12px;left: 100px;}
.login-container .people .initial_right_hand{background: url("../img/login/hand.png") no-repeat;width: 30px;height: 20px;position: absolute;top: -12px;right: -112px;}
/* 底部版权 */
.login-container .footer{height:50px; line-height:50px; text-align:center; background:url(../img/login/loginbg2.png) repeat-x;position:fixed;_position:absolute;*position:absolute;bottom:0;width:100%; color:#0b3a58;color:#fff}
.login-container .footer a{font-weight:bold;color:#0b3a58;}
.login-container .footer a:hover{color:#fff;color:#fff}

BIN
public/static/theme/default/img/icon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

BIN
public/static/theme/default/img/login/buttonbg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
public/static/theme/default/img/login/cloud.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 34 KiB

BIN
public/static/theme/default/img/login/cloud_one.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 191 KiB

BIN
public/static/theme/default/img/login/cloud_three.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 280 KiB

BIN
public/static/theme/default/img/login/cloud_two.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 208 KiB

BIN
public/static/theme/default/img/login/hand.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

BIN
public/static/theme/default/img/login/left_hand.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

BIN
public/static/theme/default/img/login/light.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 129 KiB

BIN
public/static/theme/default/img/login/loginbg1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
public/static/theme/default/img/login/loginbg2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
public/static/theme/default/img/login/loginbg3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 150 KiB

BIN
public/static/theme/default/img/login/logininfo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 66 KiB

BIN
public/static/theme/default/img/login/loginpassword.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
public/static/theme/default/img/login/loginuser.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.3 KiB

BIN
public/static/theme/default/img/login/right_hand.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
public/static/theme/default/img/login/tou.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.0 KiB