TakeOutShop/pages/user/style.scss
2025-04-09 20:46:57 +08:00

191 lines
4.1 KiB
SCSS

page{
background-color: #f6f6f6;
}
.mian{
background: url('https://zhkj1.oss-cn-shanghai.aliyuncs.com/zhscMerchant/user_bcg.png');
background-repeat: no-repeat; /* 防止重复 */
background-size:100%;
.head{
.head_user_message{
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 35rpx 0 35rpx;
.head_user_message_l{
display: flex;
align-items: center;
.head_user_message_photo{
width: 119rpx;
height: 112rpx;
border-radius: 100rpx;
background-color: #666666;
overflow: hidden;
.head_user_message_photo_img{
width: 112rpx;
height: 112rpx;
display: block;
}
}
.head_user_message_text{
margin-left: 20rpx;
.head_user_message_name{
color: #333333;
font-size: 32rpx;
font-weight: 500;
}
.head_user_message_desc{
color: #666666;
font-size: 26rpx;
display: flex;
align-items: center;
margin-top: 10rpx;
.head_user_message_desc_img{
width: 33rpx;
height: 33rpx;
display: block;
}
}
}
}
.head_user_message_set{
width: 45rpx;
height: 45rpx;
display: block;
}
}
}
.user_account{
margin: 50rpx 30rpx 0 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #FFFFFF;
border-radius: 20rpx;
padding: 40rpx;
// box-shadow: 0 4rpx 8rpx rgba(0,0,0,.05);
position: relative;
.user_account_li{
display: flex;
align-items: center;
.user_account_message{
width: 180rpx;
.user_account_amount{
color: #E60703;
font-size: 40rpx;
text-align: center;
font-weight: 500;
}
.user_account_name{
color: #000000;
font-size: 28rpx;
text-align: center;
}
}
.user_account_img{
width: 80rpx;
height: 80rpx;
-webkit-animation: 3s scaleDr ease-in-out infinite;
animation: 3s scaleDr ease-in-out infinite;
}
}
.user_account_border{
background-color: #D9D9D9;
height: 76rpx;
width: 1rpx;
}
.user_account_tag{
width: 100rpx;
position: absolute;
top: 15rpx;
left: 120rpx;
-webkit-animation: 3s scaleDr ease-in-out infinite;
animation: 3s scaleDr ease-in-out infinite;
.user_account_tag_num{
width: 100%;
height: 29rpx;
background: linear-gradient( 90deg, #FF745F 0%, #FF485C 100%);
border-radius: 15rpx 15rpx 15rpx 15rpx;
font-size: 18rpx;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
}
.user_account_tag_j{
width: 0;
height: 0;
border-left: 0rpx solid transparent;
border-right: 20rpx solid transparent;
border-top: 11rpx solid #FF745F;
margin-left: 18px;
margin-top: -1rpx;
}
}
}
.user_cont_list{
margin: 30rpx 30rpx 0 30rpx;
display: flex;
overflow: hidden;
flex-wrap: wrap;
background-color: #FFFFFF;
border-radius: 20rpx;
// box-shadow: 0 4rpx 8rpx rgba(0,0,0,.05);
.user_cont_li{
width: 20%;
box-sizing: border-box;
padding: 30rpx 0rpx 30rpx 0rpx;
.user_cont_li_img{
margin: 0 auto;
display: block;
width: 58rpx;
height: 58rpx;
}
.user_cont_li_name{
margin-top: 10rpx;
font-size: 26rpx;
color: #666666;
text-align: center;
}
}
.user_cont_li_left_boder{
// box-shadow: -10rpx 0 10rpx -5rpx rgba(244, 244, 244, 0.8); /* 左边框阴影 */
background-image: url("../../static/order/2168_03.jpg");
background-repeat: no-repeat; /* 防止重复 */
background-position: left center; /* 水平靠左,垂直居中 */
background-size: auto 100%; /* 宽度自适应,高度填满 */
}
}
.price::before {
content: '¥';
font-size: 24rpx;
margin-right: 5rpx;
}
.prices::before {
content: '¥';
font-size: 20rpx;
margin-right: 5rpx;
margin-left: 5rpx;
}
.market_name{
color: #999999;
font-size: 23rpx;
text-decoration: line-through;
margin-left: 5rpx;
font-weight: 400;
}
@keyframes scaleDr{
0% {
transform: scale(0.98);
}
25% {
transform: scale(1.05);
}
50% {
transform: scale(1);
}
75% {
transform: scale(1.05);
}
}
// 结束
}