| 1 |
- page{padding:0;height:100%}.chat{height:100%}.chat .goods{display:flex;position:fixed;width:600rpx;right:20rpx;bottom:calc(120rpx + env(safe-area-inset-bottom));border-radius:14rpx;background:#fff;padding:20rpx}.chat .goods .close{position:absolute;left:-20rpx;top:-20rpx}.chat .goods .send-btn{padding:8rpx 22rpx}.chat .content{transition:all .3s;flex:1;min-height:0}.chat .content .loading{padding:20rpx;height:40px}.chat .content .chat-lists{padding:0 20rpx 30rpx;overflow:hidden;position:relative}.chat .content .chat-lists .chat-tips{padding:4rpx 20rpx;border-radius:21rpx;display:inline-block;text-align:center;background-color:rgba(0,0,0,.2)}.chat .content .chat-lists .chat-item{padding-top:30rpx}.chat .content .chat-lists .chat-item.visibility{visibility:hidden}.chat .content .chat-lists .chat-item .chat-info{display:flex;align-items:flex-start}.chat .content .chat-lists .chat-item.right .chat-info{flex-direction:row-reverse}.chat .content .chat-lists .chat-item.right .chat-info .text-box{color:#fff}.red_theme .chat .content .chat-lists .chat-item.right .chat-info .text-box{background-color:#ff2c3c}.orange_theme .chat .content .chat-lists .chat-item.right .chat-info .text-box{background-color:#f7971e}.pink_theme .chat .content .chat-lists .chat-item.right .chat-info .text-box{background-color:#fa444d}.gold_theme .chat .content .chat-lists .chat-item.right .chat-info .text-box{background-color:#e0a356}.blue_theme .chat .content .chat-lists .chat-item.right .chat-info .text-box{background-color:#2f80ed}.green_theme .chat .content .chat-lists .chat-item.right .chat-info .text-box{background-color:#2ec840}.chat .content .chat-lists .chat-item .avatar{width:78rpx;height:78rpx;border-radius:14rpx;flex:none}.chat .content .chat-lists .chat-item .text-box{max-width:500rpx;min-width:80rpx;background-color:#fff;border-radius:14rpx;padding:16rpx 20rpx;margin:0 20rpx;word-break:break-word;line-height:40rpx;white-space:pre-wrap}.chat .content .chat-lists .chat-item .image-box{max-width:300rpx;margin:0 20rpx}.chat .content .chat-lists .chat-item .image-box .image{max-width:100%}.chat .content .chat-lists .chat-item .goods-box{position:static;width:510rpx}.chat .error{padding:0 30rpx 30rpx}.chat .error .error-msg{color:#bbb;word-break:break-word}.chat .footer{background:#f2f2f2;padding-bottom:env(safe-area-inset-bottom)}.chat .footer .footer-input{height:100rpx;padding:0 20rpx}.chat .footer .footer-input .icon{width:52rpx;height:52rpx}.chat .footer .footer-input .input-contain{margin:0 20rpx;background-color:#fff;height:68rpx;border-radius:60rpx;flex:1;overflow:hidden;padding:0 10rpx 0 30rpx}.chat .footer .footer-input .input-contain .text-area{flex:1;height:100rpx;word-break:break-all}.chat .emoji-wrap{height:0;transition:all .3s}.chat .emoji-wrap.emoji-show{height:200px}.chat .send-btn{padding:0 25rpx;color:#fff;border-radius:60rpx}.red_theme .chat .send-btn{background-color:#ff2c3c}.orange_theme .chat .send-btn{background-color:#f7971e}.pink_theme .chat .send-btn{background-color:#fa444d}.gold_theme .chat .send-btn{background-color:#e0a356}.blue_theme .chat .send-btn{background-color:#2f80ed}.green_theme .chat .send-btn{background-color:#2ec840}
|
