kede-client/js/component/certify/certify.less

        .wrap {
            width: 100%;
            margin: 0 auto;
            background: #ffffff;
            .certify-header {
                background: #f8f8f8;
                width: 100%;
                .certify-logo {
                    width: 100%;
                    margin: 0 auto;
                    padding: 10px 0;
                    .logo {
                        width: 180px;
                        padding-top: 60px;
                        float: left;
                        margin-left: 4%;
                        position: relative;
                        overflow: hidden;
                        img {
                            position: absolute;
                            top: 0;
                            right: 0;
                            height: 60px;
                        }
                    }
                    .certify-text {
                        width: 80%;
                        float: left;
                        line-height: 60px;
                        font-size: 24px;
                        margin-left: 20px;
                        .text {
                            border-left: 1px solid #999999;
                        }
                        .alink {
                            float: right;
                            font-size: 14px;
                            line-height: 60px;
                            a {
                                color: #333;
                                padding: 0 8px;
                                border-left: 1px solid #999999;
                                &:first-child {
                                    border: none;
                                }
                            }
                        }
                        span {
                            padding-left: 20px;
                        }
                    }
                }
            }
            .certify-content {
                min-height: 300px;
                margin-bottom: 100px;
                .certify-step {
                    width: 880px;
                    height: 60px;
                    margin: 40px auto;
                    border-radius: 8px;
                    background: #c1c1c1;
                    overflow: hidden;
                    >div {
                        width: 150px;
                        height: 60px;
                        display: table;
                        color: #fff;
                        float: left;
                        padding: 0 22px 0 10px;
                        >div {
                            vertical-align: middle;
                            display: table-cell;
                            font-size: 15px;
                        }
                        &:first-child {
                            padding-left: 6px;
                        }
                        &:last-child {
                            width: 130px;
                            background-image: none;
                        }
                        >i {
                            margin-top: 17px;
                            display: inline-block;
                            height: 26px;
                            width: 26px;
                            border-radius: 50%;
                            background: #fff;
                            overflow: hidden;
                            text-align: center;
                            line-height: 26px;
                            font-size: 20px;
                            font-style: normal;
                        }
                    }
                    .step-done {
                        background: #ff6500;
                        background-image: url(../../../image/scd.png);
                        background-repeat: no-repeat;
                        background-position-x: right;
                        background-size: 22px;
                        >i {
                            color: #ff6500;
                        }
                    }
                    .step-doing {
                        background: #ff8a33;
                        background-image: url(../../../image/trd.png);
                        background-repeat: no-repeat;
                        background-position-x: right;
                        background-size: 22px;
                        >i {
                            color: #ff8a33;
                        }
                    }
                    .step-off {
                        background: #ff6500;
                        background-image: url(../../../image/fst.png);
                        background-repeat: no-repeat;
                        background-position-x: right;
                        background-size: 22px;
                        >i {
                            color: #ff6500;
                        }
                    }
                    .step-none {
                        background: #c1c1c1;
                        background-image: url(../../../image/none.png);
                        background-repeat: no-repeat;
                        background-position-x: right;
                        background-size: 22px;
                        >i {
                            color: #c1c1c1;
                        }
                    }
                    .step-last {
                        background: #c1c1c1;
                        width: 130px;
                        >i {
                            color: #c1c1c1;
                        }
                    }
                }
                .certify-form-box {
                    width: 600px;
                    margin: 0 auto;
                    .certify-form {
                        #address {
                            select {
                                height: 32px;
                                border: 1px solid #d9d9d9;
                                border-radius: 4px;
                                margin-right: 6px;
                            }
                        }
                        .ant-form-explain {
                            span {
                                line-height: 26px;
                            }
                        }
                        .idCard-text {
                            display: inline-block;
                            width: 150px;
                            margin-right: 20px;
                            text-align: center;
                        }
                        .idcard-img {
                            >div {
                                float: left;
                                background: #c9c9c9;
                                margin-right: 20px;
                                >.idcard-imgbox {
                                    width: 142px;
                                    height: 90px;
                                    padding-top: 90px;
                                    position: relative;
                                    img {
                                        width: 142px;
                                        height: 90px;
                                        position: absolute;
                                        top: 0;
                                        left: 0;
                                        border: 1px solid #c9c9c9;
                                        border-radius: 6px;
                                    }
                                }
                            }
                        }
                        .getVcode {
                            height: 32px;
                            width: 100%;
                            padding-top: 32px;
                            position: relative;
                            overflow: hidden;
                            img {
                                position: absolute;
                                top: 0;
                                left: 0;
                                width: 100%;
                                height: 32px;
                            }
                        }
                        .set-submit {
                            min-width: 100px;
                        }
                        .exit {
                            width: 160px;
                            margin-left: 20px;
                            color: #fff;
                            background: #ff6500;
                            border: none;
                        }
                        .ant-form-item-label {
                            >label {
                                &:before {
                                    content: ''
                                }
                            }
                        }
                        .certify-title {
                            font-size: 20px;
                        }
                        .fromItem-postfix {
                            position: absolute;
                            margin-left: 10px;
                        }
                    }
                    .certify-result-box {
                        .certify-title {
                            font-size: 20px;
                        }
                        .certify-result-state {
                            position: relative;
                            padding-left: 46px;
                            margin: 20px auto;
                            width: 400px;
                            i {
                                color: #58a3ff;
                                text-align: center;
                                line-height: 40px;
                                font-size: 32px;
                                position: absolute;
                                top: 6px;
                                left: 0;
                            }
                            p {
                                line-height: 40px;
                            }
                            button {
                                margin-top: 10px;
                            }
                        }
                    }
                    .avatar-uploader,
                    .avatar-uploader-trigger,
                    .avatar {
                        width: 150px;
                        height: 150px;
                    }
                    .avatar-uploader {
                        display: block;
                        padding: 1px;
                        border: 1px dashed #d9d9d9;
                        border-radius: 6px;
                        cursor: pointer;
                        position: relative;
                        img {
                            position: absolute;
                            top: -1px;
                            left: -1px;
                            height: 150px;
                        } //
                        float: left;
                        margin-right: 20px;
                    }
                    .avatar-uploader-trigger {
                        display: table-cell;
                        vertical-align: middle;
                        font-size: 28px;
                        color: #999;
                    }
                }
            }
            .footer {
                position: fixed;
                width: 100%;
                bottom: 0;
                padding: 10px 0;
                text-align: center;
                background: #f0f0f0;
                p {
                    line-height: 24px;
                }
            }
        }