{extend name="index/index"}

{block name="body"}
<style>
    .login-container{

        background: linear-gradient(135deg, #393D4A 0%, #282B33 100%);
    }
    .login-container form{
        padding: 50px;
        margin-left: -200px;
        background: #FFFFFF;
        border-radius: 20px;
    }
    .login-container form ul li button{
        background: #DC0619 !important;
        border-radius: 33px !important;
        color: #fff !important;

    }
    .login-container form ul li input{
        background: #FFFFFF;
        border-radius: 2px;
        border: 2px solid #D1D1D1;
        text-shadow:none !important;
        letter-spacing:0px !important;
        color: #ccc !important;
        -webkit-text-fill-color:#000 !important;
        box-shadow:none !important;

        color: #000 !important;

    }
    .lo{
        width: 100%;

    }
    h3{
        text-align: center;
        font-size: 16px;
        margin: 30px 0;
    }
    input[placeholder], [placeholder], *[placeholder] { color:#ccc !important; }

</style>
<div class="login-container" data-supersized="__ROOT__/static/theme/img/login/bg1.jpg,__ROOT__/static/theme/img/login/bg2.jpg">
    <div class="header notselect layui-hide-xs">
        {notempty name='devmode'}
        <a class="pull-right layui-anim layui-anim-fadein" href='https://gitee.com/zoujingli/ThinkAdmin'>
            <img src='https://gitee.com/zoujingli/ThinkAdmin/widgets/widget_1.svg' alt='Fork me on Gitee'>
        </a>
        {/notempty}
    </div>
    <form data-login-form onsubmit="return false" method="post" class="layui-anim layui-anim-upbit" autocomplete="off">
        <img src="__ROOT__/static/cc.png" class="lo"/>
        <h3>目标成本分析系统</h3>
        <h3>登录</h3>
        <ul>
            <li class="username">
                <label>
                    <i class="layui-icon layui-icon-username" style="text-shadow:none !important;color: #D1D1D1 !important;"></i>
                    <input class="layui-input" required pattern="^\S{4,}$" name="username" autofocus autocomplete="off" placeholder="登录账号" title="请输入登录账号" style="-webkit-text-fill-color:#000 !important;box-shadow:none !important; ">
                </label>
            </li>
            <li class="password">
                <label>
                    <i class="layui-icon layui-icon-password" style="text-shadow:none !important;color: #D1D1D1 !important;"></i>
                    <input class="layui-input" required pattern="^\S{4,}$" name="password" maxlength="32" type="password" autocomplete="off" placeholder="登录密码" title="请输入登录密码" style="-webkit-text-fill-color:#000 !important;box-shadow:none !important; ">
                </label>
            </li>
            <li class="verify layui-hide">
                <label class="inline-block relative">
                    <i class="layui-icon layui-icon-picture-fine"></i>
                    <input class="layui-input" required pattern="^\S{4,}$" name="verify" maxlength="4" autocomplete="off" placeholder="验证码" title="请输入验证码">
                </label>
                <label data-captcha="{:url('admin/login/captcha',[],false)}" data-field-verify="verify" data-field-uniqid="uniqid" data-captcha-type="{$captcha_type}" data-captcha-token="{$captcha_token}"></label>
            </li>
            <li class="text-center padding-top-20">
                <button type="submit" class="layui-btn layui-disabled full-width" data-form-loaded="登录">正在载入</button>
            </li>
        </ul>
    </form>
    <div class="footer notselect">
        <p class="layui-hide-xs"><a target="_blank" href="#">鲁ICP备2021010683号-1</a></p>
    </div>
</div>
{/block}

{block name='style'}
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
<script>if (location.href.indexOf('#') > -1) location.replace(location.href.split('#')[0])</script>
<link rel="stylesheet" href="__ROOT__/static/theme/css/login.css">
{/block}

{block name='script'}
<script src="__ROOT__/static/login.js"></script>
<script src="__ROOT__/static/plugs/supersized/supersized.3.2.7.min.js"></script>
{/block}