reader/pages/message/index.wxss

/*
此文件为开发者工具生成，生成时间: 2023/3/22下午3:45:51

在 C:\Users\efunbox\Desktop\朗读小咖秀\pages\message\index.wxss 中引入样式
```
@import "./index.skeleton.wxss";
```

更多详细信息可以参考文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/skeleton.html
*/
.sk-transparent {
  color: transparent !important;
}
.sk-text-14-2857-843 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text {
  background-origin: content-box !important;
  background-clip: content-box !important;
  background-color: transparent !important;
  color: transparent !important;
  background-repeat: repeat-y !important;
}
.sk-text-14-2857-109 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-30 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-818 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-940 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-499 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-451 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-380 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-885 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-103 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-705 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-725 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-489 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-691 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-479 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-864 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-894 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-711 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-274 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-7 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-900 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-540 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-309 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-783 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-956 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-617 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-422 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-916 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-855 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-168 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-403 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-704 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-127 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 42rpx;
  position: relative !important;
}
.sk-text-14-2857-522 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-text-14-2857-245 {
  background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
  background-size: 100% 33.6rpx;
  position: relative !important;
}
.sk-image {
  background: #EFEFEF !important;
}
.sk-container {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: transparent;
}
page {
  background-color: white;
}
.messagePage {
  overflow: hidden;
  border-top-left-radius: 24rpx;
  border-top-right-radius: 24rpx;
  background-color: white;
}
.messagePage .input {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #F2F6FC;
  font-size: 28rpx;
  margin: 20rpx 30rpx 10rpx;
  padding: 20rpx 40rpx;
  border-radius: 26rpx;
}
.messagePage .input .searchBtn {
  padding: 6rpx 44rpx;
  background: #00C657;
  border-radius: 40rpx;
}
.messagePage .input .searchBtn .img {
  width: 24rpx;
  height: 24rpx;
}
.messagePage .messageList {
  padding: 0rpx 36rpx 250rpx;
  box-sizing: border-box;
}
.messagePage .messageList .fixed {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20rpx 0rpx;
  border-bottom: 1rpx solid #D8D8D8;
}
.messagePage .messageList .fixed .authority {
  position: relative;
  display: flex;
  align-items: center;
}
.messagePage .messageList .fixed .authority .avatar {
  border-radius: 50rpx;
  width: 80rpx;
  height: 80rpx;
  margin-right: 14rpx;
}
.messagePage .messageList .fixed .authority .name {
  font-size: 30rpx;
}
.messagePage .messageList .fixed .authority .unread {
  top: -4rpx;
  left: 60rpx;
  position: absolute;
  width: 32rpx;
  height: 32rpx;
  line-height: 32rpx;
  border-radius: 550rpx;
  color: white;
  font-size: 20rpx;
  text-align: center;
  background-color: #FF0000;
}
.messagePage .messageList .base {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20rpx 0rpx 20rpx 20rpx;
  border-bottom: 1rpx solid #D8D8D8;
}
.messagePage .messageList .base .avatar {
  border-radius: 50rpx;
  width: 80rpx;
  height: 80rpx;
  background-color: #EEEEEE;
}
.messagePage .messageList .base .body {
  flex: 1;
  padding: 0rpx 20rpx;
}
.messagePage .messageList .base .body .name {
  max-width: 330rpx;
  font-size: 30rpx;
  font-weight: bolder;
}
.messagePage .messageList .base .right {
  min-width: 140rpx;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.messagePage .messageList .base .right .date {
  font-size: 24rpx;
}
.messagePage .messageList .base .right .unread {
  margin-top: 6rpx;
  width: 32rpx;
  height: 32rpx;
  line-height: 32rpx;
  border-radius: 550rpx;
  color: white;
  font-size: 20rpx;
  text-align: center;
  background-color: #FF0000;
}
.messagePage .messageList .user .info {
  margin-top: 4rpx;
  width: 400rpx;
  color: #969696;
  font-size: 24rpx;
}
.messagePage .messageList .pressHover {
  background-color: #f1f1f1;
}
.messagePage .menuBg {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100vw;
  height: 100vh;
}
.messagePage .menu {
  position: fixed;
  width: 278rpx;
  padding: 20rpx 20rpx;
  box-sizing: border-box;
  border-radius: 24rpx;
  background-color: white;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 6rpx 16rpx;
}
.messagePage .menu view {
  height: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.messagePage .menu .icon {
  width: 30rpx;
  height: 30rpx;
  margin-right: 16rpx;
}
.messagePage .menu .menu-one .icon {
  width: 22rpx;
  height: 28rpx;
}
.messagePage .skeleton {
  width: 100%;
  height: 80vh;
  position: relative;
}
.messagePage .skeleton .messageList {
  padding: 0rpx;
}