yuminge-app/yun-min-program-plugin-master/packageD/directSeeding/livePage/livePage.wxss

2012 lines
41 KiB
Plaintext

/* packageD/directSeeding/livePage/livePage.wxss */
page {
width: 100%;
/* height: 100vh; */
}
.backRight {
display: flex;
align-items: center;
margin-right: 14rpx;
}
.backRight van-icon {
display: flex;
align-items: center;
}
.directSeeding {
position: relative;
width: 100%;
background-image: url("https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/livePK_bg.png");
background-size: 100% 100%;
/* height: 100vh; */
}
.directSeeding live-player {
/* width: 100%;
height: 100vh; */
}
.directSeeding .directSeeding_content {
position: absolute;
z-index: 10;
top: 0;
/* left: 0;
right: 0;
bottom: 0; */
}
.directSeeding .directSeeding_content .directSeeding_content_top {
display: flex;
padding-left: 25rpx;
padding-top: 10rpx;
/* justify-content: space-between; */
padding-right: 29rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_top .personal_information {
display: flex;
/* min-width: 295rpx;
min-height: 53rpx; */
align-items: center;
background-color: rgba(0, 0, 0, 0.4);
border-radius: 60rpx;
padding: 11rpx 14rpx;
margin-right: 10rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_top .personal_information .information_left {
width: 48rpx;
height: 48rpx;
background-color: #333;
border: solid 2rpx #f2f2f7;
border-radius: 50%;
margin-right: 8rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_top .personal_information .information_left image {
width: 100%;
height: 100%;
border-radius: 50%;
}
.directSeeding .directSeeding_content .directSeeding_content_top .personal_information .information_center {
margin-right: 3rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_top .personal_information .information_center .top {
font-size: 24rpx;
color: #fff;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 160rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_top .personal_information .information_center .bottom {
font-size: 24rpx;
color: #fff;
min-width: 160rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_top .personal_information .information_right {
width: 84rpx;
height: 42rpx;
background-color: #fff;
border-radius: 21rpx;
font-size: 24rpx;
line-height: 42rpx;
text-align: center;
color: #f10505;
}
.share_message {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
position: absolute;
right: 25rpx;
bottom: 80rpx;
z-index: 14;
}
.share_message .share_message_left {
width: 64rpx;
height: 64rpx;
background-color: rgba(0, 0, 0, 0.4);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 31rpx;
}
.share_message .share_message_left icon {
font-size: 46rpx;
color: #fff;
}
.directSeeding .directSeeding_content .directSeeding_content_center {
display: flex;
justify-content: flex-end;
padding-top: 50rpx;
padding-right: 27rpx;
padding-bottom: 14rpx;
/* margin-bottom: 190rpx; */
}
.directSeeding .directSeeding_content .directSeeding_content_center .preferential_list {
box-sizing: border-box;
/* padding-top: 47rpx; */
/* height: 359rpx; */
width: 170rpx;
/* border: 1px solid #333; */
}
.directSeeding .directSeeding_content .directSeeding_content_center .preferential_list image {
width: 100%;
/* height: 100%; */
}
/* .directSeeding .directSeeding_content .directSeeding_content_center .preferential_list .tilie {
font-size: 28rpx;
color: #6100d4;
text-align: center;
padding-bottom: 20rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_center .preferential_list .li {
height: 54rpx;
line-height: 54rpx;
color: #ed6603;
text-align: center;
font-size: 22rpx;
border-bottom: 1px solid #b4c4db;
margin-left: 12rpx;
margin-right: 12rpx;
} */
.directSeeding .directSeeding_content .directSeeding_content_bottom {
position: absolute;
left: 0;
right: 0;
bottom: 10rpx;
z-index: 5;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .gift_screen {
overflow: hidden;
width: 100%;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .gift_screen .ul {
display: flex;
align-items: center;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .gift_screen .li {
flex-shrink: 0;
display: flex;
align-items: center;
/* min-width: 247rpx; */
min-height: 65rpx;
/* background-color: rgba(0, 0, 0, 0.4); */
border-radius: 32.5rpx;
padding-right: 92rpx;
box-sizing: border-box;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .gift_screen .li .li_left {
width: 65rpx;
height: 65rpx;
background-color: #fff;
border: solid 2rpx #fff;
border-radius: 50%;
margin-right: 6rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .gift_screen .li .li_left image {
width: 65rpx;
height: 65rpx;
border-radius: 50%;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .gift_screen .li .li_right .top {
font-size: 28rpx;
color: #fff;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 168rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .gift_screen .li .li_right .bottom {
font-size: 22rpx;
color: #fff;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .gift_screen {
margin-bottom: 12rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .purchase_tips {
display: flex;
margin-bottom: 17rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .purchase_tips .purchase_tips_content {
margin-left: 25rpx;
height: 44rpx;
overflow-y: auto;
background-color: #d19e1c;
border-radius: 22rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .purchase_tips .purchase_tips_content .li {
min-width: 364rpx;
height: 44rpx;
display: flex;
align-items: center;
color: #fff;
font-size: 24rpx;
padding-left: 14rpx;
padding-right: 14rpx;
}
/* .directSeeding .directSeeding_content .directSeeding_content_bottom .purchase_tips .purchase_tips_content .img {
width: 28rpx;
height: 28rpx;
} */
.directSeeding .directSeeding_content .directSeeding_content_bottom .purchase_tips .purchase_tips_content .buyicon {
display: flex;
align-items: center;
font-size: 30rpx;
margin-right: 4rpx;
}
/* .directSeeding .directSeeding_content .directSeeding_content_bottom .purchase_tips .purchase_tips_content .icon {} */
.directSeeding .directSeeding_content .directSeeding_content_bottom .purchase_tips .purchase_tips_content .name {
max-width: 160rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages {
margin-left: 25rpx;
height: 260rpx;
overflow-y: scroll;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li {
max-width: 552rpx;
min-height: 49rpx;
align-items: center;
background-color: rgba(0, 0, 0, 0.4);
border-radius: 6rpx;
padding: 4rpx 6rpx;
line-height: 40rpx;
display: flex;
flex-wrap: wrap;
color: #fff;
font-size: 28rpx;
margin-bottom: 10rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .text {
/* white-space: pre-wrap; */
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic {
width: 50rpx;
height: 50rpx;
color: #fff;
border-radius: 6rpx;
margin-right: 8rpx;
display: inline-block;
}
.level_tag {
position: absolute;
bottom: 0;
right: 0;
min-width: 22rpx;
height: 22rpx;
border-radius: 11rpx;
font-size: 16rpx;
text-align: center;
line-height: 22rpx;
color: #fff;
}
.level_tag.color_0 {
background-color: #00f3d4;
}
.level_tag.color_1,
.level_tag.color_2 {
background-color: #ffc323;
}
.level_tag.color_3,
.level_tag.color_4 {
background-color: #ff7f29;
}
.level_tag.color_5,
.level_tag.color_6 {
background-color: #ff2c29;
}
.level_tag.color_7,
.level_tag.color_8 {
background-color: #6700f3;
}
.level_tag.color_9,
.level_tag.color_10 {
background-color: #f30061;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic .characteristic_li {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic .img {
width: 40rpx;
height: 40rpx;
border: solid 2rpx #fff;
vertical-align: middle;
border-radius: 50%;
}
.level_tag.color_0 {
background-color: #00f3d4;
}
.level_tag.color_1,
.level_tag.color_2 {
background-color: #ffc323;
}
.level_tag.color_3,
.level_tag.color_4 {
background-color: #ff7f29;
}
.level_tag.color_5,
.level_tag.color_6 {
background-color: #ff2c29;
}
.level_tag.color_7,
.level_tag.color_8 {
background-color: #6700f3;
}
.level_tag.color_9,
.level_tag.color_10 {
background-color: #f30061;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_0 {
background-color: #00f3d4;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_1,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_2 {
background-color: #ffc323;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_3,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_4 {
background-color: #ff7f29;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_5,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_6 {
background-color: #ff2c29;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_7,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_8 {
background-color: #6700f3;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_9,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .characteristic.color_10 {
background-color: #f30061;
}
/* .directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .name {} */
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_0 {
color: #00f3d4;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_1,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_2 {
color: #ffc323;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_3,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_4 {
color: #ff7f29;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_5,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_6 {
color: #ff2c29;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_7,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_8 {
color: #6700f3;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_9,
.directSeeding .directSeeding_content .directSeeding_content_bottom .chat_messages .li .name.color_10 {
color: #f30061;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom {
display: flex;
justify-content: space-between;
margin-right: 30rpx;
position: relative;
z-index: 99;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .left {
display: flex;
padding-top: 16rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .right {
display: flex;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .good {
width: 80rpx;
height: 80rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 40rpx;
border-radius: 50%;
position: relative;
margin-left: 25rpx;
margin-right: 18rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .good .icon-zb_goods {
font-size: 60rpx;
color: #fc7d26;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .good .num {
position: absolute;
top: -4rpx;
right: 0;
background: #6100d4;
border-radius: 50%;
display: flex;
min-width: 36rpx;
height: 36rpx;
justify-content: center;
align-items: center;
font-size: 24rpx;
color: #fff;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_content {
width: 273rpx;
height: 68rpx;
border-bottom: 1px solid #fff;
margin-right: 47rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_content .text {
width: 273rpx;
line-height: 68rpx;
font-size: 32rpx;
color: #fefefe;
padding-left: 4rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chaticon_list {
display: flex;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chaticon_list .li {
margin-right: 48rpx;
position: relative;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chaticon_list .li .top {
width: 64rpx;
height: 64rpx;
background-color: rgba(0, 0, 0, 0.4);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chaticon_list .li .top .iconfont {
color: #fff;
font-size: 40rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chaticon_list .li .top .img {
width: 40rpx;
height: 40rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chaticon_list .bottom {
padding-top: 11rpx;
height: 21rpx;
font-size: 22rpx;
color: #fefefe;
line-height: 21rpx;
text-align: center;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chaticon_list .li.active .top .icon-zb_all_like {
color: #fc7d26;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chaticon_list .li.shownum .num {
position: absolute;
top: -14rpx;
right: -10rpx;
background: #fa0;
border-radius: 50%;
display: flex;
min-width: 36rpx;
height: 36rpx;
justify-content: center;
align-items: center;
font-size: 24rpx;
color: #fff;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chaticon_list .GiftBtn-box {
margin-right: 0;
}
/* .directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .text {} */
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat {
width: 329rpx;
height: 80rpx;
background-color: rgba(0, 0, 0, 0.4);
border-radius: 40rpx;
display: flex;
align-items: center;
padding-left: 10rpx;
font-size: 32rpx;
color: #fff;
margin-right: 30rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat .left {
font-size: 38rpx;
margin-right: 10rpx;
display: flex;
align-items: center;
}
/* .directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat .img {
width: 38rpx;
height: 38rpx;
margin-right: 10rpx;
} */
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat .text {
color: #fefefe;
}
/* .directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat textarea {
flex: 1;
height: 40rpx;
margin-left: 13rpx;
} */
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list {
display: flex;
justify-content: flex-end;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li {
width: 80rpx;
height: 80rpx;
background-color: rgba(0, 0, 0, 0.4);
display: flex;
align-items: center;
justify-content: center;
font-size: 40rpx;
border-radius: 50%;
margin-right: 30rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.showGood {
position: relative;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.showGood .iconfont {
display: flex;
align-items: center;
font-size: 55rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.showGood .num {
position: absolute;
top: -4rpx;
right: 0;
background: #6100d4;
border-radius: 50%;
display: flex;
min-width: 36rpx;
height: 36rpx;
justify-content: center;
align-items: center;
font-size: 24rpx;
color: #fff;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.shownum {
margin-right: 0;
position: relative;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.shownum .num {
position: absolute;
top: -4rpx;
right: 0;
background: #fa0;
border-radius: 50%;
display: flex;
min-width: 36rpx;
height: 36rpx;
justify-content: center;
align-items: center;
font-size: 24rpx;
color: #fff;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li .img {
width: 47rpx;
height: 47rpx;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.li_0 {
background-image:
linear-gradient(
0deg,
#ea650a 0%,
#fed279 100%
),
linear-gradient(
#000,
#000
);
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.li_0 .iconfont {
color: #fff;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.li_1 .iconfont {
color: #f30061;
}
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.li_2 .iconfont {
color: #ffc323;
}
/* .directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li {} */
.directSeeding .directSeeding_content .directSeeding_content_bottom .interaction_bottom .chat_list .li.li_2 {
margin-right: 0;
margin-left: 60rpx;
}
.directSeeding .success_tips {
width: 251rpx;
height: 72rpx;
background-color: rgba(0, 0, 0, 0.4);
border-radius: 36rpx;
color: #fff;
text-align: center;
line-height: 72rpx;
margin: 0 auto;
}
.shade {
position: absolute;
background-color: rgba(0, 0, 0, 0.6);
left: 0;
right: 0;
bottom: 0;
top: 0;
z-index: 10;
}
.chatInput {
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 100rpx;
z-index: 11;
background-color: #f6f6f6;
}
.chatInput .chatInputContent {
display: flex;
height: 100%;
align-items: center;
padding-left: 25rpx;
}
.chatInput .chatInputContent .submit {
width: 127rpx;
height: 70rpx;
background-color: #ee0223;
border-radius: 39rpx;
margin-left: 18rpx;
font-size: 30rpx;
line-height: 70rpx;
text-align: center;
color: #fff;
}
.chatInputContent .cover-input {
width: 538rpx;
height: 78rpx;
background-color: #fff;
border-radius: 10rpx;
padding-left: 17rpx;
}
.chatInputContent .input {
height: 78rpx;
line-height: 78rpx;
}
.sharing_code {
z-index: 11;
width: 500rpx;
height: auto;
/* background-color: #ffffff; */
border-radius: 16rpx;
position: absolute;
left: 50%;
top: 50%;
margin-top: -441rpx;
margin-left: -250rpx;
overflow: visible;
}
.sharing_code .close_icon {
position: absolute;
z-index: 12;
bottom: -121rpx;
left: 50%;
margin-left: -32rpx;
width: 64rpx;
height: 64rpx;
border-radius: 50%;
border: 1px solid #fff;
display: flex;
align-items: center;
justify-content: center;
}
.sharing_code .close_icon .iconfont {
display: flex;
align-items: center;
justify-content: center;
font-size: 40rpx;
color: #fff;
}
.sharing_code .icon_btn {
width: 100%;
position: fixed;
bottom: 80rpx;
left: 0;
/* height: 120rpx; */
background: #fff;
text-align: center;
display: flex;
justify-content: space-around;
}
.sharing_code .icon_btn .box {
width: 50%;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
text-align: center;
padding: 20rpx 0;
position: relative;
}
.sharing_code .icon_btn image {
width: 80rpx;
height: 80rpx;
margin-bottom: 8rpx;
}
.sharing_code .icon_close {
position: fixed;
bottom: 0rpx;
left: 0;
width: 100%;
height: 90rpx;
line-height: 90rpx;
text-align: center;
background: #efefef;
color: #333;
font-size: 32rpx;
}
.anchorman_details {
position: absolute;
z-index: 12;
left: 50%;
top: 50%;
margin-top: -285rpx;
margin-left: -310rpx;
width: 620rpx;
height: 570rpx;
background-color: #fff;
border-radius: 16rpx;
overflow-y: visible;
}
.anchorman_details .photo {
position: absolute;
z-index: 12;
width: 168rpx;
height: 168rpx;
/* margin: auto; */
left: 50%;
top: -84rpx;
margin-left: -84rpx;
background-color: #333;
border: solid 6rpx #fff;
border-radius: 50%;
}
.anchorman_details .photo image {
width: 100%;
height: 100%;
border-radius: 50%;
}
.anchorman_details .name {
padding-top: 104rpx;
font-size: 36rpx;
line-height: 36rpx;
color: #000;
text-align: center;
margin-bottom: 16rpx;
}
.anchorman_details .anchorma_type {
display: flex;
align-items: center;
justify-content: center;
height: 53rpx;
margin-bottom: 70rpx;
}
.anchorman_details .anchorma_type .left {
height: 53rpx;
line-height: 53rpx;
font-size: 28rpx;
color: #000;
margin-right: 15rpx;
}
.anchorman_details .anchorma_type .right {
width: 106rpx;
height: 53rpx;
background-color: #ff7200;
border-radius: 26.5rpx;
line-height: 53rpx;
text-align: center;
color: #fff;
}
.anchorman_details .anchorma_type .right.active {
background-color: #999;
}
.anchorman_details .anchorm_follow {
display: flex;
justify-content: center;
}
.anchorman_details .anchorm_follow .anchorm_follow_left {
margin-right: 26rpx;
}
.anchorman_details .anchorm_follow .anchorm_follow_left,
.anchorman_details .anchorm_follow .anchorm_follow_right {
width: 256rpx;
text-align: center;
}
.anchorman_details .anchorm_follow .top {
font-size: 48rpx;
line-height: 36rpx;
color: #000;
margin-bottom: 34rpx;
}
.anchorman_details .anchorm_follow .center {
font-size: 28rpx;
line-height: 36rpx;
color: #999;
margin-bottom: 43rpx;
}
.anchorman_details .anchorm_follow .bottom {
width: 256rpx;
height: 80rpx;
background-color: #ff7200;
border-radius: 40rpx;
text-align: center;
line-height: 80rpx;
color: #fff;
}
.anchorman_details .anchorm_follow .anchorm_follow_right .bottom {
background-color: #7e02e7;
}
.anchorman_details .close {
z-index: 12;
position: absolute;
top: 26rpx;
right: 31rpx;
width: 28rpx;
height: 28rpx;
}
.anchorman_details .close .img {
width: 100%;
height: 100%;
}
.goods_list {
z-index: 12;
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 627rpx;
padding-top: 38rpx;
background-color: #fff;
overflow-y: scroll;
border-top-left-radius: 15rpx;
border-top-right-radius: 15rpx;
}
.goods_list .close {
position: absolute;
width: 50rpx;
height: 50rpx;
display: flex;
align-items: center;
justify-content: center;
top: 10rpx;
right: 20rpx;
z-index: 15;
}
.goods_list .close .iconfont {
font-size: 30rpx;
}
.goods_list .ul .li {
padding-top: 22rpx;
padding-bottom: 26rpx;
border-bottom: 1px solid #f3f3f4;
margin-left: 25rpx;
margin-right: 25rpx;
display: flex;
}
.goods_list .ul .li .li_left {
width: 157rpx;
height: 158rpx;
background-color: #333;
border-radius: 8rpx;
margin-right: 28rpx;
position: relative;
}
.goods_list .ul .li .li_left .tag {
position: absolute;
left: 0;
top: 0;
color: #fff;
line-height: 33rpx;
text-align: center;
padding-left: 6rpx;
padding-right: 6rpx;
min-width: 45rpx;
height: 33rpx;
background-color: #ff9c00;
border-radius: 7.5rpx 0rpx 7.5rpx 0rpx;
}
.goods_list .ul .li .li_left image {
width: 100%;
height: 100%;
}
.goods_list .ul .li .li_right {
flex: 1;
}
.goods_list .ul .li .li_right .name {
font-size: 28rpx;
line-height: 36rpx;
color: #010101;
white-space: pre-wrap;
height: 108rpx;
/* text-overflow: -o-ellipsis-lastline; */
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.goods_list .ul .li .li_right .bottom {
display: flex;
justify-content: space-between;
align-items: center;
}
.goods_list .ul .li .li_right .bottom .left {
display: flex;
align-items: center;
}
.goods_list .ul .li .li_right .bottom .left .symbol {
font-size: 24rpx;
line-height: 36rpx;
color: #999;
}
.goods_list .ul .li .li_right .bottom .left .num {
font-size: 34rpx;
line-height: 36rpx;
color: #f53c3f;
}
.goods_list .ul .li .li_right .bottom .right {
width: 49rpx;
height: 49rpx;
background-color: #f21a1b;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
}
.goods_list .ul .li .li_right .bottom .right .iconfont {
display: flex;
align-items: center;
font-size: 32rpx;
justify-content: center;
}
/* .goods_list .ul .li .li_right .bottom .right image {
width: 100%;
height: 100%;
} */
.gift_list {
position: absolute;
z-index: 12;
left: 0;
right: 0;
bottom: 0;
/* height: 640rpx; */
background-color: #fff;
border-radius: 20rpx 20rpx 0rpx 0rpx;
padding-bottom: 10rpx;
padding-top: 34rpx;
}
.gift_list .close {
position: absolute;
width: 50rpx;
height: 50rpx;
display: flex;
align-items: center;
justify-content: center;
top: 10rpx;
right: 20rpx;
z-index: 15;
}
.gift_list .close .iconfont {
font-size: 30rpx;
}
.gift_list .contentTop {
overflow-y: auto;
}
.gift_list .gift_list_top {
display: flex;
flex-wrap: wrap;
padding-left: 10rpx;
/* padding-top: 23rpx; */
/* height: 300rpx; */
padding-top: 4rpx;
}
.gift_list .gift_list_top .li {
flex-shrink: 0;
width: 180rpx;
display: flex;
flex-direction: column;
align-items: center;
border: 1px solid #fff;
padding-top: 10rpx;
padding-bottom: 10rpx;
}
.gift_list .gift_list_top .li.active {
border: 1px solid #ff3902;
}
.gift_list .gift_list_top .li .top {
width: 114rpx;
height: 114rpx;
}
.gift_list .gift_list_top .li .top image {
width: 100%;
height: 100%;
}
.gift_list .gift_list_top .li .name {
font-size: 24rpx;
line-height: 36rpx;
color: #000;
padding-bottom: 6rpx;
}
.gift_list .gift_list_top .li .center {
font-size: 20rpx;
line-height: 26rpx;
letter-spacing: 0rpx;
color: #666;
}
.gift_list .gift_list_top .li .bottom {
font-size: 20rpx;
line-height: 26rpx;
letter-spacing: 0rpx;
color: #666;
}
.gift_list .gift_list_bottom {
/* position: absolute;
left: 0;
right: 0;
bottom: 0; */
display: flex;
justify-content: space-between;
padding-left: 31rpx;
padding-right: 26rpx;
padding-top: 10rpx;
height: 130rpx;
align-items: center;
border-top: 1px solid #f6f6f6;
}
.gift_list .gift_list_bottom .gift_list_bottom_left .left_li {
height: 45rpx;
line-height: 45rpx;
display: flex;
align-items: center;
}
.gift_list .gift_list_bottom .gift_list_bottom_left .left_li .left {
width: 30rpx;
height: 30rpx;
border: 1px solid #666;
border-radius: 50%;
margin-right: 7rpx;
}
.gift_list .gift_list_bottom .gift_list_bottom_left .left_li .right {
font-size: 26rpx;
line-height: 30rpx;
color: #000;
}
.gift_list .gift_list_bottom .gift_list_bottom_left .left_li .left.active {
border: 1px solid #f15353;
background: url("https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/goods_finish.png") no-repeat center;
background-size: 100% 100%;
}
.gift_list .gift_list_bottom .gift_list_bottom_right {
width: 160rpx;
height: 59rpx;
background-image:
linear-gradient(
90deg,
#f23a3a 0%,
#f75f30 100%
),
linear-gradient(
#e93534,
#e93534
);
background-blend-mode:
normal,
normal;
/* background-color: #e93534; */
border-radius: 29.5rpx;
text-align: center;
color: #fff;
line-height: 59rpx;
font-size: 36rpx;
}
.marketing_list {
width: 620rpx;
height: 846rpx;
background-color: #fff;
border-radius: 20rpx;
overflow: visible;
}
.marketing_list .marketing_content {
padding-top: 49rpx;
}
.marketing_list .title {
display: flex;
align-items: center;
justify-content: center;
height: 40rpx;
}
.marketing_list .title .left {
display: flex;
align-items: center;
}
.marketing_list .title .left .circle {
width: 20rpx;
height: 20rpx;
background-color: #d56604;
border-radius: 50%;
}
.marketing_list .title .left .line {
width: 105rpx;
height: 4rpx;
background-color: #d56604;
}
.marketing_list .title .name {
line-height: 40rpx;
font-size: 36rpx;
/* color: #ffffff; */
}
.marketing_list .title .right {
display: flex;
align-items: center;
}
.marketing_list .title .right .circle {
width: 20rpx;
height: 20rpx;
background-color: #d56604;
border-radius: 50%;
}
.marketing_list .title .right .line {
width: 105rpx;
height: 4rpx;
background-color: #d56604;
}
.marketing_list .marketing_content .list {
padding-top: 80rpx;
margin-left: 45rpx;
margin-right: 45rpx;
height: 450rpx;
overflow-y: scroll;
margin-bottom: 31rpx;
}
.marketing_list .marketing_content .list .li {
background-color: #ff7800;
padding-top: 8rpx;
padding-bottom: 8rpx;
display: flex;
align-items: center;
border-radius: 10rpx;
margin-bottom: 31rpx;
}
.marketing_list .marketing_content .list .li .left {
width: 163rpx;
height: 75rpx;
border-right: 1px dashed #fff;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
margin-right: 29rpx;
}
.marketing_list .marketing_content .list .li .left .num {
font-size: 48rpx;
margin-right: 14rpx;
}
.marketing_list .marketing_content .list .li .left .pic {
font-size: 25.89rpx;
}
.marketing_list .marketing_content .list .li .right {
display: flex;
flex: 1;
justify-content: space-between;
align-items: center;
padding-right: 25rpx;
}
.marketing_list .marketing_content .list .li .right .name {
font-size: 32rpx;
color: #fff;
}
.marketing_list .marketing_content .list .li .right .btn {
width: 100rpx;
height: 40rpx;
line-height: 40rpx;
text-align: center;
background-color: #fff;
border-radius: 18rpx;
}
.marketing_list .marketing_content .list .li .right .tips {
font-size: 20rpx;
color: #000;
}
.marketing_list .marketing_content .list .li.disabled {
background-color: #ccc;
}
.marketing_list .marketing_content .drawBtn {
width: 424rpx;
height: 69rpx;
background-color: #ff7800;
border-radius: 34.5rpx;
margin: 0 auto;
line-height: 69rpx;
text-align: center;
color: #fff;
font-size: 36rpx;
}
.marketing_list .marketing_content .drawBtn.disabled {
background-color: #999;
}
.marketing_list .close {
position: absolute;
z-index: 13;
bottom: -98rpx;
left: 50%;
margin-left: -32.5rpx;
width: 63rpx;
height: 63rpx;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #fff;
border-radius: 50%;
}
.marketing_list .close .iconfont {
font-size: 40rpx;
display: flex;
align-items: center;
color: #fff;
}
.lose_tips {
z-index: 12;
position: absolute;
top: 50%;
left: 50%;
margin-left: -310rpx;
margin-top: -270rpx;
width: 620rpx;
height: 474rpx;
background-color: #fff;
border-radius: 20rpx;
overflow: visible;
padding-top: 66rpx;
}
.lose_tips .lose_content .top {
width: 110rpx;
height: 110rpx;
margin: 0 auto 41rpx;
display: flex;
align-items: center;
justify-content: center;
background-color: #949494;
border-radius: 50%;
}
.lose_tips .lose_content .top .iconfont {
color: #fff;
font-size: 80rpx;
display: flex;
align-items: center;
}
.lose_tips .lose_content .center .tips {
font-size: 48rpx;
color: #000;
margin-bottom: 30rpx;
}
.lose_tips .lose_content .center .title {
font-size: 28rpx;
color: #999;
}
.lose_tips .lose_content .center {
text-align: center;
margin-bottom: 65rpx;
}
.lose_tips .lose_content .button {
width: 408rpx;
height: 90rpx;
background-color: #fe8a02;
border-radius: 45rpx;
text-align: center;
line-height: 90rpx;
font-size: 36rpx;
color: #fff;
margin: 0 auto;
}
.coverImg {
width: 100%;
height: 100%;
filter: blur(15px);
-webkit-filter: blur(15px);
object-fit: contain;
}
.wechatpayContent {
position: relative;
width: 100%;
height: 100%;
}
.wechatpayContent .icon-close11 {
position: absolute;
font-size: 40rpx;
top: 20rpx;
right: 41rpx;
}
.wechatpayContent .title {
font-size: 36rpx;
line-height: 36rpx;
color: #000;
text-align: center;
padding-top: 38rpx;
}
.wechatpayContent .pay {
font-size: 24rpx;
line-height: 36rpx;
color: #999;
padding-top: 25rpx;
padding-left: 46rpx;
}
.wechatpayContent .ul {
padding-left: 34rpx;
padding-right: 34rpx;
}
.wechatpayContent .ul .li {
display: flex;
align-items: center;
justify-content: space-between;
}
.wechatpayContent .ul .li .left {
display: flex;
align-items: center;
}
.wechatpayContent .ul .li .left .icon-card_weixin {
color: #08c160;
font-size: 40rpx;
margin-right: 30rpx;
}
.wechatpayContent .ul .li .left .payName {
font-size: 28rpx;
line-height: 36rpx;
color: #000;
}
.wechatpayContent .ul .li .right {
color: #ff2c29;
}
.wechatpayContent .wechatpaybtn {
width: 120rpx;
height: 50rpx;
background-color: #08c160;
border-radius: 10rpx;
font-size: 28rpx;
line-height: 50rpx;
text-align: center;
color: #fff;
position: absolute;
bottom: 40rpx;
left: 50%;
margin-left: -60rpx;
}
.show_shoplist_content {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
position: absolute;
right: 0;
top: -190rpx;
z-index: 14;
}
.show_shoplist_content .show_shoplist {
margin-right: 10rpx;
width: 110rpx;
height: 310rpx;
}
.show_shoplist_content .show_shoplist .li {
position: relative;
padding-top: 12rpx;
}
.show_shoplist_content .show_shoplist .li .top {
width: 90rpx;
height: 90rpx;
border-radius: 50%;
margin: 0 auto;
}
.show_shoplist_content .show_shoplist .li .top image {
width: 100%;
height: 100%;
border-radius: 50%;
}
.show_shoplist_content .show_shoplist .li .bottom {
color: #fff;
font-size: 24rpx;
line-height: 26rpx;
text-align: center;
}
.show_shoplist_content .show_shoplist .li .close {
width: 40rpx;
height: 40rpx;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
right: -6rpx;
top: -3rpx;
}
.show_shoplist_content .show_shoplist .li .close .iconfont {
color: #fff;
font-size: 38rpx;
}
.moreContent {
padding-top: 39rpx;
padding-left: 39rpx;
display: flex;
flex-wrap: wrap;
}
.moreContent .li {
width: 110rpx;
margin-bottom: 40rpx;
margin-right: 31rpx;
}
.moreContent .li .top {
width: 110rpx;
height: 110rpx;
border-radius: 20rpx;
}
.moreContent .li .top image {
border-radius: 20rpx;
width: 100%;
height: 100%;
}
.moreContent .li .bottom {
line-height: 36rpx;
color: #999;
text-align: center;
padding-top: 14rpx;
max-height: 72rpx;
/* text-overflow: -o-ellipsis-lastline; */
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.commodities {
position: absolute;
z-index: 12;
left: 25rpx;
top: 320rpx;
width: 165rpx;
height: 217rpx;
background-color: rgba(0, 0, 0, 0.2);
border-radius: 10rpx;
box-sizing: border-box;
padding-left: 5rpx;
padding-right: 5rpx;
padding-bottom: 11rpx;
}
.commodities .title {
padding-top: 8rpx;
font-size: 22rpx;
line-height: 36rpx;
color: #fff;
text-align: center;
padding-bottom: 6rpx;
}
.commodities .picshow {
width: 155rpx;
height: 155rpx;
border-radius: 10rpx;
position: relative;
}
.commodities .picshow .top {
width: 100%;
height: 100%;
}
.commodities .picshow .top image {
width: 100%;
height: 100%;
border-radius: 10rpx;
}
.commodities .picshow .bottom {
position: absolute;
z-index: 13;
left: 0;
bottom: 0;
width: 100%;
height: 38rpx;
background-color: rgba(255, 255, 255, 0.8);
border-radius: 0rpx 0rpx 10rpx 10rpx;
font-size: 24rpx;
line-height: 38rpx;
color: #ff2c29;
padding-left: 11rpx;
box-sizing: border-box;
}
.commodities .close {
position: absolute;
left: 0;
top: -52rpx;
width: 40rpx;
height: 40rpx;
}
.commodities .close .icon-adsystem_icon_cancle {
font-size: 40rpx;
color: #fff;
}
.passwordContent .title {
padding-top: 19rpx;
text-align: center;
padding-bottom: 50rpx;
}
.passwordContent .content {
width: 355rpx;
margin: 0 auto 50rpx;
border-bottom: #bbb 1rpx solid;
display: flex;
align-items: center;
}
.passwordContent .content input {
width: 100%;
padding-left: 10rpx;
}
.passwordContent .left {
float: 1;
}
.passwordContent .right {
display: flex;
align-items: center;
justify-content: center;
width: 100rpx;
}
.passwordContent .btn {
background-color: #f53939;
width: 600rpx;
height: 80rpx;
text-align: center;
line-height: 80rpx;
color: #fff;
margin: 0 auto;
font-size: 28rpx;
border-radius: 20rpx;
}
.luck_draw_btn {
position: fixed;
top: 180rpx;
left: 32rpx;
z-index: 999;
}
.luck_draw_btn .luck_draw_btn_img {
width: 96rpx;
height: 96rpx;
border-radius: 50%;
overflow: hidden;
margin: 0;
display: block;
}
.luck_draw_btn .CloneBtn {
color: #fff;
position: absolute;
top: -32rpx;
left: -32rpx;
}
.luck_draw_btn .CloneBtn icon {
font-size: 32rpx;
padding: 8rpx;
}
.posterWord .h2 {
line-height: 28px;
height: 36px;
text-align: center;
font-size: 16px;
font-weight: bold;
}
.advertising-Box {
position: absolute;
right: 44rpx;
top: 188rpx;
z-index: 99;
}
.advertising-Box .advertising-Box-child {
width: 120rpx;
height: 120rpx;
position: relative;
}
.advertising-Box .advertising-Box-child image {
width: 100%;
height: 100%;
object-fit: contain;
}
.advertising-Box .advertising-Box-child .icon-adsystem_icon_cancle {
position: absolute;
top: -28rpx;
right: -32rpx;
color: #fff;
padding: 8rpx;
}
.advertising-Box .member-look-ads {
margin-bottom: 24rpx;
}
.gift-effects {
position: fixed;
width: 100%;
left: 0;
top: 0;
z-index: 1;
}
.gift-effects image {
width: 100%;
height: 100%;
}
.fullScreens {
height: 100vh;
}
.topScreens {
height: 50vh;
}
.bottomScreens {
height: 50vh;
top: auto;
bottom: 0;
}
.pk-video-main {
height: 40vh;
width: 100%;
top: auto;
left: 0;
bottom: 45%;
position: absolute;
}
.pk-video-main live-player {
width: 50% !important;
height: 40vh !important;
}
.pk-video-main .videos-pk {
left: auto !important;
right: 0 !important;
position: absolute;
top: 0;
width: 50% !important;
height: 40vh !important;
display: flex;
align-items: flex-end;
}
.pk-video-main .videos-pk-anchor {
display: flex;
align-items: flex-end;
z-index: 9999;
}
.pk-video-main .videos-pk-anchor .pkAnchor-info {
display: flex;
align-items: center;
height: 1.375rem;
line-height: 1.375rem;
max-width: 8rem;
margin: 0.375rem;
padding: 0 0.125rem;
border-radius: 1rem;
overflow: hidden;
background: rgba(0, 0, 0, 0.2);
}
.pk-video-main .videos-pk-anchor .pkAnchor-info .pkAnchor-info-avatar {
width: 1.25rem;
height: 1.25rem;
border-radius: 50%;
overflow: hidden;
margin: 0;
}
.pk-video-main .videos-pk-anchor .pkAnchor-info .pkAnchor-info-name {
font-size: 12px;
color: #fff;
padding: 0 0.5rem 0 0.25rem;
flex: 1;
text-align: left;
overflow: hidden;
/* 超出部分隐藏 */
text-overflow: ellipsis;
/* 超出部分显示省略号 */
white-space: nowrap;
/* 规定段落中的文本不进行换行 */
}
.pk-video-main .pk-video-time {
z-index: 999;
color: #fff;
text-align: center;
position: absolute;
left: 50%;
top: -0.75rem;
transform: translateX(-50%);
background: rgba(0, 0, 0, 0.8);
padding: 0 1.5rem;
height: 1.5rem;
line-height: 1.5rem;
border-radius: 0.75rem;
}
.horizontal-screen {
background: #000;
}
.horizontal-screen live-player {
transform: translateY(-10%);
}