排队支付小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

203 lines
3.8 KiB

  1. page{
  2. background: #fff;
  3. }
  4. .page-bg{
  5. width: 750rpx;
  6. height: 1492rpx;
  7. background: url("https://common-1257637852.cos.ap-guangzhou.myqcloud.com/paidui-pay/homepage-bg.png") no-repeat center center;
  8. background-size:cover;
  9. padding: 0 30rpx;
  10. }
  11. .merchant-information{
  12. display: flex;
  13. justify-content: left;
  14. align-items: center;
  15. padding: 50rpx 0;
  16. }
  17. image.default-avatar{
  18. width: 110rpx;
  19. height: 110rpx;
  20. background-size: cover;
  21. }
  22. .information-content{
  23. margin-left: 30rpx;
  24. }
  25. .information-name{
  26. font-family: "Microsoft YaHei";
  27. font-size: 32rpx;
  28. color: #fff;
  29. font-weight: bold;
  30. }
  31. .address-text{
  32. font-family: "Microsoft YaHei";
  33. font-size: 24rpx;
  34. color: #fff;
  35. margin-top: 15rpx;
  36. }
  37. .revenue-information{
  38. display: flex;
  39. justify-content: space-between;
  40. align-items: center;
  41. width: 691rpx;
  42. height: 200rpx;
  43. background: url("https://common-1257637852.cos.ap-guangzhou.myqcloud.com/paidui-pay/income-bg.png") no-repeat center center;
  44. background-size:cover;
  45. padding: 0 60rpx;
  46. }
  47. .projected-revenue-content{
  48. text-align: center;
  49. }
  50. .projected-revenue-item{
  51. display: flex;
  52. justify-content: left;
  53. align-items: baseline;
  54. }
  55. .character-style{
  56. font-family: "Microsoft YaHei";
  57. font-size: 30rpx;
  58. color: #454545;
  59. }
  60. .character-price{
  61. font-family: "Din";
  62. font-size: 50rpx;
  63. color: #454545;
  64. font-weight: bold;
  65. margin-left: 10rpx;
  66. }
  67. .character-text{
  68. font-family: "Microsoft YaHei";
  69. font-size: 28rpx;
  70. color: #454545;
  71. font-weight: bold;
  72. }
  73. image.help-icon{
  74. width: 30rpx;
  75. height: 30rpx;
  76. background-size: cover;
  77. margin-left: 10rpx;
  78. }
  79. .revenue-item-text{
  80. display: flex;
  81. justify-content: center;
  82. align-items: center;
  83. margin-top: 10rpx;
  84. }
  85. .segmentation{
  86. width: 1rpx;
  87. height: 90rpx;
  88. background: #E6E3E3;
  89. }
  90. .recent-orders-content{
  91. background: #fff;
  92. margin-top: -1rpx;
  93. }
  94. .recent-orders-title{
  95. display: flex;
  96. justify-content: left;
  97. align-items: center;
  98. padding: 30rpx;
  99. }
  100. image.title-stlye{
  101. width: 15rpx;
  102. height: 19rpx;
  103. background-size: cover;
  104. margin-right: 20rpx;
  105. }
  106. .title-text{
  107. font-family: "Microsoft YaHei";
  108. font-size: 30rpx;
  109. color: #454545;
  110. font-weight: bold;
  111. }
  112. .ordering-information{
  113. padding-bottom: 30rpx;
  114. }
  115. .order-number{
  116. font-family: "Microsoft YaHei";
  117. font-size: 26rpx;
  118. color: #454545;
  119. padding: 0 30rpx;
  120. }
  121. .ordering-information-item{
  122. display: flex;
  123. justify-content: left;
  124. align-items: center;
  125. padding: 30rpx;
  126. }
  127. .ordering-pic{
  128. width: 120rpx;
  129. height: 120rpx;
  130. background-size: cover;
  131. border-radius: 15rpx;
  132. }
  133. image.order-chart{
  134. width: 120rpx;
  135. height: 120rpx;
  136. background-size: cover;
  137. border-radius: 15rpx;
  138. }
  139. .ordering-text{
  140. margin-left: 30rpx;
  141. }
  142. .ordering-text-title{
  143. font-family: "Microsoft YaHei";
  144. font-size: 30rpx;
  145. color: #454545;
  146. }
  147. .amount-of-money{
  148. font-family: "Microsoft YaHei";
  149. font-size: 24rpx;
  150. color: #999;
  151. padding: 10rpx 0;
  152. }
  153. span.price-style{
  154. font-family: "Microsoft YaHei";
  155. font-size: 24rpx;
  156. color: #F52F3E;
  157. }
  158. .order-time{
  159. font-family: "Microsoft YaHei";
  160. font-size: 24rpx;
  161. color: #999;
  162. }
  163. .order-status{
  164. display: flex;
  165. justify-content: space-around;
  166. align-items: center;
  167. padding: 30rpx 0;
  168. border-top: 1rpx solid #eeeeee;
  169. }
  170. button.refund-button{
  171. width: 120rpx;
  172. height: 48rpx;
  173. line-height: 48rpx;
  174. font-family: "Microsoft YaHei";
  175. font-size: 24rpx;
  176. color: #454545;
  177. border-color: #E5E5E5;
  178. background: #fff;
  179. border-radius: 100rpx;
  180. margin: 0;
  181. margin-left: 500rpx;
  182. border: 1rpx solid #E5E5E5;
  183. }
  184. button.refunded-button-style{
  185. width: 130rpx;
  186. height: 48rpx;
  187. line-height: 48rpx;
  188. font-family: "Microsoft YaHei";
  189. font-size: 24rpx;
  190. color: #999 !important;
  191. background: #fff;
  192. border-radius: 100rpx;
  193. margin: 0;
  194. margin-left: 500rpx;
  195. border: 1rpx solid #E5E5E5;
  196. }
  197. .divider-style{
  198. width: 690rpx;
  199. height: 10rpx;
  200. background: #f7f7f7;
  201. }
  202. button::atter{
  203. border:none;
  204. }