_login.scss 3.16 KB
.login-page {
    .yoho-log {
        position: absolute;
        height: 31px;
        width: 26px;
        background: image-url('yohofamily/yoho.png');
        background-size: 100% 100%;
        top: 10px;
        left: 15px;
    }

    .op-container {
        position: relative;
        width: 100%;
        margin: 20px 0;
        text-align: left;
        font-size: 16px;

        .go-register {
            text-decoration: underline;
            color: #858585;
        }

        .forget-pwd {
            position: absolute;
            right: 0;
            text-decoration: underline;
            color: #858585;
        }
    }

    .third-party-login {
        text-align: left;

        > span {
            font-size: 16px;
            color: #858585;
        }

        .tp-link {
            text-align: center;
            padding: 20px 0;

            > a {
                display: inline-block;
                width: 44px;
                height: 44px;
                margin: 0 7px;
                @include border-radius(50%);
                background-color: #333;
                background-repeat: no-repeat;
                background-size: 100% 100%;
            }

            .alipay {
                background-image: image-url('yohofamily/alipay.png');
            }

            .weibo {
                background-image: image-url('yohofamily/weibo.png');
            }

            .weixin {
                background-image: image-url('yohofamily/weixin.png');
            }

            .qq {
                background-image: image-url('yohofamily/qq.png');
            }
        }
    }

    .interational {
        display: block;
        width: 200px;
        padding: 5px 10px;
        background-color: #333;
        border: none;
        border-radius: 20px;
        margin: 0 auto;
        font-size: 16px;
        color: #d8d8d8;
    }

    .login-tip {
        font-size: 16px;
        position: relative;
        color: #d8d8d8;
        margin: 15px 0;

        .info {
            display: inline-block;
            height: 12px;
            width: 12px;
            background-image: image-url('yohofamily/info.png');
            background-size: 100% 100%;
        }
    }

    .mask {
        position: fixed;
        display: none;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        background-color: rgba(0,0,0,.5);
    }

    .retrive-pwd-ways {
        position: fixed;
        display: none;
        bottom: 5px;
        left: 10px;
        right: 10px;
        font-size: 16px;

        li {
            background-color: #fff;
            width: 100%;
            height: 40px;
            line-height: 40px;
            text-align: center;

            &:nth-child(1) {
                @include border-top-left-radius(5px);
                @include border-top-right-radius(5px);
                border-bottom: 1px solid #9f9f9f;
            }

            &:nth-child(2) {
                @include border-bottom-left-radius(5px);
                @include border-bottom-right-radius(5px);
            }

            &:last-child {
                margin-top: 10px;
                @include border-radius(5px);
            }
        }
    }

}