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.

287 rivejä
4.0 KiB

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