tourism-wxapp/nova-tourism/pages/my/my-card/index.less

/* nova-tourism/pages/my/my-card/index.wxss */
.all {
    width: 100vw;
    padding-left: 42rpx;
    overflow-y: scroll;
    font-family: 'NotoSans-Bold-5', sans-serif;
    color: #382E2E;
        //选中
        @font-face {
            font-family: 'NotoSans-Bold-5';
            src: url('../../styles/font/Noto-sans/NotoSans-Bold-5.ttf'); /* 字体文件路径 */
        }
        //为选中
        @font-face {
            font-family: 'NotoSans-Regular-2';
            src: url('../../styles/font/Noto-sans/NotoSans-Regular-2.ttf'); /* 字体文件路径 */
        }
        
        .tab-bar {
            display: flex;
            justify-content: space-around;
            margin-top: 28rpx;
            font-family: 'NotoSans-Regular-2', sans-serif;
          }
          
          .tab-item {
            padding: 10rpx 0;
            text-align: center;
            position: relative;
            color: #969696;
            font-size: 28rpx;
            font-weight: 400;
          }
          
          .tab-item.active {
            position: relative;
            color: #67806A;
            font-size: 32rpx;
            font-weight: 500;
            font-family: 'NotoSans-Bold-5', sans-serif;
          }
          
          .tab-item.active::after {
            content: "";
            width: 64rpx;
            position: absolute;
            left: calc(50% - 32rpx); 
            right: calc(50% - 32rpx); 
            bottom: 0;
            height: 6rpx;
            background-color: #67806A;
            border-radius: 4rpx;
            
          }
    .cardbox{
        width: 100%;
        margin-top: 30rpx;
        .picbox{
            width: 100%;
            height: 80rpx;
            display: flex;
            align-items: center;
            .image{
                width: 56rpx;
                height: 56rpx;
            }
            .tex{
                font-size: 28rpx;
                margin-left: 30rpx;
            }
        }
        .card{
            width: 584rpx;
            height: 148rpx;
            margin-left: 74rpx;
            background-image: url(https://file-cloud.fmode.cn/EbxZUK5lBI/20241122/d6k1uh050505973.png);
            background-position: center; /* 背景图片居中 */
            background-size: cover; /* 背景图片覆盖整个元素 */
            background-repeat: no-repeat; /* 不重复背景图片 */
            display: flex;
            align-items: center;
            margin-bottom: 20rpx;
            .car{
                width: 584rpx;
                height: 148rpx;
                display: flex;
                align-items: center;
                .numbox{
                    width: 150rpx;
                    display: flex;
                    justify-content: center;
                    align-items: flex-end;
                    .num{
                        font-size: 48rpx;
                        color: #F73C2C ;
    
                    }
                    .num-tex{
                        font-size: 24rpx;
                        color: #F73C2C;
                        margin-bottom: 6rpx;
                        margin-left: 4rpx;
                    }
                }  
                .textbox{
                    height: 80rpx;
                    margin-left: 40rpx;
                    .text1{
                        font-size: 24rpx;
                    }
                    .text2{
                        font-size: 20rpx;
                        margin-top: 6rpx;
                        color: #A9A398;
                    }
                } 
                .bottom{
                    width: 146rpx;
                    height: 48rpx;
                    border-radius: 15rpx;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    margin-left: 20rpx;
                    color: white;
                    background-color: #F1A561;
                    font-size: 24rpx;
                }

            }
        }
    }
}