You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
149 lines
3.1 KiB
149 lines
3.1 KiB
|
|
.app-wallpaper{ |
|
padding-bottom:30rpx; |
|
.detail-container{ |
|
// height:844px; |
|
position: relative; |
|
box-sizing: border-box; |
|
.detail-background-container{ |
|
box-sizing: border-box; |
|
padding:0 10rpx; |
|
position: absolute; |
|
top:0rpx; |
|
left:0; |
|
width:100%; |
|
height:100%; |
|
.detail-background{ |
|
position: relative; |
|
left:0; |
|
width:100%; |
|
height:100%; |
|
z-index: 1; |
|
background-color: #fff; |
|
border: 2rpx solid #262626; |
|
box-shadow: 1rpx 4rpx 6rpx 0rpx rgba(103,131,131,0.3); |
|
border-radius: 50rpx; |
|
} |
|
} |
|
.detail-content-container{ |
|
box-sizing: border-box; |
|
height:100%; |
|
position: relative; |
|
z-index: 2; |
|
padding:15rpx 0; |
|
.detail-content{ |
|
height:100%; |
|
border: 2rpx solid #262626; |
|
border-radius: 50rpx; |
|
background-color:#fff; |
|
padding:0 40rpx; |
|
.chat-item{ |
|
margin-top:45rpx; |
|
&.my-chat{ |
|
justify-content: flex-end; |
|
.chat-time{ |
|
text-align: left; |
|
} |
|
.chat-content{ |
|
background: #4EC2B7; |
|
font-size: 28rpx; |
|
font-weight: 500; |
|
color: #FFFFFF; |
|
line-height: 30rpx; |
|
border-radius:45rpx 50rpx 0rpx 45rpx; |
|
} |
|
.chat-item-content{ |
|
align-items: flex-end; |
|
justify-content: flex-end; |
|
.chat-content-container{ |
|
margin-right:15rpx; |
|
} |
|
} |
|
.chat-avator{ |
|
top:15rpx; |
|
} |
|
} |
|
&.other-chat{ |
|
justify-content: flex-start; |
|
.chat-time{ |
|
text-align: right; |
|
} |
|
.chat-content{ |
|
background: #F2F9FA; |
|
font-size: 28rpx; |
|
font-weight: 500; |
|
color: #131313; |
|
border-radius:0rpx 45rpx 45rpx 50rpx; |
|
} |
|
.chat-item-content{ |
|
align-items: flex-end; |
|
justify-content: flex-start; |
|
.chat-content-container{ |
|
margin-left:15rpx; |
|
} |
|
} |
|
.chat-avator{ |
|
bottom:15rpx; |
|
} |
|
} |
|
|
|
.chat-content{ |
|
padding:30rpx 40rpx; |
|
border: 2rpx solid #262626; |
|
} |
|
.chat-time{ |
|
font-size: 24rpx; |
|
font-weight: 400; |
|
color: #C1C1C1; |
|
margin-bottom:10rpx; |
|
} |
|
.chat-item-content{ |
|
|
|
} |
|
.chat-avator{ |
|
width:80rpx; |
|
height:80rpx; |
|
position: relative; |
|
// top:30rpx; |
|
.img{ |
|
width:80rpx; |
|
height:80rpx; |
|
overflow: hidden; |
|
border:3rpx solid #fff; |
|
border-radius: 50%; |
|
} |
|
} |
|
|
|
} |
|
} |
|
} |
|
} |
|
|
|
.detail-input-group-container{ |
|
position: absolute; |
|
bottom: 0; |
|
width: 100%; |
|
padding: 35rpx 20rpx 30rpx 20rpx; |
|
box-sizing: border-box; |
|
.detail-input-group{ |
|
background-color: rgb(235,242,243); |
|
|
|
width: 100%; |
|
padding: 24rpx 38rpx; |
|
border:2rpx solid #131313; |
|
border-radius: 45rpx; |
|
z-index: 1; |
|
.detail-input{ |
|
background: #FFFFFF; |
|
box-shadow: 0rpx 5rpx 10rpx 0rpx rgba(179,181,181,0.1); |
|
border-radius: 45rpx; |
|
font-size:30rpx; |
|
padding:20rpx 40rpx; |
|
caret-color:#4DC3B8; |
|
} |
|
.detail-input-button{ |
|
margin-left:15rpx; |
|
} |
|
} |
|
} |
|
} |