groupOrder.wxss 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
  1. /* 拼团流程 */
  2. .order-top {
  3. width: 710rpx;
  4. height: 144rpx;
  5. border-radius: 24rpx;
  6. background-color: #FFFFFF;
  7. margin-top: 40rpx;
  8. margin-left: 20rpx;
  9. display: flex;
  10. padding-top: 24rpx;
  11. box-sizing: border-box;
  12. }
  13. .startGroup,
  14. .initFriend,
  15. .successGroup {
  16. width: 80rpx;
  17. height: 80rpx;
  18. text-align: center;
  19. }
  20. .arrows {
  21. width: 36rpx;
  22. height: 20rpx;
  23. margin-top: 20rpx;
  24. }
  25. .arrows image {
  26. width: 36rpx;
  27. height: 20rpx;
  28. }
  29. .startGroup view,
  30. .initFriend view,
  31. .successGroup view {
  32. font-size: 20rpx;
  33. color: #333333;
  34. }
  35. .startGroup {
  36. margin-left: 80rpx;
  37. margin-right: 60rpx;
  38. }
  39. .initFriend {
  40. margin-left: 70rpx;
  41. margin-right: 60rpx;
  42. }
  43. .successGroup {
  44. margin-left: 60rpx;
  45. }
  46. .startGroup image {
  47. width: 60rpx;
  48. height: 60rpx;
  49. }
  50. .initFriend image {
  51. width: 60rpx;
  52. height: 60rpx;
  53. }
  54. .successGroup image {
  55. width: 60rpx;
  56. height: 60rpx;
  57. }
  58. .order-content {
  59. width: 710rpx;
  60. height: auto;
  61. margin-top: 20rpx;
  62. background-color: #FFFFFF;
  63. margin-left: 20rpx;
  64. padding: 40rpx 20rpx 0 20rpx;
  65. box-sizing: border-box;
  66. text-align: center;
  67. border-radius: 24rpx;
  68. padding-bottom: 40rpx;
  69. }
  70. .order-content-top {
  71. display: flex;
  72. justify-content: center;
  73. align-items: center;
  74. }
  75. .order-content-top .line{
  76. width: 72rpx;
  77. height: 2rpx;
  78. background-color: #FA7D22;
  79. }
  80. .order-title {
  81. color: #333333;
  82. font-size: 36rpx;
  83. font-weight: 600;
  84. margin: 0 72rpx;
  85. }
  86. .order-init {
  87. display: flex;
  88. justify-content: center;
  89. margin-top: 80rpx;
  90. align-items: center;
  91. }
  92. .order-init .order-initiator {
  93. width: 120rpx;
  94. height: 120rpx;
  95. }
  96. .order-initiator image {
  97. width: 100%;
  98. height: 100%;
  99. border-radius: 50%;
  100. }
  101. .add {
  102. width: 36rpx;
  103. height: 36rpx;
  104. margin: 0 60rpx;
  105. }
  106. .add image {
  107. width: 100%;
  108. height: 100%;
  109. }
  110. .order-init .order-beInvited {
  111. width: 120rpx;
  112. height: 120rpx;
  113. }
  114. .order-beInvited image {
  115. width: 100%;
  116. height: 100%;
  117. border-radius: 50%;
  118. }
  119. .whoGroup {
  120. width: 120rpx;
  121. height: 100%;
  122. font-size: 48rpx;
  123. color: #F1F1F1;
  124. line-height: 120rpx;
  125. border-radius: 50%;
  126. border: 2rpx solid #F1F1F1;
  127. text-align: center;
  128. }
  129. .inviteFriends {
  130. width: 670rpx;
  131. height: 84rpx;
  132. line-height: 84rpx;
  133. background-color: #FA7D22;
  134. margin-top: 80rpx;
  135. border-radius: 42rpx;
  136. font-size: 32rpx;
  137. color: #FFFFFF;
  138. }
  139. .cancelGroup {
  140. width: 670rpx;
  141. height: 84rpx;
  142. border: 2rpx solid #E1E1E1;
  143. border-radius: 42rpx;
  144. line-height: 84rpx;
  145. margin-top: 20rpx;
  146. }
  147. .groupSuccess{
  148. width: 670rpx;
  149. height: 84rpx;
  150. border: 2rpx solid #E1E1E1;
  151. border-radius: 42rpx;
  152. line-height: 84rpx;
  153. margin-top: 80rpx;
  154. }