messageList.wxss 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
  1. page {
  2. background: #F3F3F3;
  3. color: #333;
  4. padding-bottom:80rpx;
  5. }
  6. view,text{
  7. box-sizing: border-box;
  8. color:#333;
  9. font-size: 34rpx;
  10. }
  11. .van-tab--active view.van-ellipsis{
  12. color:#1677FF;
  13. }
  14. .message-list{
  15. margin:40rpx 24rpx 0;
  16. width:702rpx;
  17. }
  18. .message-item{
  19. /* background: #FFFFFF;
  20. border-radius: 18rpx;
  21. min-height:200rpx;
  22. margin-bottom:16rpx;
  23. padding:30rpx 24rpx 28rpx; */
  24. }
  25. .message-item .title{
  26. height: 36rpx;
  27. display: flex;
  28. align-self: center;
  29. }
  30. .message-item .title image{
  31. width:36rpx;
  32. height:36rpx;
  33. margin-right:10rpx;
  34. }
  35. .message-item .title view{
  36. /* font-size: 32rpx;
  37. line-height: 32rpx; */
  38. }
  39. /* .message-item view.content{
  40. margin:56rpx 0 46rpx;
  41. line-height: 38rpx;
  42. color:#666;
  43. font-size: 26rpx;
  44. } */
  45. view.content.warn-text{
  46. font-weight: 600;
  47. color: #DC0000;
  48. }
  49. .message-bottom {
  50. display: flex;
  51. align-items: center;
  52. justify-content: flex-end;
  53. height: 40rpx;
  54. line-height: 40rpx;
  55. }
  56. .message-bottom image{
  57. width:30rpx;
  58. height: 30rpx;
  59. margin-right:8rpx;
  60. }
  61. .message-bottom view{
  62. color: #0EAEFC;
  63. }
  64. .modal-list{
  65. position: relative;
  66. width:702rpx;
  67. height:508rpx;
  68. background:transparent;
  69. margin:0 24rpx;
  70. }
  71. .modal-block{
  72. width: 678rpx;
  73. height: 478rpx;
  74. background: #FFFFFF;
  75. box-shadow: 0px 2rpx 4rpx 0px rgba(0,0,0,0.5);
  76. border-radius: 18rpx;
  77. }
  78. .modal-block-bottom{
  79. position:absolute;
  80. top:32rpx;
  81. left:24rpx;
  82. z-index:8;
  83. }
  84. .modal-block-top{
  85. position:absolute;
  86. top:0;
  87. left:0;
  88. z-index:9;
  89. }
  90. .modal-block .content{
  91. padding:38rpx 24rpx 40rpx 12rpx;
  92. }
  93. .modal-block .title{
  94. display: flex;
  95. height: 50rpx;
  96. align-items: center;
  97. justify-content: space-between;
  98. margin-bottom:28rpx;
  99. }
  100. .modal-block .left{
  101. display: flex;
  102. height: 50rpx;
  103. align-items: center;
  104. overflow: hidden;
  105. white-space: nowrap;
  106. }
  107. .modal-block .title image{
  108. width:55rpx;
  109. height:50rpx;
  110. margin-right:6rpx;
  111. }
  112. .title .left view{
  113. height: 50rpx;
  114. font-size: 38rpx;
  115. font-weight: 500;
  116. color: #333333;
  117. }
  118. .content .line{
  119. height:55rpx;
  120. line-height: 55rpx;
  121. margin-bottom:7rpx;
  122. padding-left:24rpx;
  123. }
  124. .tiket-num text{
  125. color: #2A8DE2;
  126. text-decoration: underline;
  127. }
  128. .content .line-two{
  129. height:110rpx;
  130. line-height: 55rpx;
  131. overflow: hidden;
  132. -webkit-line-clamp: 2;
  133. display:-webkit-box;
  134. -webkit-box-orient:vertical;
  135. padding-left:24rpx;
  136. }
  137. .operate{
  138. height:84rpx;
  139. border-top: 2rpx solid #EFEFEF;
  140. display: flex;
  141. padding:0 10rpx 0 24rpx;
  142. align-items: center;
  143. justify-content: space-between;
  144. }
  145. .operate view{
  146. color: #4E4E4E;
  147. font-size: 38rpx;
  148. }
  149. .operate image{
  150. width:70rpx;
  151. height:70rpx;
  152. }
  153. .message-item.modal-block{
  154. width:702rpx;
  155. margin-bottom:16rpx;
  156. }
  157. .drop-block{
  158. display: flex;
  159. height: 74rpx;
  160. align-items: center;
  161. margin-top:4rpx;
  162. background:#fff;
  163. justify-content: space-between;
  164. padding:0 28rpx;
  165. }
  166. .van-dropdown-menu{
  167. height:74rpx!important;
  168. box-shadow:none!important;
  169. padding-right:50rpx;
  170. }
  171. .after-wrapper{
  172. margin-left:-56rpx;
  173. }
  174. .date-wrapper{
  175. height: 74rpx;
  176. display: flex;
  177. align-items: center;
  178. }
  179. .after-wrapper .arrow{
  180. width: 0;
  181. height: 0;
  182. border: 12rpx solid;
  183. border-color:
  184. #000 transparent transparent transparent ;
  185. margin:16rpx 0 0 8rpx;
  186. }
  187. .after-wrapper{
  188. flex:1;
  189. display: flex;
  190. align-items: center;
  191. justify-content: space-between;
  192. }
  193. .van-dropdown-menu__title:after {
  194. /* border-width:8rpx!important;
  195. margin:16rpx 0 0 8rpx!important; */
  196. display:none!important
  197. }
  198. .modal-block.modal-block-top{
  199. width:702rpx!important;
  200. }
  201. .no-msg{
  202. text-align: center;
  203. margin-top:200rpx;
  204. color:#999;
  205. font-size: 28rpx;
  206. }