_footer.scss 2.57 KB
/*
 * @description: footer css
 * @author: chenglong.wang@yoho.cn
 * @date: 2015/4/16
 */

.girl-footer {
    width: $footer-width;
    height: $footer-height;
    background: $color-footer;
    margin-top: 28px;
    overflow: hidden;
    text-align: center;

    .come-back {
        font-size: 1.4rem;
        display: block;
        width: 100%;
        height: 33px;
        line-height: 33px;
        color: #000;
        font-weight: bold;
        text-decoration: underline;
        border-top: 1px solid #dcdcdc;
        border-bottom: 1px solid #dcdcdc;
    }

    .login-language {
        margin: 20px 15px 10px 15px;
        color: #333;
        font-size: 1.4rem;
        height: auto;
        overflow: hidden;

        .login {
            float: left;
        }

        > a {
            padding: 0 6px;
            float: right;
        }

        .language {
            border-right: 1px solid #000;
        }
    }

    .info {
        font-size: 1.4rem;
        width: 85%;
        margin: 0 auto;
        color: #333;
        text-align: center;
        height: auto;
        overflow: hidden;

        li {
            width: 25%;
            float: left;
            margin-top: 14px;
            border-right: 1px solid #333;
            @include box-sizing();

            &:nth-last-of-type(1) {
                text-align: left;
                padding-left: 5px;
                width: 50%;
                border: none;
            }

            &:nth-last-of-type(2) {
                text-align: right;
                padding-right: 5px;
                width: 50%;
            }

            &:nth-of-type(4) {
                border: none;
            }
        }
    }

    > p {
        color: #999;
        width: 85%;
        margin: 10px auto 68px auto;
        line-height: 18px;
        font-size: 1.2rem;
    }

}

#share {
    height: 0;
    position: relative;

    .share-main {
        width: 320px;
        height: 50px;
        margin: 0 auto;
        position: fixed;
        bottom: 0;
        z-index: 2000;
        @include background-image(linear-gradient(hsla(100, 100%, 100%, 0), hsla(100, 100%, 100%, 1)));
    }

    ul {
        height: 50px;
    }

    li {
        float: left;
        margin: 0 16px;
        @each $i, $val in (1: sina, 2: qq, 3: facebook, 4: twitter) {
            &:nth-of-type(#{$i}) {
                a {
                    @include retina-sprite($icons, circle-#{$val});
                }
            }
        }
    }
}