123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155 |
- /* 15寸和32寸 公共样式*/
- /* --- 标题 --- */
- .head {
- display: flex;
- height: 5vh;
- text-align: end;
- line-height: 5vh;
- background-color: #f5f5f5;
- font-size: 18px;
- justify-content: center;
- }
- .head text{
- flex: 1;
- }
- .head .switch{
- padding-right: 100rpx;
- flex: 1;
- }
- .pageView {
- display: flex;
- background-color: #f5f5f5;
- }
- .body {
- display: flex;
- flex-direction: column;
- }
- /* --- 主内容区 --- */
- .list-wrap {
- flex-grow: 1;
- position: relative;
- }
- .list-wrap .scrollview {
- position: absolute;
- height: 100%;
- }
- .list-wrap .scrollview .scrollview-item {
- display: flex;
- flex-direction: column;
- }
- .list-wrap .scrollview .scrollview-item .item {
- display: flex;
- margin: 0 24rpx 50rpx;
- }
- .list-wrap .scrollview .scrollview-item .item .avtar {
- display: flex;
- width: 78rpx;
- height: 78rpx;
- border-radius: 50rpx;
- overflow: hidden;
- }
- .list-wrap .scrollview .scrollview-item .item .content {
- position: relative;
- max-width: 1050rpx;
- background-color: #fff;
- margin: 40rpx 24rpx 0;
- border-radius: 5px;
- font-size: 32rpx;
- line-height: 42rpx;
- padding: 24rpx;
- word-wrap: break-word;
- }
- .list-wrap .scrollview .scrollview-item .other {
- justify-content: flex-end;
- }
- /* 底部发送框 */
- .chat-bottom {
- /* height: 300rpx; */
- margin: 50rpx;
- margin-left: 0;
- position: relative;
- }
- /* 快捷标签输入 */
- .chat-bottom .uni-label{
- display: flex;
- height: 100rpx;
- margin-bottom: 20rpx;
- }
- .chat-bottom .uni-label label{
- flex: 1;
- text-align: center;
- line-height: 100rpx;
- border-radius: 100rpx;
- background-color: #fff;
- margin-right: 10rpx;
- border: 1px solid rgb(30,144,255);
- }
- .chat-bottom .send-msg {
- display: flex;
- }
- .chat-bottom .send-msg .uni-textarea {
- flex: 1;
- }
- .chat-bottom .send-msg .send-btn {
- align-items: center;
- justify-content: center;
- width: 320rpx;
- height: 320rpx;
- border-radius: 50rpx;
- font-size: 35rpx;
- font-weight: 500;
- color: #fff;
- line-height: 320rpx;
- z-index: 1;
- }
- .chat-bottom .send-msg .uni-textarea textarea {
- width: 96%;
- height: 270rpx;
- border-radius: 40rpx;
- line-height: 1.5;
- padding: 25rpx;
- right: 50rpx;
- background-color: #fff;
- margin-left: 50rpx;
- }
- .chat-bottom .send-msg .uni-textarea textarea ::-webkit-scrollbar {
- display: none;
- }
- /* --- 左右两边占位调节、图片占位 --- */
- .sidebar-left {
- width: 5vw;
- }
- /* 去除导航条 */
- .scrollview ::-webkit-scrollbar {
- display: none;
- }
- /* 聊天框数据加载 图标距离头像的间距 */
- .loadingPoint{
- margin-right: 30px;
- }
|