<template>
    <div>
        <div class="forget-container">
            <div class="title">
                找回密码
            </div>
            <div class="body">
                <div class="form">
                    <div class="form-item clearfix">
                        <img class="icon" src="../assets/phone.png">
                        <input type="text" class="form-control input" placeholder="请输入手机号或邮箱">
                    </div>
                    <div class="form-item clearfix">
                        <img class="icon" src="../assets/idencode.png">
                        <div class="input-group">
                            <input type="text" class="form-control" placeholder="请输入验证码">
                            <span class="input-group-btn">
                                <button class="btn btn-primary" type="button">获取验证码</button>
                            </span>
                        </div>
                    </div>
                    <div class="form-item clearfix">
                        <img class="icon" src="../assets/password.png">
                        <input type="text" class="form-control input" placeholder="请设置新密码">
                    </div>
                    <div class="clearfix operate" style="padding-top:10px;">
                        <button class="btn btn-danger" style="width:120px">确定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
    export default{
        data(){
            return {

            }
        },
        methods:{

        }
    }
</script>

<style scoped>
    .forget-container{
        width:600px;
        /*height:300px;*/
        /*background-color:#000;*/
        top:center;
        left:center;
    }

    .title{
        text-align:center;
        height:70px;
        background-color:#fdd32c;
        line-height:70px;
        color:#000;
        font-weight:bold;
        font-size:24px;
    }

    .body{
        border-width:0 2px 2px 2px;
        border-style:solid;
        border-color:#d6d6d6;
        padding:28px 0;
        text-align:center;
    }

    .body .form{
        display:inline-block;
    }

    .body .form .form-item{
        margin-bottom:20px;
    }

    .body .form .icon{
        float:left;
        margin-top:2px;
    }
    .body .form .input,.body .form .input-group{
        float:left;
        width:300px;
        margin-left:6px;
    }
    .body .form .operate button{
        float:left;
        margin-left:36px;
    }

    .body .form .operate a{
        float:left;
        display:inline-block;
        line-height:33px;
        margin-left:20px;
        color:#000;
        /*font-weight:bold;*/
    }
</style>
