@import '@mobile/assets/themes/base/mixin.less';

.home-main {
    &__header {
        background: linear-gradient(var(--navbar-background), var(--navbar-background) 60%, transparent 60%);
        padding: .2rem;
    }

    &__banner {
        .van-swipe {
            background-color: #ddd;

            &-item {
                font-size: 0;

                img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
            }
        }

        &--header {
            margin-top: .28rem;

            .van-swipe {
                min-height: 3rem;
                border-radius: .1rem;
                box-shadow: 0 0 .12rem .02rem rgba(0, 0, 0, .35);

                &-item {
                    height: 3rem;
                }
            }
        }

        &--body {
            .van-swipe {
                min-height: 1.5rem;
                border-radius: .1rem;

                &-item {
                    height: 1.5rem;
                }
            }
        }
    }

    &__iconbar {
        ul {
            display: flex;
            flex-wrap: wrap;
            padding-top: .24rem;

            &:last-child {
                padding-bottom: .24rem;
            }

            li {
                display: flex;
                flex-direction: column;
                align-items: center;
                width: calc(~'100% / 3');
                text-align: center;

                img {
                    width: .76rem;
                    height: .76rem;
                }

                span {
                    font-size: .24rem;
                    margin-top: .04rem;
                }
            }
        }
    }

    &__market {
        .scrollbar {
            width: 100%;
            padding: .2rem;

            &-title {
                display: flex;
                align-items: center;
                margin-bottom: .12rem;

                img {
                    width: .28rem;
                    height: .28rem;
                    margin-right: .08rem;
                }

                span {
                    font-size: .28rem;
                    font-weight: bold;

                    +span {
                        color: #999;
                        font-size: .26rem;
                        font-weight: normal;
                        margin-left: .1rem;
                    }
                }
            }
        }

        .van-swipe {
            height: 32px;
            background-color: #f6f6f6;

            ul {
                display: flex;
                justify-content: space-around;
                align-items: center;
                height: inherit;
                font-size: .26rem;
            }
        }
    }

    &__news {
        .titlebar {
            &-title {
                display: flex;
                align-items: center;
                font-size: .32rem;
                font-weight: bold;

                img {
                    width: .32rem;
                    height: .32rem;
                    margin-right: .1rem;
                }
            }

            &-more {
                color: #666;
            }
        }

        .article {
            &-item {
                &__title {
                    span {
                        .mixin-text-overflow()
                    }
                }

                &__time {
                    flex: initial;
                    font-size: .24rem;
                    margin-left: .48rem;
                }
            }
        }
    }
}