goods-list.scss 3.36 KB
.goods-page {
    .list-nav {
        border-top: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;

        > li {
            float: left;
            width: 20%;
            height: 66px;
            text-align: center;
            font-size: 23px;
            line-height: 66px;
        }

        .bytouch {
            background: #eee;
        }

        a {
            display: block;
            box-sizing: border-box;
            width: 100%;
            height: 100%;
            color: #999;
        }

        .active > a {
            color: #000;

            .span-test {
                display: inline-block;
                box-sizing: border-box;
                width: auto;
                height: 100%;
            }

            .iconfont {
                color: #999;

                &.cur {
                    color: #000;
                }

                &.drop {
                    color: #000;
                }
            }
        }

        .new .iconfont {
            font-weight: bold;
            transform: scale(0.8);
        }

        .filter .iconfont {
            font-size: 24px;
            transition: transform 0.1 ease-in;
        }

        .filter.active .iconfont {
            transform: rotate(-180deg);
        }

        .icon {
            position: relative;

            i {
                position: absolute;
                font-weight: bold;
                transform: scale(0.8);
            }

            .up {
                top: -22px;
            }

            .down {
                top: -8px;
            }
        }

        .drop {
            font-size: 12PX;
        }
    }

    .drop-list {
        padding-left: 30px;
        position: absolute;
        z-index: 10;
        background: #fff;
        width: 100%;

        li {
            width: 100%;
            height: 88px;
            font-size: 28px;
            color: #b0b0b0;
            line-height: 88px;
            border-bottom: 1px solid #e0e0e0;
        }

        li:last-child {
            border-bottom: none;
        }

        .active {
            color: #444;

            .chose {
                display: inline-block;
                width: 30px;
                height: 22px;
                background-image: url("img/product/chose.png");
                background-size: 100%;
                float: right;
                margin-top: 33px;
                margin-right: 30px;
                background-repeat: no-repeat;
            }
        }
    }

    .no-result {
        margin-top: 320px;
        color: #ccc;
        vertical-align: middle;
        text-align: center;
        font-size: 1.2em;
    }

    .goods-container {
        position: relative;
        padding-top: 8px;
        padding-left: 15px;
        min-height: 640px;
    }

    .new-list {
        width: 100%;
        background-color: #fff;
        font-size: 28px;
        color: #444;
        position: absolute;
        z-index: 5;

        li {
            margin-left: 35px;
            height: 88px;
            line-height: 88px;
            border-bottom: 1px solid #e0e0e0;
            padding-right: 38px;

            &:last-child {
                border-bottom: none;
            }

            &.active {
                background: url("img/product/shop/check.png") no-repeat 94% center;
                background-size: 36px 26px;
            }
        }
    }
}