@charset "utf-8"; $themeColor:#348cf2; //主题色 $assistColor:#00c277;//辅助色 //文本限制一行 @mixin overstepOne{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } //文本限制两行 @mixin overstepTwo{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } //底部公共按钮 .occupied{ height:120upx; } .footer-btn{ position:fixed; bottom:0; left:0; width:100%; z-index:10; .btn{ margin:20upx 30upx; // background: #007aff; background: linear-gradient( 90deg, #50CBA1 0%, #06AEA6 100%), #C1EFEA; font-size:32upx; color:#fff; text-align:center; line-height:90upx; border-radius:50upx; } .btn-blue{ margin:20upx 30upx; // background: #007aff; background: linear-gradient(to right, #59deff, #3e83ea); /*设置按钮为渐变颜色*/ font-size:28upx; color:#fff; text-align:center; line-height:80upx; border-radius:6upx; } } .footer-btn-two{ overflow:hidden; .btn{ float:left; width:50%; margin:0; border-radius:0rpx; } .btn-col{ background: #ccc; } .btn-col1{ background: $assistColor; } } //遮罩 .common-shade{ position:fixed; top:0; left:0; width:100%; height:100vh; background: rgba(0,0,0,0.7); z-index:99; } .bg-ccc{ background: #ccc !important; } // tab切换 .tab-box { width: 80%; display: flex; font-size: 32upx; color: #555555; margin: 0 24upx; .active_tab { font-weight: 800; } .tab-item { width: 40%; .tabBottom { width: 28%; height: 4upx; border-radius: 5px; background-image: linear-gradient(to right, #64E182, #1CA7B2); } } } // 新样式列表 .list-box { margin: 24upx; .detail-box { // margin-top: 10upx; margin-bottom: 24upx; background: #ffffff; border-radius: 20upx; padding: 24upx; } .detail_header { padding: 15upx 0upx; border-bottom: 1px solid #eee; display: flex; flex-direction: row; align-items: center; position: relative; } .detail_header .blueSign { width: 48upx; height: 48upx; } .detail_header .font-tilte { display: inline-block; font-weight: bold; font-size: 18px; color: #333333; margin-left: 16upx; } .detail_header .font-result { display: inline-block; position: absolute; width: 80*2upx; height: 28*2upx; right: 0upx; background: #C1EFEA; border-radius: 15px 15px 15px 15px; font-size: 28upx; color: #0DB0A7; text-align: center; line-height: 28*2upx; } .detail_msg { display: grid; margin-top: 20upx; } .detail_msg .info-item { font-size: 28upx; color: #999999; margin-bottom: 10upx; font-size: 28upx; line-height: 50upx; text { display: inline-block; width: 140upx; } .infoSpan { width: auto; font-size: 28upx; color: #666; float: right; } } .detail_msg .info-item:nth-of-type(6) { padding-bottom: 24upx; border-bottom: 1px solid #EBEFF7; } .detail_msg .info-item:last-child { padding-bottom: 24upx; border-bottom: 0px solid #000; } .comment-btn { margin-top: 24upx; width: 84*2upx; height: 32*2upx; border-radius: 16*2upx; border: 1px solid #0DB0A7; font-size: 28upx; color: #0DB0A7; line-height: 32*2upx; text-align: center; min-width: 140upx; justify-self: end; } .bg-ccc { border-color: #CACACA; color: #CACACA; background-color: #fff !important; } } // 上传图片样式 .img-box { overflow: hidden; padding-top: 20rpx; padding-bottom: 10rpx; .img-item { float: left; width: 67*2upx; height: 67*2upx; background: #E6E8EE; border-radius: 5*2upx; // margin: 0 20upx 20upx 0upx; position: relative; display: flex; align-items: center; justify-content: center; .img { display: block; width: 100%; height: 100%; } .remove-btn { position: absolute; top: -18upx; right: -18upx; width: 44upx; height: 44upx; z-index: 2; } } .upload-btn { .img { width: 60upx; height: 60upx; margin: unset; } } } // 竖杠 带标题 .dateTit { width: 100%; display: flex; align-items: center; // margin-left: 16upx; image { width: 35upx; height: 35upx; margin-right: 10upx; } .leftIcon { width: 8upx; height: 30upx; background-image: linear-gradient(to bottom, #82E7B3, #94B8EF); border-radius: 5px; margin-right: 10upx; } } // 时间搜索框 .search-box { margin-top: 36upx; padding: 24upx; background-color: #fff; border-radius: 20upx; } .searchv { text-align: center; display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .timecenter { display: inline-block; font-size: 24upx; margin-left: 10upx; margin-right: 10upx; color: #555555; line-height: 30upx; // margin-top: 15upx; } .time-data { width: 300upx; height: 60upx; font-size: 28upx; display: inline-block; border: 1px solid #0DB0A7; border-radius: 8upx; color: #555555; line-height: 60upx; } .tj-box { margin-top: 28upx; display: flex; flex-direction: row; align-items: center; }