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.

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