carInsightSystem_wxapp/pages/index/Salesranking/Salesranking.wxss

/* pages/index/Salesranking/Salesranking.wxss */
.dropdown-menu {
    box-shadow: 0 0 0 !important;
}
dropdown-menu1{
    z-index: 1001;
}

.detail-page {
    position: relative;
}

.van-dropdown-menu__item {
    border: 1px solid #F9F9F9;
    position: relative;
    margin: 10rpx;
}

.menu-tabs .van-tabs__nav {
    background-color: #ffffff;
    /* 标签背景颜色 */
}

.menu-tabs .van-tab {
    color: #999999;
    /* 字体颜色 */
    background-color: #FFFFFF;
    /* 标签背景颜色 */
}

.menu-tabs .van-tab--active {
    color: #027AFF;
    /* 字体颜色 */
    font-size: 32rpx;
}

.menu-tabs .van-tabs__line {
    background: transparent;
}

.box_title1 {
    color: #000;
    width: 150rpx;
    height: 60rpx;
    line-height: 60rpx;
    font-size: 24rpx;
    text-align: center;
    border: 1rpx solid #F9F9F9;
}

.color6 {
    color: #000;
    font-size: 24rpx;
}

.timeIcon {
    color: #666;
    font-size: 18rpx;
    left: 5rpx;
}

/* 排行榜 */
.list_event {
    margin: 24rpx 32rpx;
    width: 93%;
    border-radius: 8rpx;
    background-color: #ffffff;

}

.list_event .text {
    font-size: 36rpx;
    padding: 32rpx 32rpx 0 32rpx;
}

.tubiao {
    height: 1000rpx;
    width: 100%;
}

.ranking {
    width: 654rpx;
    display: flex;
    padding: 32rpx 32rpx 0 32rpx;
}

.ranks {
    width: 654rpx;
    height: 98rpx;
    line-height: 48rpx;
    padding: 0rpx 32rpx;
    margin: 30rpx 0;

}

.ptitle {
    width: 22%;
    font-size: 24rpx;
    color: #999999;
}

.xtitle2 {
    width: 48%;
    font-size: 24rpx;
    color: #999999;
    display: flex;
    flex-direction: row-reverse
}

.dis_image {
    width: 22%;
    font-size: 28rpx;
    height: 104rpx;
    color: #999999;
    line-height: 104rpx;
    display: flex;
    align-items: center;
}

.rank_num {
    width: 53rpx;
    height: 48rpx;
    line-height: 48rpx;
}

.num {
    height: 104rpx;
    color: #999999;
    line-height: 104rpx;

}

.medias {
    width: 40%;
}

.media_text {
    font-size: 28rpx;
}

.energy {
    margin: 0 20rpx;
    font-size: 20rpx;
    color: #20CC62;
    background: #F0FFF6;

}

.energy1 {
    margin: 0 20rpx;
    font-size: 20rpx;
    color: #0084FF;
    background: #F2F9FF;
}

.energy2 {
    margin: 0 20rpx;
    font-size: 20rpx;
    color: #FF6E25;
    background: #FFF5F0;
}

.energy3 {
    margin: 0 20rpx;
    font-size: 20rpx;
    color: #00D6D6;
    background: #F0FFFF;
}

.energy4 {
    margin: 0 20rpx;
    font-size: 20rpx;
    color: #7257FF;
    background: #F4F2FF;
}

.price {
    font-size: 24rpx;
    color: #ff4852;
}

.volume {
    font-size: 28rpx;
    font-weight: 600;
    text-align: right;
    flex-direction: row-reverse;
}

.trend {
    font-size: 24rpx;
    display: flex;
    text-align: right;
    flex-direction: row-reverse;
    color: #0084FF;
}


/* 弹出框 */
.brand_tu {
    /* position: relative; */
    width: 100%;
    height: 420rpx;
    text-align: center;
}

.qushi {
    /* position:absolute; */
    width: 100%;
    height: 80rpx;
    line-height: 80rpx;
    text-align: center;
    margin-left: 50rpx;
    font-size: 34rpx;

}

.tubiao {
    width: 100rpx;
    height: 80rpx;
    line-height: 80rpx;
    text-align: center;
    font-size: 34rpx;

}

.pinlai {
    height: 40rpx;
    line-height: 40rpx;
    font-size: 28rpx;
    color: #333333;
    margin: 0 32rpx;

}

/* 顶部 */
.top text {
    font-size: 24rpx;
}

.top .timeIcon {
    color: #666;
    font-size: 18rpx;
}

.top {
    /* height: 60rpx; */
    font-size: 24rpx;
    display: inline-block;
    margin: 0 16rpx;
    /* align-items: baseline; */

}

.all1 {
    width: 150rpx;
    height: 60rpx;
    line-height: 60rpx;
    border: 1rpx solid #027AFF;
    padding: 0 10rpx;
    background-color: #ffffff;
    font-size: 24rpx;
    text-align: center;
    color: #027AFF;
    margin: 0 auto;
}
.box_title {
    color: #000;
    width: 150rpx;
    height: 60rpx;
    line-height: 60rpx;
    font-size: 24rpx;
    text-align: center;
    border: 1rpx solid #F9F9F9;
}

.noall {
    width: 150rpx;
    height: 60rpx;
    line-height: 60rpx;
    text-align: center;
    /* display: flex; */
    /* align-items: center;
    justify-content: space-between; */
    border: 1rpx solid #f9f9f9;
    padding: 0 10rpx;
    background-color: #ffffff;
    font-size: 24rpx;
    color: #333333;
}

/* 下拉内容 */
van-dropdown-item van-dropdown-item--down {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.select_box {
    background-color: #fff;
    /* padding: 0 20rpx; */
    width: 100%;
    float: inline-end;
    /* position: relative; */
    right: 0;
    z-index: 99;
    overflow: hidden;
    text-align: center;
    animation: myfirst 0.5s;
    font-size: 24rpx;
}

.select_one {
    padding-left: 20rpx;
    width: 100%;
    height: 60rpx;
    /* position: relative; */
    line-height: 60rpx;
}

/* 下拉过度效果 */
@keyframes myfirst {
    from {
        height: 0rpx;
    }

    to {
        height: 210rpx;
    }
}

.loading {
    position: relative;
    bottom: 5rpx;
    padding: 10rpx;
    text-align: center;
    font-size: 12px;
}

.all {
    background: #027AFF;
    width: 72rpx;
    height: 72rpx;
    line-height: 72rpx;
    color: #ffffff;
    font-size: 24rpx;
    text-align: center;
    border-radius: 50rpx;
}

.jb-item {
    font-size: 20rpx;
    height: 30px;
    line-height: 30px;
}

.show {
    display: none;
}

.is_show {
    display: block;
}

/* 筛选项 */
.filter {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
.more-item {
    width: 296rpx;
    height: 72rpx;
    margin: 16rpx;
    background: #F9F9F9;
    text-align: center;
    line-height: 72rpx;
    font-size: 12px;
    color: #111111;
}
.more-item-active {
    width: 296rpx;
    height: 72rpx;
    margin: 16rpx;
    background: #F0F5FF;
    text-align: center;
    line-height: 72rpx;
    font-size: 12px;
    color: #0084FF;
}