C端小程序
Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.

183 řádky
2.7 KiB

  1. .flashSale,page{
  2. width: 100%;
  3. background: #f5f5f5;
  4. padding-bottom: 30rpx;
  5. }
  6. .flashSale > view:nth-of-type(1){
  7. margin-top: 0!important;
  8. }
  9. .loading {
  10. text-align: center;
  11. height: 80rpx;
  12. line-height: 80rpx;
  13. font-size: 26rpx;
  14. color: #999;
  15. }
  16. .loading image {
  17. width: 60rpx;
  18. height: 60rpx;
  19. vertical-align: middle;
  20. margin-right: 10rpx;
  21. }
  22. .flashSaleItemWrap {
  23. width: 100%;
  24. margin-top: 30rpx;
  25. }
  26. .flashSaleItem {
  27. width: 690rpx;
  28. margin: 0 auto;
  29. display: flex;
  30. flex-direction: column;
  31. background: #fff;
  32. border-radius: 16rpx;
  33. padding-bottom: 30rpx;
  34. }
  35. .lines {
  36. display: block;
  37. width: 100%;
  38. }
  39. .flashSaleItemTop {
  40. display: flex;
  41. flex-direction: row;
  42. padding: 28rpx 30rpx 10rpx;
  43. }
  44. .flashSaleItemTopL {
  45. flex: 1;
  46. }
  47. .food {
  48. width: 180rpx;
  49. border-radius: 10rpx;
  50. height: 180rpx;
  51. }
  52. .flashSaleItemTopR {
  53. flex: 2;
  54. flex-direction: column;
  55. }
  56. .flashSaleItemTopRTop {
  57. display: flex;
  58. flex-direction: column;
  59. }
  60. .foodname {
  61. font-size: 32rpx;
  62. height: 40rpx;
  63. line-height: 40rpx;
  64. color: #000;
  65. display: inline-block;
  66. width: 406rpx;
  67. overflow: hidden;
  68. }
  69. .small {
  70. font-size: 24rpx;
  71. color: #333;
  72. letter-spacing: 0;
  73. margin-top: 15rpx;
  74. }
  75. .flashSaleItemTopRBottom {
  76. margin-top: 24rpx;
  77. }
  78. .presentPrice {
  79. font-size: 36rpx;
  80. color: #f96563;
  81. }
  82. .originalPrice {
  83. margin-left: 20rpx;
  84. color: #b4b4b4;
  85. text-decoration: line-through;
  86. font-size: 24rpx;
  87. }
  88. .flashSaleItemBottom {
  89. position: relative;
  90. padding: 0 30rpx;
  91. }
  92. .remainingTime {
  93. font-size: 28rpx;
  94. color: #b4b4b4;
  95. }
  96. .realRemainingTime {
  97. color: #FF4949;
  98. font-size: 28rpx;
  99. }
  100. .flashSaleItemBottomBottm {
  101. display: flex;
  102. flex-direction: row;
  103. }
  104. .view1 {
  105. width: 350rpx;
  106. display: block;
  107. line-height: 33rpx;
  108. }
  109. .remainingNumber {
  110. font-size: 26rpx;
  111. color: #b4b4b4;
  112. margin-right: 10rpx;
  113. }
  114. .realnumber {
  115. margin-left: 10rpx;
  116. color: #f96563;
  117. font-size: 28rpx;
  118. }
  119. .buy {
  120. position: absolute;
  121. top: 27rpx;
  122. bottom: 0;
  123. right: 30rpx;
  124. width: 140rpx;
  125. height: 58rpx;
  126. line-height: 58rpx;
  127. text-align: center;
  128. background: #ff4949;
  129. border-radius: 60rpx;
  130. color: #fff;
  131. font-size: 28rpx;
  132. border: 2rpx solid #ff4949;
  133. }
  134. .sale {
  135. font-size: 24rpx;
  136. color: #999;
  137. letter-spacing: 0;
  138. display: inline-block;
  139. margin-right: 6rpx;
  140. }
  141. .yuan {
  142. font-size: 24rpx;
  143. color: #ff4949;
  144. letter-spacing: 0;
  145. }
  146. .active {
  147. background: #fff;
  148. width: 140rpx;
  149. height: 58rpx;
  150. line-height: 58rpx;
  151. color: #ff4949;
  152. border: 2rpx solid #ff4949;
  153. }
  154. progress{
  155. display: inline-block;
  156. width: 200rpx;
  157. border-radius:60rpx;
  158. overflow: hidden;
  159. }