index.wxss 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. .authority {
  2. height: 100%;
  3. padding: 0rpx 20rpx;
  4. }
  5. .authority .module {
  6. margin-bottom: 30rpx;
  7. }
  8. .authority .module .topic {
  9. font-size: 38rpx;
  10. font-weight: bold;
  11. }
  12. .authority .module .explain {
  13. margin: 10rpx 0rpx;
  14. font-size: 24rpx;
  15. }
  16. .authority .module .works {
  17. display: flex;
  18. justify-content: space-between;
  19. flex-wrap: wrap;
  20. }
  21. .authority .module .works .work {
  22. margin: 10rpx 0rpx;
  23. }
  24. .authority .module .works .work .content {
  25. position: relative;
  26. font-size: 0px;
  27. }
  28. .authority .module .works .work .content .cover {
  29. width: 344rpx;
  30. height: 194rpx;
  31. border-radius: 8rpx;
  32. }
  33. .authority .module .works .work .content .audioBox {
  34. position: relative;
  35. }
  36. .authority .module .works .work .content .audioBox .audioPlay {
  37. position: absolute;
  38. left: 0px;
  39. top: 0px;
  40. bottom: 0px;
  41. right: 0px;
  42. margin: auto;
  43. width: 220rpx;
  44. height: 174rpx;
  45. display: flex;
  46. align-items: center;
  47. justify-content: center;
  48. }
  49. .authority .module .works .work .content .audioBox .audioPlay .audioPlayBg {
  50. width: 150rpx;
  51. height: 150rpx;
  52. }
  53. .authority .module .works .work .content .audioBox .audioPlay .audioPlayZhen {
  54. position: absolute;
  55. right: 30rpx;
  56. top: 16rpx;
  57. width: 32rpx;
  58. height: 40rpx;
  59. }
  60. .authority .module .works .work .content .audioBox .audioPlay .cover {
  61. position: absolute;
  62. width: 130rpx;
  63. height: 130rpx;
  64. border-radius: 50%;
  65. }
  66. .authority .module .works .work .content .mask {
  67. position: absolute;
  68. width: 100%;
  69. height: 40rpx;
  70. bottom: 0px;
  71. background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), transparent);
  72. display: flex;
  73. align-items: center;
  74. }
  75. .authority .module .works .work .content .mask .fb {
  76. margin: 6rpx 10rpx;
  77. width: 26rpx;
  78. height: 26rpx;
  79. }
  80. .authority .module .works .work .content .mask .fb-num {
  81. font-size: 24rpx;
  82. color: white;
  83. }
  84. .authority .module .works .work .title {
  85. width: 344rpx;
  86. margin-top: 6rpx;
  87. font-size: 32rpx;
  88. }