123 lines
2.0 KiB
Plaintext
123 lines
2.0 KiB
Plaintext
.container{
|
|
width: 100vw;
|
|
height: 100vh;
|
|
background-color: #F4F5F9;
|
|
}
|
|
|
|
.tui-navigatorbar{
|
|
position: absolute;
|
|
top: 0;
|
|
width: 750rpx;
|
|
height: 170rpx;
|
|
background-color: #006EFF;
|
|
}
|
|
|
|
.tui-navigatorbar-back{
|
|
position: absolute;
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
left: 24rpx;
|
|
bottom: 20rpx;
|
|
}
|
|
|
|
.conversation-title {
|
|
position:absolute;
|
|
width: 350rpx;
|
|
height: 88rpx;
|
|
line-height: 56rpx;
|
|
font-size: 36rpx;
|
|
color: #FFFFFF;
|
|
bottom: 0;
|
|
left: 200rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.conversation-list-area {
|
|
position: absolute;
|
|
width: 100vw;
|
|
height: calc(100vh - 190px);
|
|
top: 172rpx;
|
|
}
|
|
|
|
.scoll-view {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.btn-show-more {
|
|
display: flex;
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
padding-left: 3rpx;
|
|
|
|
}
|
|
|
|
.picker {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 96rpx;
|
|
}
|
|
.bottom-back{
|
|
height: 120px;
|
|
width: 100%;
|
|
background-color: #F4F5F9;
|
|
z-index: 3;
|
|
}
|
|
.bottom-area {
|
|
flex-direction: column;
|
|
position: absolute;
|
|
bottom: 80rpx;
|
|
right: 0;
|
|
left: 0;
|
|
margin: auto;
|
|
width: 100px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center
|
|
}
|
|
|
|
.im-link {
|
|
width: 218rpx;
|
|
height: 36rpx;
|
|
font-size: 28rpx;
|
|
line-height: 36rpx;
|
|
margin: 0 auto;
|
|
color: #006EFF;
|
|
}
|
|
.conversation-bubble {
|
|
padding-top: 40rpx;
|
|
position: absolute;
|
|
width: 300rpx;
|
|
padding-right: 3px;
|
|
background-color: #FFFFFF;
|
|
height: 320rpx;
|
|
bottom: 300rpx;
|
|
left: 220rpx;
|
|
z-index: 100;
|
|
box-shadow: 0 2px 16px 0 rgba(0,0,0,0.08);
|
|
border-radius: 14rpx;
|
|
}
|
|
.conversation-bubble:before,.conversation-bubble:after{
|
|
content: "";
|
|
display: block;
|
|
border-width: 20px;
|
|
position: absolute;
|
|
bottom: -40px;
|
|
left: 54px;
|
|
border-style: solid dashed dashed;
|
|
border-color: #fff transparent transparent;
|
|
font-size: 0;
|
|
line-height: 0;
|
|
margin-left:4px
|
|
}
|
|
|
|
.conversation-bubble:after{
|
|
bottom: -33px;
|
|
border-color: #fff transparent transparent;
|
|
|
|
}
|