dydetail.wxss 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179
  1. @charset "UTF-8";
  2. /* 页面左右间距 */
  3. /* 文字尺寸 */
  4. /*文字颜色*/
  5. /* 边框颜色 */
  6. /*颜色*/
  7. /* 图片加载中颜色 */
  8. /* 行为相关颜色 */
  9. /* 功能栏字体大小 */
  10. /*功能栏左侧小图标*/
  11. .jj.data-v-10f54241 {
  12. margin: 20rpx 30rpx;
  13. display: flex;
  14. flex-direction: column;
  15. }
  16. .jj .jj-title.data-v-10f54241 {
  17. font-size: 28rpx;
  18. font-weight: 500;
  19. }
  20. .jj .jj-content.data-v-10f54241 {
  21. margin-left: 20rpx;
  22. font-size: 24rpx;
  23. font-weight: 500;
  24. line-height: 36rpx;
  25. }
  26. .jj .jj-content .jj-xq text.data-v-10f54241 {
  27. color: #03A9F4;
  28. }
  29. .dy-info.data-v-10f54241 {
  30. width: 750rpx;
  31. height: 197rpx;
  32. background-color: #ff6d6e;
  33. padding: 0 30rpx;
  34. color: #fff;
  35. }
  36. .dy-info .user-logo.data-v-10f54241 {
  37. flex-shrink: 0;
  38. height: 100rpx;
  39. width: 100rpx;
  40. border-radius: 50%;
  41. }
  42. .dy-info .user-logo image.data-v-10f54241 {
  43. width: 100%;
  44. height: 100%;
  45. border-radius: 50%;
  46. }
  47. .dy-info .user-num.data-v-10f54241 {
  48. flex-grow: 1;
  49. padding-left: 10rpx;
  50. font-size: 24rpx;
  51. font-weight: 500;
  52. }
  53. .dy-info .user-num .user-name.data-v-10f54241 {
  54. font-size: 34rpx;
  55. font-weight: 600;
  56. padding-right: 20rpx;
  57. padding: 0 20rpx 10rpx 0;
  58. }
  59. .dy-info .dy-btn.data-v-10f54241 {
  60. flex-shrink: 0;
  61. text-align: center;
  62. width: 136rpx;
  63. line-height: 66rpx;
  64. background: #fff;
  65. border-radius: 10rpx;
  66. font-size: 28rpx;
  67. font-weight: 500;
  68. color: #ff6061;
  69. }
  70. .art-list.data-v-10f54241 {
  71. background-color: #fff;
  72. width: 750rpx;
  73. font-size: 31rpx;
  74. font-weight: 500;
  75. color: #323232;
  76. }
  77. .art-item.data-v-10f54241 {
  78. width: 691rpx;
  79. border-bottom: #e1e1e1 1px solid;
  80. margin: auto;
  81. }
  82. .art-item.data-v-10f54241:last-of-type {
  83. border-bottom: none;
  84. }
  85. .art-item-zero.data-v-10f54241 {
  86. height: 153rpx;
  87. flex-direction: column;
  88. justify-content: space-between;
  89. align-items: flex-start;
  90. padding: 20rpx 0;
  91. border-bottom: #e1e1e1 1px solid;
  92. }
  93. .art-item-one.data-v-10f54241 {
  94. height: 195rpx;
  95. margin: auto;
  96. padding: 30rpx 0 20rpx;
  97. }
  98. .art-item-one .art-left.data-v-10f54241 {
  99. height: 100%;
  100. flex-direction: column;
  101. justify-content: space-between;
  102. align-items: flex-start;
  103. padding-right: 40rpx;
  104. }
  105. .art-item-one .art-right.data-v-10f54241 {
  106. width: 227rpx;
  107. height: 145rpx;
  108. border-radius: 10rpx;
  109. flex-shrink: 0;
  110. }
  111. .art-item-one .art-right image.data-v-10f54241 {
  112. width: 100%;
  113. height: 100%;
  114. border-radius: 10rpx;
  115. }
  116. .art-item-three.data-v-10f54241 {
  117. height: 345rpx;
  118. flex-direction: column;
  119. justify-content: space-between;
  120. align-items: flex-start;
  121. padding: 30rpx 0;
  122. }
  123. .art-item-three .art-img-list.data-v-10f54241 {
  124. width: 100%;
  125. height: 145rpx;
  126. }
  127. .art-item-three .art-img-list image.data-v-10f54241 {
  128. width: 220rpx;
  129. height: 145rpx;
  130. border-radius: 10rpx;
  131. margin-right: 15rpx;
  132. }
  133. .art-item-three .art-img-list image.data-v-10f54241:last-child {
  134. margin-right: 0;
  135. }
  136. .hot.data-v-10f54241 {
  137. width: 22rpx;
  138. height: 22rpx;
  139. margin-right: 10rpx;
  140. }
  141. .art-tit.data-v-10f54241 {
  142. font-size: 28rpx;
  143. line-height: 1.2;
  144. }
  145. .art-time.data-v-10f54241 {
  146. display: inline-block;
  147. font-size: 24rpx;
  148. font-weight: 500;
  149. color: #7f8699;
  150. }
  151. .art-time text.data-v-10f54241 {
  152. margin-right: 10rpx;
  153. }
  154. .jj-top.data-v-10f54241 {
  155. margin-top: 20rpx;
  156. line-height: 55rpx;
  157. background-color: #fff;
  158. padding-left: 20rpx;
  159. }
  160. .jj-top .sh.data-v-10f54241 {
  161. display: inline-block;
  162. width: 6rpx;
  163. height: 26rpx;
  164. background-color: #e50112;
  165. margin: 18rpx 12rpx 0 0;
  166. border-radius: 3rpx;
  167. font-size: 26rpx;
  168. }
  169. .jj-content .menban.data-v-10f54241 {
  170. background: #fff;
  171. line-height: 50rpx;
  172. width: 100%;
  173. z-index: 9;
  174. position: absolute;
  175. bottom: 0;
  176. text-align: center;
  177. background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), white);
  178. }