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.

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