C端小程序
Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.

389 rader
6.2 KiB

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