_footer-tab.css 1.22 KB
.footer-tab {
    position: fixed;
    left: 50%;
    bottom: 0;
    margin-left: -320px;
    width: 100%;
    height: 100px;
    max-width: 640px;
    padding-top: 20px;
    box-sizing: border-box;
    background: #fff;
    border-top: 1px solid #b0b0b0;
    z-index: 3;

    .tab-item {
        float: left;
        width: 20%;
        text-align: center;
        color: #b0b0b0;

        &.current.boys {
            color: #414141;
        }

        &.current.girls {
            color: #ff88ae;
        }

        &.current.kids {
            color: #7ad9f9;
        }

        &.current.lifestyle {
            color: #4f4138;
        }
    }

    .tab-icon {
        font-size: 40px;
        line-height: 1;
    }

    .tab-name {
        margin-top: 10px;
        font-size: 20px;
        line-height: 1;
    }
}

.boys-wrap {
    .footer-tab {
        .tab-item.current {
            color: #414141;
        }
    }
}

.girls-wrap {
    .footer-tab {
        .tab-item.current {
            color: #ff88ae;
        }
    }
}

.kids-wrap {
    .footer-tab {
        .tab-item.current {
            color: #7ad9f9;
        }
    }
}

.lifestyle-wrap {
    .footer-tab {
        .tab-item.current {
            color: #4f4138;
        }
    }
}