.group-information-box{ width: 100vw ; background: #006EFF; } .group-box{ display: inline-flex; width: 100%; box-sizing: border-box; padding: 34rpx 40rpx; } .group-ID{ flex: 1; max-width:50% ; color: white; display: inline-block; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .group-member{ padding-left: 110rpx; color: white; } .icon-right{ float: right; width: 32rpx; height: 32rpx; padding-top: 10rpx; padding-left: 4rpx; } .showdetail{ display:flex; width: 100vw; height: 200rpx; background: #006EFF; } .box{ width: 100rpx; height: 130rpx; padding-left: 35rpx; padding-top: 10rpx; display: flex; flex-direction: column; justify-content: center; align-items: center; } .left-box{ display: flex; padding-left: 200rpx; padding-top: 10rpx; width: 250rpx; } .box-group{ position: absolute; width: 80rpx; height: 80rpx; right: 160rpx; } .box-group-quit{ position:absolute; right: 80rpx; width: 80rpx; height: 80rpx; } .addmember{ width: 80rpx; height: 80rpx; } .quitgroup{ padding-left: 28rpx; width: 80rpx; height: 80rpx; } .profile-box{ width: 80rpx; height: 80rpx; flex-shrink: 0; z-index: 8; } .addmember-text{ display: flex; justify-content: center; align-items: center; font-family: PingFangSC-Regular; font-size: 10px; color: #FFFFFF; letter-spacing: 0; } .quitgroup-text{ display: flex; justify-content: center; align-items: center; font-family: PingFangSC-Regular; font-size: 10px; color: #FFFFFF; letter-spacing: 0; padding-left: 20rpx; width: 100rpx; } .nick-box{ margin-top: 10px; display: flex; justify-content: center; align-items: center; font-family: PingFangSC-Regular; font-size: 10px; color: #FFFFFF; letter-spacing: 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 100%; } .popup-mask{ width: 100vw; height: 100vh; position: fixed; z-index: 10; top: 0; right: 0; display: flex; align-items: flex-end; } .pop-main{ max-height: 35%; width: 100%; padding-bottom: 120rpx; background: #FFFFFF; overflow: auto } .group-member-text{ display: inline-block; padding-left: 40rpx; opacity: 0.8; font-family: PingFangSC-Medium; font-size: 18px; letter-spacing: 0; line-height: 25px; } .close{ font-family: PingFangSC-Regular; font-size: 18px; color: #2B8BD5; letter-spacing: 0; line-height: 24px; } .quitpop-mask{ width: 100vw; height: 100vh; position: fixed; z-index: 10; top: 0; right: 0; background: rgba(0,0,0,0.60); display: flex; align-items: flex-end; } .quitpop{ position: fixed; bottom: 0; width: 100%; height: 25%; background: #FFFFFF; z-index: 99999; } .text-box{ display: flex; justify-content: center; align-items: center; height: 112rpx; } .confirmQuitgroup-text{ display: inline-block; opacity: 0.4; font-family: PingFangSC-Regular; font-size: 14px; letter-spacing: 0; text-align: center; line-height: 18px; } .quitgroup-confirm{ font-family: PingFangSC-Regular; font-size: 16px; color: #E85454; letter-spacing: 0; text-align: center; line-height: 22px; } .quitgroup-abandon{ opacity: 0.8; font-family: PingFangSC-Regular; font-size: 16px; letter-spacing: 0; text-align: center; line-height: 22px; } .mask{ position: absolute; top: 450rpx; left: 100rpx; width: 70%; height: 20%; background:#999999; z-index: 999; } .popup { background: #ffffff; border: 1px solid #eeeeee; } .popup-main { height: 56px; padding: 60rpx 0; text-align: center; font-family: PingFangSC-Regular; font-size: 14px; color: #999999; letter-spacing: 0; text-align: center; line-height: 18px; } .input{ padding-top: 30rpx; } .popup-footer { display: flex; } .popup-footer button { flex: 1; } .popup-footer .cancel { font-family: PingFangSC-Regular; font-size: 14px; color: #000000; letter-spacing: 0; text-align: center; line-height: 22px; height: 44px; border-radius: 10px ; } .popup-footer .submit { font-family: PingFangSC-Regular; font-size: 14px; color: #E85454; letter-spacing: 0; text-align: center; line-height: 22px; height: 44px; border-radius: 10px ; } .cancellation{ margin-top: 68px; margin-left: 20px; margin-right: 20px; background-color:white; width: 280px; height: 46px; border: 1px solid #E85454 ; border-radius: 24px; border-radius: 24px; } .confirm-cancellation{ margin-left: 110px; margin-top: 13px; font-family: PingFangSC-Regular; font-size: 16px; color: #E85454; letter-spacing: 0; } .image-list{ padding-top: 40rpx; display: flex; flex-wrap: wrap; } .image-nick-box{ width: 141rpx; height: 140rpx; padding-left: 45rpx; padding-top: 32rpx; } .image{ width: 108rpx; height: 108rpx; border-radius: 4px; border-radius: 4px; } .groupownername-box { display: flex } .groupownername { margin-top: 10px; display: inline-block; font-family: PingFangSC-Regular; font-size: 10px; color: white; letter-spacing: 0; white-space: nowrap; width: 80rpx; } .groupmembername{ display: inline-block; font-family: PingFangSC-Regular; font-size: 12px; color: #999999; letter-spacing: 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 80rpx; } .groupowner-box { display: flex; } .groupownername-bootom { display: inline-block; font-family: PingFangSC-Regular; font-size: 12px; color: #999999; letter-spacing: 0; white-space: nowrap; width: 80rpx; } .text-box-qiut{ display: flex; justify-content: center; align-items: center; height: 112rpx; } .text-box-cancle{ display: flex; justify-content: center; align-items: center; height: 112rpx; border-top: 16rpx solid #eeeeee ; } .moremember{ width: 108rpx; height: 140rpx; padding-left: 32rpx; padding-top: 32rpx; } .call-box { display: flex; flex-direction: column; } .call-image { width: 48px; height: 48px; } .image-nick-box-active { box-sizing: border-box; border: 3px solid #24a528; border-radius: 4px; } .pop-main-header { display: flex; align-items: center; justify-items: center; padding-top: 40rpx; justify-content: space-between; } .show-group-call{ display: flex; padding-right: 40rpx; } .handlecall{ padding-right: 40rpx; }