TakeOutShop/shopProDetail/evallist/style.scss
2025-03-30 16:51:16 +08:00

262 lines
5.2 KiB
SCSS

page{
background-color: #f6f6f6;
}
.mian{
.head{
background-color: #FFFFFF;
padding: 0 20rpx 20rpx 20rpx;
flex-wrap: wrap;
display: flex;
border-bottom: 1rpx solid #f6f6f6;
.eval_tag{
font-size: 23rpx;
color: #333333;
background-color: #F5F6FA;
border: 1rpx solid #F5F6FA;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50rpx;
padding: 10rpx 22rpx 10rpx 22rpx;
box-sizing: border-box;
margin: 20rpx 0rpx 0 20rpx ;
.eval_tag_img{
width: 28rpx;
height: 28rpx;
display: block;
margin-right: 10rpx;
}
}
.eval_tag text{
font-size: 23rpx;
color: #999999;
margin-left: 10rpx;
}
.eval_tag_active{
background: #FFD7D7;
border: 1px solid #FFA0A0;
color: #FF5D5D;
}
.eval_tag_active text{
color: #FF5D5D;
}
}
.eval_item{
margin-top: 10rpx;
background-color: #FFFFFF;
margin: 20rpx 20rpx 0 20rpx;
border-radius: 16rpx;
overflow: hidden;
box-shadow: 0 4rpx 8rpx rgba(0,0,0,.05);
.eval_item_top{
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 23rpx 0 23rpx;
height: 79rpx;
background-color: #FFFFFF;
.eval_item_l{
display: flex;
align-items: center;
.eval_item_userimg{
width: 50rpx;
height: 50rpx;
border-radius: 50rpx;
background-color: #f6f6f6;
display: block;
}
.eval_item_username{
color: #000000;
font-size: 26rpx;
margin-left: 10rpx;
}
.eval_item_userdesc{
width: 95rpx;
height: 34rpx;
background: #FFF4CD;
border-radius: 4rpx;
border: 1px solid #F9D448;
font-size: 22rpx;
color: #D0AA1B;
display: flex;
align-items: center;
justify-content: center;
margin-left: 10rpx;
}
.eval_item_usertext{
margin-left: 10rpx;
display: flex;
align-items: center;
width: 95rpx;
height: 37rpx;
background: linear-gradient( 90deg, #FAEAD3 0%, #FED4AE 100%);
border-radius: 4rpx;
color: #745030;
font-size: 22rpx;
display: flex;
align-items: center;
justify-content: center;
.eval_item_usertext_img{
width: 23rpx;
height: 23rpx;
display: block;
margin-right: 5rpx;
}
}
}
}
.eval_item_text{
padding: 20rpx;
font-size: 27rpx;
color: #333333;
}
.eval_item_ul{
display: flex;
flex-wrap: wrap;
.eval_item_li{
width: 155rpx;
height: 155rpx;
border-radius: 8rpx;
margin-left: 20rpx;
margin-bottom: 20rpx;
}
.eval_item_li image{
width: 155rpx;
height: 155rpx;
border-radius: 8rpx;
display: block;
}
}
.eval_item_bottom{
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20rpx 20rpx 20rpx;
.eval_item_time{
font-size: 26rpx;
color: #999999;
}
.eval_item_numa{
display: flex;
font-size: 26rpx;
color: #999999;
align-items: center;
}
.eval_item_numa image{
width: 28rpx;
height: 28rpx;
display: block;
margin-right: 10rpx;
}
}
}
.footer{
position: fixed;
z-index: 998;
left: 0;
transform: translate3d(0, -100%, 0);
width: 100%;
top: 100%;
background: #FFFFFF;
padding-bottom: env(safe-area-inset-bottom);
padding-top: 20rpx;
border-top: 1rpx solid #F2F2F2;
.footer_cont{
padding-right: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
.footer_l{
display: flex;
align-items: center;
justify-content: space-between;
.footer_li{
width: 90rpx;
.footer_icon{
margin: 0 auto;
width: 50rpx;
height: 50rpx;
position: relative;
.footer_amount{
position: absolute;
right: -10rpx;
top:-10rpx;
width: 30rpx;
height: 30rpx;
border-radius: 50rpx;
background-color: #FF3135;
font-size: 18rpx;
color: #FFFFFF;
z-index: 2;
display: flex;
align-items: center;
justify-content: center;
}
.footer_icon_img{
width: 50rpx;
height: 50rpx;
display: block;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
}
.footer_name{
font-size: 20rpx;
color: #666666;
text-align: center;
}
}
}
.footer_r{
width:75%;
display: flex;
align-items: center;
justify-content: space-between;
.footer_btn{
width: 50%;
height: 75rpx;
font-size: 27rpx;
color: #9b5c1f;
background-color: #fbe7cf;
display: flex;
align-items: center;
justify-content: center;
font-weight: 500;
}
.footer_btn_bcg{
color: #FFFFFF;
background-color: #FD3F3F;
}
.border_l{
border-radius: 50rpx;
margin-right: 20rpx;
// border-top-left-radius: 20rpx;
// border-bottom-left-radius: 20rpx;
}
.border_r{
border-radius: 50rpx;
// border-top-right-radius: 20rpx;
// border-bottom-right-radius: 20rpx;
}
}
}
}
.price::before {
content: '¥';
font-size: 24rpx;
margin-right: 5rpx;
}
.prices::before {
content: '¥';
font-size: 20rpx;
margin-right: 5rpx;
margin-left: 5rpx;
}
}