index.wxss 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229
  1. .content {
  2. display: flex;
  3. flex-direction: column;
  4. box-sizing: border-box;
  5. width: 100vw;
  6. height: 100vh;
  7. }
  8. .content {
  9. background-color: var(--rgb111);
  10. overflow: hidden;
  11. }
  12. .content .one {
  13. padding: 0 2vw;
  14. margin: 0 0 2vw 0;
  15. }
  16. .content .one video {
  17. width: 100%;
  18. height: 210px;
  19. overflow: hidden;
  20. border: 1px solid var(--rgbf1f);
  21. }
  22. .content .one .image {
  23. width: 100%;
  24. height: 210px;
  25. overflow: hidden;
  26. border: 1px solid var(--rgbf1f);
  27. }
  28. .content .two {
  29. position: relative;
  30. flex-grow: 1;
  31. padding: 0 2vw;
  32. }
  33. .content .two .two_1 {
  34. display: flex;
  35. justify-content: space-around;
  36. margin: 0 0 3vw 0;
  37. }
  38. .content .two .two_1 .list ._span {
  39. background-color: var(--rgbfff);
  40. color: var(--rgb000);
  41. padding: 1vw 4vw;
  42. font-size: 14px;
  43. border-radius: 5px;
  44. }
  45. .content .two .two_1 .active ._span {
  46. background-color: var(--rgbfa4);
  47. color: var(--rgbfff);
  48. }
  49. .content .two .two_2 .tab_1 {
  50. display: flex;
  51. flex-direction: column;
  52. width: 96vw;
  53. height: 57vh;
  54. overflow-y: auto;
  55. padding: 1vw 0 0 0;
  56. }
  57. .content .two .two_2 .tab_1 .btn {
  58. display: flex;
  59. justify-content: space-around;
  60. margin: 0 0 2vw 0;
  61. }
  62. .content .two .two_2 .tab_1 .btn .btn_1 .span {
  63. display: inline-block;
  64. background-color: var(--rgb313);
  65. color: var(--rgbfff);
  66. padding: 1vw 4vw;
  67. border-radius: 5px;
  68. }
  69. .content .two .two_2 .tab_1 .btn .btn_1 .span ._span {
  70. font-size: 14px;
  71. padding: 0 0 0 1vw;
  72. }
  73. .content .two .two_2 .tab_1 .title {
  74. font-size: 15px;
  75. color: var(--rgbfff);
  76. margin: 0 0 2vw 0;
  77. }
  78. .content .two .two_2 .tab_1 .actor {
  79. font-size: 15px;
  80. color: var(--rgbfff);
  81. margin: 0 0 2vw 0;
  82. }
  83. .content .two .two_2 .tab_1 .actor .actor_1 {
  84. margin: 0 0 2vw 0;
  85. }
  86. .content .two .two_2 .tab_1 .actor .actor_2 .actor_scroll_view {
  87. white-space: nowrap;
  88. }
  89. .content .two .two_2 .tab_1 .actor .actor_2 .actor_scroll_view .actorList {
  90. display: inline-block;
  91. text-align: center;
  92. margin: 0 6px 0 0;
  93. }
  94. .content .two .two_2 .tab_1 .actor .actor_2 .actor_scroll_view .actorList .image {
  95. width: 66px;
  96. height: 66px;
  97. overflow: hidden;
  98. border-radius: 90%;
  99. }
  100. .content .two .two_2 .tab_1 .actor .actor_2 .actor_scroll_view .actorList .name {
  101. font-size: 15px;
  102. }
  103. .content .two .two_2 .tab_1 .brief {
  104. font-size: 15px;
  105. color: var(--rgbfff);
  106. margin: 0 0 2vw 0;
  107. }
  108. .content .two .two_2 .tab_1 .other .other_1 {
  109. font-size: 15px;
  110. color: var(--rgbfff);
  111. margin: 0 0 2vw 0;
  112. }
  113. .content .two .two_2 .tab_1 .other .other_2 {
  114. display: flex;
  115. flex-wrap: wrap;
  116. }
  117. .content .two .two_2 .tab_1 .other .other_2 .firmvideoList {
  118. width: 48%;
  119. margin: 0 10px 5px 0;
  120. }
  121. .content .two .two_2 .tab_1 .other .other_2 .firmvideoList .image {
  122. width: 100%;
  123. height: 100px;
  124. overflow: hidden;
  125. border-radius: 5px;
  126. box-shadow: 0 0 5px var(--rgbf1f);
  127. margin: 0 0 5px 0;
  128. }
  129. .content .two .two_2 .tab_1 .other .other_2 .firmvideoList .name {
  130. font-size: 14px;
  131. color: var(--rgbfff);
  132. margin: 0 0 5px 0;
  133. }
  134. .content .two .two_2 .tab_1 .other .other_2 .firmvideoList .other {
  135. display: flex;
  136. color: var(--rgbfff);
  137. font-size: 12px;
  138. justify-content: space-between;
  139. }
  140. .content .two .two_2 .tab_1 .other .other_2 .firmvideoList:nth-child(2n) {
  141. margin: 0 0 5px 0;
  142. }
  143. .content .two .two_2 .tab_2 {
  144. display: flex;
  145. flex-direction: column;
  146. width: 96vw;
  147. height: 57vh;
  148. overflow-y: auto;
  149. padding: 1vw 0 0 0;
  150. position: relative;
  151. }
  152. .content .two .two_2 .tab_2 .tab_2_1 {
  153. display: flex;
  154. flex-direction: column;
  155. }
  156. .content .two .two_2 .tab_2 .tab_2_1 .discussList {
  157. margin: 0 0 2vw 0;
  158. background-color: var(--rgb000);
  159. padding: 2vw;
  160. border-radius: 5px;
  161. }
  162. .content .two .two_2 .tab_2 .tab_2_1 .discussList .dis_1 {
  163. display: flex;
  164. margin: 0 0 1vw 0;
  165. }
  166. .content .two .two_2 .tab_2 .tab_2_1 .discussList .dis_1 .l {
  167. width: 8vw;
  168. height: 8vw;
  169. margin: 0 2vw 0 0;
  170. }
  171. .content .two .two_2 .tab_2 .tab_2_1 .discussList .dis_1 .l .image {
  172. width: 100%;
  173. height: 100%;
  174. border-radius: 90%;
  175. }
  176. .content .two .two_2 .tab_2 .tab_2_1 .discussList .dis_1 .c {
  177. flex-grow: 1;
  178. font-size: 14px;
  179. color: var(--rgbfff);
  180. padding: 1vw 0;
  181. }
  182. .content .two .two_2 .tab_2 .tab_2_1 .discussList .dis_1 .r {
  183. font-size: 12px;
  184. color: var(--rgbf1f);
  185. padding: 2vw 0 0 0;
  186. }
  187. .content .two .two_2 .tab_2 .tab_2_1 .discussList .dis_2 {
  188. font-size: 15px;
  189. color: var(--rgbfff);
  190. }
  191. .content .two .two_2 .tab_2 .chatBtn {
  192. position: fixed;
  193. width: 100vw;
  194. bottom: 5vw;
  195. right: 4vw;
  196. text-align: right;
  197. }
  198. .content .two .two_2 .tab_2 .chatBtn button {
  199. width: 50px;
  200. height: 50px;
  201. line-height: 50px;
  202. padding: 0;
  203. border-radius: 90%;
  204. font-size: 14px;
  205. font-weight: bold;
  206. background-color: var(--rgbfa4);
  207. color: var(--rgbfff);
  208. }
  209. .scroll-view {
  210. position: absolute;
  211. top: 0;
  212. left: 0;
  213. right: 0;
  214. bottom: 0;
  215. }
  216. .scroll-view .list-scroll-view {
  217. display: flex;
  218. flex-direction: column;
  219. }
  220. .is_bottom {
  221. text-align: center;
  222. }
  223. .is_bottom text {
  224. padding: 2vw 0;
  225. display: inline-block;
  226. color: #858585;
  227. font-size: 14px;
  228. }