C端小程序
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.

302 lines
4.4 KiB

  1. .box{
  2. height: 100%;
  3. background: linear-gradient(180deg,rgba(253,131,45,1) 0%,rgba(254,74,22,1) 100%);
  4. }
  5. .container {
  6. background: #fff;
  7. width: 92%;
  8. margin: 8% auto 6%;
  9. border-radius: 16rpx;
  10. }
  11. page {
  12. background: linear-gradient(180deg,rgba(253,131,45,1) 0%,rgba(254,74,22,1) 100%);
  13. height: auto !important;
  14. }
  15. .zhuangtai{
  16. margin-bottom: 20rpx;
  17. }
  18. .panel, .zhuangtai image {
  19. position: relative;
  20. width: 600rpx;
  21. display: block;
  22. border-radius: 10rpx;
  23. margin: 0 auto;
  24. padding: 0;
  25. z-index: 10000;
  26. }
  27. .pane2 {
  28. background: #fff;
  29. opacity: 0.6;
  30. }
  31. .pane2 image {
  32. width: 500rpx;
  33. display: block;
  34. margin: 40rpx auto 0;
  35. }
  36. .buy {
  37. background: #fff;
  38. height: 88rpx;
  39. width: 98%;
  40. color: #7e7e7e;
  41. line-height: 88rpx;
  42. border-radius: 16rpx;
  43. border: 1px solid #eee;
  44. }
  45. .barcode {
  46. height: 100rpx;
  47. width: 510rpx;
  48. margin: 0 auto;
  49. }
  50. .barnum {
  51. background: #fff;
  52. height: 88rpx;
  53. width: 100%;
  54. margin: 0 auto;
  55. line-height: 88rpx;
  56. border: 2rpx solid #ccc;
  57. border-radius: 10px;
  58. font-size: 36rpx;
  59. color: #333;
  60. letter-spacing: 0;
  61. text-align: center;
  62. }
  63. .barnum text {
  64. display: inline-block;
  65. vertical-align: top;
  66. font-size: 24rpx;
  67. color: #999;
  68. letter-spacing: 0;
  69. margin-right: 6rpx;
  70. }
  71. .barcode > canvas {
  72. width: 510rpx;
  73. height: 100rpx;
  74. }
  75. .qrcode {
  76. position: relative;
  77. height: 350rpx;
  78. width: 350rpx;
  79. display: flex;
  80. flex-direction: column;
  81. justify-content: flex-end;
  82. align-items: center;
  83. margin: 0 auto;
  84. }
  85. .qrcode > canvas {
  86. width: 350rpx;
  87. height: 350rpx;
  88. }
  89. .coupon_detail {
  90. position: relative;
  91. }
  92. .coupon_detail .wmfl {
  93. position: absolute;
  94. width: 120rpx;
  95. height: 120rpx;
  96. left: 0;
  97. right: 0;
  98. margin: auto;
  99. top: -50rpx;
  100. border-radius: 50%;
  101. overflow: hidden;
  102. }
  103. .coupon_detail image {
  104. display: block;
  105. width: 100%;
  106. height: 100%;
  107. }
  108. .coupon_detail .fr {
  109. width: 100%;
  110. text-align: center;
  111. }
  112. .coupon_detail .title {
  113. font-size: 32rpx;
  114. color: #1f2d3d;
  115. letter-spacing: 0;
  116. text-align: center;
  117. display: block;
  118. padding-top: 92rpx;
  119. line-height: 45rpx;
  120. }
  121. .line {
  122. height: 10rpx;
  123. display: block;
  124. width: 100%;
  125. margin-top: 20rpx;
  126. }
  127. .time {
  128. font-size: 26rpx;
  129. color: #999;
  130. letter-spacing: 0;
  131. text-align: center;
  132. line-height: 37rpx;
  133. padding: 0 10rpx;
  134. }
  135. .time text {
  136. font-size: 26rpx;
  137. color: red;
  138. }
  139. .money text {
  140. color: red;
  141. }
  142. .money del {
  143. color: #999;
  144. font-size: 26rpx;
  145. text-decoration: line-through;
  146. margin-left: 20rpx;
  147. }
  148. .clearfix:after {
  149. content: ".";
  150. display: block;
  151. height: 0;
  152. clear: both;
  153. visibility: hidden;
  154. }
  155. .timevalidity {
  156. text-align: center;
  157. }
  158. .timevalidity text:nth-of-type(1) {
  159. font-size: 22rpx;
  160. color: #999;
  161. letter-spacing: 0;
  162. text-align: left;
  163. }
  164. .timevalidity text:nth-of-type(2) {
  165. font-size: 22rpx;
  166. color: #999;
  167. letter-spacing: 0;
  168. text-align: left;
  169. }
  170. .timevalidity text:nth-of-type(3) {
  171. font-size: 22rpx;
  172. color: #999;
  173. letter-spacing: 0;
  174. text-align: left;
  175. }
  176. .tit {
  177. padding: 53rpx 0 0;
  178. text-indent: 30rpx;
  179. font-size: 24rpx;
  180. color: #919191;
  181. letter-spacing: 0;
  182. }
  183. .notes view:nth-child(1) {
  184. width: 92%;
  185. height: 87rpx;
  186. padding: 0 4%;
  187. line-height: 87rpx;
  188. background: #fff;
  189. }
  190. .notes view:nth-child(1) text {
  191. font-size: 30rpx;
  192. color: #333;
  193. letter-spacing: 0;
  194. }
  195. .notes view:nth-child(2) {
  196. width: 92%;
  197. padding: 0 4%;
  198. background: #fff;
  199. display: flex;
  200. flex-direction: column;
  201. }
  202. .notes view:nth-child(2) > text {
  203. font-size: 24rpx;
  204. color: #333;
  205. letter-spacing: 0;
  206. line-height: 42rpx;
  207. }
  208. .notes {
  209. border-bottom-left-radius: 16rpx;
  210. border-bottom-right-radius: 16rpx;
  211. padding-bottom: 30rpx;
  212. }
  213. .note view {
  214. height: 48rpx;
  215. line-height: 48rpx;
  216. }
  217. .note view text {
  218. display: inline-block;
  219. }
  220. .note text:nth-of-type(1) {
  221. width: 22%;
  222. text-indent: 30rpx;
  223. text-align: left;
  224. font-size: 24rpx;
  225. color: #333;
  226. letter-spacing: 1.16rpx;
  227. }
  228. .note text:nth-of-type(2) {
  229. width: 67%;
  230. font-size: 24rpx;
  231. color: #333;
  232. letter-spacing: 1.16rpx;
  233. }
  234. .manjian {
  235. margin-left: 26rpx;
  236. color: #999!important;
  237. font-size: 26rpx !important;
  238. text-align: center;
  239. }
  240. .moneys {
  241. font-size: 40rpx !important;
  242. color: #ff4949 !important;
  243. letter-spacing: 0;
  244. text-align: right;
  245. }
  246. .game-entry{
  247. width: 690rpx;
  248. height: 140rpx;
  249. margin: 10rpx auto 0;
  250. }
  251. .gameimg{
  252. display: block;
  253. width: 100%;
  254. height: 140rpx;
  255. }
  256. .refund{
  257. display: inline-block;
  258. font-size: 26rpx!important;
  259. color: red!important;
  260. border: 1px solid red;
  261. padding: 3rpx;
  262. }