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.

410 line
6.3 KiB

  1. @import "../../app.wxss";
  2. .coupons {
  3. width: 100%;
  4. background: #f6f6f6;
  5. position: relative;
  6. overflow: hidden;
  7. }
  8. .coupons-body {
  9. flex: 1;
  10. /* overflow: auto; */
  11. }
  12. .banner {
  13. width: 100%;
  14. }
  15. .banner image {
  16. width: 100%;
  17. display: block;
  18. }
  19. .coupons_info {
  20. width: 92%;
  21. height: 120rpx;
  22. display: flex;
  23. justify-content: space-between;
  24. padding: 0 4% 4%;
  25. background: #fff;
  26. }
  27. .coupons_info view {
  28. display: flex;
  29. flex-direction: column;
  30. }
  31. .coupons_info view:nth-child(1) text {
  32. font-size: 30rpx;
  33. margin-top: 10%;
  34. }
  35. .coupons_info view:nth-child(1) text:nth-child(1) text {
  36. color: #ff3434;
  37. font-size: 24rpx;
  38. border: 1px solid #ff3434;
  39. border-radius: 6rpx;
  40. margin-left: 2%;
  41. padding: 0 5rpx;
  42. }
  43. .coupons_info view:nth-child(1) text:nth-child(2),
  44. .coupons_info view:nth-child(1) text:nth-child(3) {
  45. color: #b8b8b8;
  46. font-size: 24rpx;
  47. margin-top: 4%;
  48. }
  49. .coupons_info view:nth-child(1) text:nth-child(2) text,
  50. .coupons_info view:nth-child(1) text:nth-child(3) text {
  51. color: #ff3434;
  52. font-size: 24rpx;
  53. }
  54. .coupons_info view:nth-child(2) text:nth-child(1) {
  55. font-size: 36rpx;
  56. color: #ff3434;
  57. margin-top: 40rpx;
  58. font-weight: bold;
  59. }
  60. .coupons_info view:nth-child(2) text:nth-child(2) {
  61. font-size: 24rpx;
  62. color: #b4b4b4;
  63. text-decoration: line-through;
  64. padding-left: 10rpx;
  65. padding-top: 4rpx;
  66. }
  67. .posi {
  68. width: 92%;
  69. display: flex;
  70. flex-direction: column;
  71. padding: 0 4%;
  72. background: #fff;
  73. margin-top: 2%;
  74. }
  75. .posi>view:nth-child(2) {
  76. width: 100%;
  77. height: 87rpx;
  78. display: flex;
  79. justify-content: space-between;
  80. border-top: 1px solid #f6f6f6;
  81. line-height: 87rpx;
  82. }
  83. .posi>view:nth-child(2) text:nth-child(1) {
  84. font-size: 30rpx;
  85. color: #a9a9a9;
  86. }
  87. .posi>view:nth-child(2) text:nth-child(2) {
  88. font-size: 30rpx;
  89. color: #a9a9a9;
  90. }
  91. .posi_logo {
  92. width: 100%;
  93. height: 156rpx;
  94. display: flex;
  95. margin-top: 30rpx;
  96. }
  97. .posi_logo view:nth-child(1) {
  98. width: 126rpx;
  99. height: 126rpx;
  100. border-radius: 50%;
  101. overflow: hidden;
  102. flex: 2;
  103. }
  104. .posi_logo view:nth-child(1) image {
  105. width: 100%;
  106. height: 100%;
  107. }
  108. .posi_logo view:nth-child(2) {
  109. display: flex;
  110. flex-direction: column;
  111. flex: 8;
  112. padding-top: 20rpx;
  113. padding-left: 30rpx;
  114. }
  115. .posi_logo view:nth-child(2) text:nth-child(1) {
  116. font-size: 30rpx;
  117. }
  118. .posi_logo view:nth-child(2) text:nth-child(2) {
  119. font-size: 24rpx;
  120. color: #b8b8b8;
  121. padding-top: 10rpx;
  122. }
  123. .notes view:nth-child(1) {
  124. width: 92%;
  125. height: 87rpx;
  126. padding: 0 4%;
  127. line-height: 87rpx;
  128. background: #fff;
  129. /* border-top: 1rpx solid #f5f5f5; */
  130. }
  131. .notes view:nth-child(1) text {
  132. font-size: 30rpx;
  133. font-weight: bold;
  134. }
  135. .notes view:nth-child(2) {
  136. width: 92%;
  137. height: auto;
  138. padding: 0 4% 4%;
  139. background: #fff;
  140. border-bottom: 1rpx solid #f5f5f5;
  141. display: flex;
  142. flex-direction: column;
  143. }
  144. .notes view:nth-child(2)>text {
  145. font-size: 28rpx;
  146. color: #a9a9a9;
  147. line-height: 56rpx;
  148. }
  149. .spot {
  150. width: 12rpx;
  151. height: 12rpx;
  152. display: inline-block;
  153. background: #a9a9a9;
  154. margin-right: 16rpx;
  155. position: relative;
  156. bottom: 4rpx;
  157. border-radius: 50%;
  158. }
  159. .buy-view {
  160. background: #fff;
  161. position: fixed;
  162. padding-top: 10rpx;
  163. height: 98rpx;
  164. bottom: 0rpx;
  165. left: 0;
  166. right: 0;
  167. }
  168. .buy {
  169. display: block;
  170. background: #00c0ff;
  171. height: 50rpx;
  172. width: 120rpx;
  173. margin: 0 auto;
  174. color: #fff;
  175. font-size: 28rpx;
  176. line-height: 50rpx;
  177. text-align: center;
  178. border-radius: 6rpx;
  179. }
  180. .coupons1-btn-gm {
  181. background: #00c0ff !important;
  182. border-radius: 10rpx !important;
  183. margin: 0 !important;
  184. padding: 0 !important;
  185. font-family: PingFangSC-Semibold;
  186. font-size: 28rpx;
  187. color: #fff !important;
  188. letter-spacing: 0;
  189. height: 50rpx !important;
  190. width: 138rpx !important;
  191. line-height: 50rpx !important;
  192. }
  193. .coupons1 {
  194. flex-direction: row;
  195. display: flex;
  196. padding: 30rpx;
  197. position: relative;
  198. height: 184rpx;
  199. border: 1px solid #eee;
  200. }
  201. .coupons1-border {
  202. height: 1rpx;
  203. /* width: 100%; */
  204. left: 30rpx;
  205. right: 30rpx;
  206. background: #f5f5f5;
  207. position: absolute;
  208. bottom: 0;
  209. }
  210. .coupons1-img {
  211. width: 248rpx;
  212. height: 184rpx;
  213. overflow: hidden;
  214. border-radius: 10rpx;
  215. }
  216. .coupons1-img image {
  217. width: 100%;
  218. height: 100%;
  219. }
  220. .coupons1-info {
  221. padding-left: 20rpx;
  222. }
  223. .coupons1-info-name {
  224. font-size: 28rpx;
  225. color: #000;
  226. letter-spacing: 0;
  227. line-height: 38rpx;
  228. }
  229. .coupons1-info-price {
  230. padding: 32rpx 0 0;
  231. }
  232. .i {
  233. font-size: 20rpx;
  234. font-style: normal;
  235. }
  236. .coupons1-info-price-p {
  237. display: inline-block;
  238. font-size: 36rpx;
  239. color: #f96563;
  240. line-height: 50rpx;
  241. }
  242. .tit {
  243. margin-top: 32rpx;
  244. }
  245. .coupons1-info-price-o {
  246. display: block;
  247. text-align: center;
  248. font-size: 26rpx;
  249. color: #b4b4b4;
  250. letter-spacing: 0.96rpx;
  251. text-decoration: line-through;
  252. line-height: 24rpx;
  253. }
  254. .coupons1-info-distance {
  255. font-size: 22rpx;
  256. color: #c0c0c0;
  257. letter-spacing: 0;
  258. padding-bottom: 10rpx;
  259. line-height: 30rpx;
  260. }
  261. .coupons1-info-address {
  262. font-size: 22rpx;
  263. color: #585858;
  264. letter-spacing: 0;
  265. line-height: 30rpx;
  266. }
  267. .coupons1-btn {
  268. position: absolute;
  269. width: 120rpx;
  270. top: 40rpx;
  271. right: 30rpx;
  272. }
  273. .coupons1-btn-gm {
  274. background: #00c0ff !important;
  275. border-radius: 10rpx !important;
  276. margin: 0 !important;
  277. padding: 0 !important;
  278. font-family: PingFangSC-Semibold;
  279. font-size: 28rpx;
  280. color: #fff !important;
  281. letter-spacing: 0;
  282. height: 50rpx !important;
  283. width: 138rpx !important;
  284. line-height: 50rpx !important;
  285. }
  286. .subtitle {
  287. font-size: 22rpx;
  288. color: #333;
  289. font-weight: 100;
  290. text-align: left;
  291. overflow: hidden;
  292. white-space: nowrap;
  293. text-overflow: ellipsis;
  294. width: 300rpx;
  295. height: 40rpx;
  296. }
  297. .coupons1-info-manjian {
  298. color: #fa7c7a;
  299. font-size: 20rpx;
  300. line-height: 34rpx;
  301. display: inline-block;
  302. }
  303. /**上拉加载更多**/
  304. .userinfo {
  305. display: flex;
  306. flex-direction: column;
  307. align-items: center;
  308. }
  309. .userinfo-avatar {
  310. width: 128rpx;
  311. height: 128rpx;
  312. margin: 20rpx;
  313. border-radius: 50%;
  314. }
  315. .userinfo-nickname {
  316. color: #aaa;
  317. }
  318. .sy {
  319. display: block;
  320. text-align: center;
  321. width: 120rpx!important;
  322. }
  323. .usermotto {
  324. margin-top: 200px;
  325. }
  326. /**/
  327. scroll-view {
  328. width: 100%;
  329. }
  330. .item {
  331. width: 90%;
  332. height: 300rpx;
  333. margin: 20rpx auto;
  334. background: brown;
  335. overflow: hidden;
  336. }
  337. .item .img {
  338. width: 430rpx;
  339. margin-right: 20rpx;
  340. float: left;
  341. }
  342. .title {
  343. font-size: 30rpx;
  344. display: block;
  345. margin: 30rpx auto;
  346. }
  347. .description {
  348. font-size: 26rpx;
  349. line-height: 15rpx;
  350. }