微信小店联盟带货小程序

rules.wxss 2.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132
  1. /* pages/distribution/rules.wxss */
  2. .container {
  3. min-height: 100vh;
  4. background: #f5f5f5;
  5. padding-bottom: 120rpx;
  6. }
  7. /* 头部样式 */
  8. .header {
  9. background: linear-gradient(135deg, #FF4D4F, #FF7875);
  10. padding: 40rpx 30rpx;
  11. text-align: center;
  12. }
  13. .header .title {
  14. color: #fff;
  15. font-size: 36rpx;
  16. font-weight: bold;
  17. }
  18. /* 规则内容 */
  19. .rules-content {
  20. padding: 20rpx;
  21. }
  22. .rule-section {
  23. background: #fff;
  24. border-radius: 12rpx;
  25. padding: 30rpx;
  26. margin-bottom: 20rpx;
  27. }
  28. .section-title {
  29. display: flex;
  30. align-items: center;
  31. margin-bottom: 20rpx;
  32. }
  33. .section-title .iconfont {
  34. font-size: 36rpx;
  35. margin-right: 10rpx;
  36. }
  37. .section-title text {
  38. font-size: 32rpx;
  39. color: #333;
  40. font-weight: bold;
  41. }
  42. .section-content {
  43. color: #666;
  44. }
  45. .rule-item {
  46. display: flex;
  47. align-items: flex-start;
  48. margin-bottom: 16rpx;
  49. font-size: 28rpx;
  50. line-height: 1.5;
  51. }
  52. .rule-item:last-child {
  53. margin-bottom: 0;
  54. }
  55. .rule-item .dot {
  56. width: 12rpx;
  57. height: 12rpx;
  58. background: #ff4d4f;
  59. border-radius: 50%;
  60. margin: 16rpx 16rpx 0 0;
  61. flex-shrink: 0;
  62. }
  63. /* 佣金表格 */
  64. .commission-table {
  65. margin-top: 20rpx;
  66. border: 1rpx solid #eee;
  67. border-radius: 8rpx;
  68. }
  69. .table-header {
  70. display: grid;
  71. grid-template-columns: repeat(3, 1fr);
  72. background: #f8f8f8;
  73. padding: 20rpx;
  74. text-align: center;
  75. font-weight: bold;
  76. font-size: 26rpx;
  77. color: #333;
  78. }
  79. .table-row {
  80. display: grid;
  81. grid-template-columns: repeat(3, 1fr);
  82. padding: 20rpx;
  83. text-align: center;
  84. font-size: 26rpx;
  85. color: #666;
  86. border-top: 1rpx solid #eee;
  87. }
  88. /* 图标颜色 */
  89. .icon-user { color: #1890FF; }
  90. .icon-money { color: #52C41A; }
  91. .icon-wallet { color: #722ED1; }
  92. .icon-info { color: #FA8C16; }
  93. .icon-service { color: #1890FF; }
  94. /* 联系客服 */
  95. .contact-service {
  96. position: fixed;
  97. left: 0;
  98. right: 0;
  99. bottom: 0;
  100. height: 100rpx;
  101. background: #fff;
  102. display: flex;
  103. align-items: center;
  104. justify-content: center;
  105. box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05);
  106. }
  107. .contact-service .iconfont {
  108. font-size: 40rpx;
  109. margin-right: 10rpx;
  110. }
  111. .contact-service text {
  112. font-size: 32rpx;
  113. color: #333;
  114. }