抖音小程序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.

259 lines
4.5 KiB

  1. .commBox {
  2. width: 96%;
  3. margin: 27rpx auto;
  4. background-color: #fff;
  5. border-radius: 20rpx;
  6. overflow: hidden;
  7. }
  8. .titleBox {
  9. width: 100%;
  10. overflow: hidden;
  11. height: 140rpx;
  12. background-image: url("https://formall.oss-accelerate.aliyuncs.com/cimg/v20211214/home_icon_d9qt.png");
  13. background-size: 100% 100%;
  14. background-repeat: no-repeat;
  15. }
  16. .titleImg {
  17. width: 180rpx;
  18. height: 40rpx;
  19. float: left;
  20. margin: 20rpx;
  21. display: block;
  22. }
  23. .specialTitle {
  24. float: left;
  25. margin: 10rpx 20rpx;
  26. font-size: 38rpx;
  27. font-family: YouSheBiaoTiHei;
  28. font-weight: 600;
  29. color: #37332d;
  30. }
  31. .more {
  32. float: right;
  33. font-size: 24rpx;
  34. font-family: OPPOSans;
  35. font-weight: 500;
  36. color: #866741;
  37. margin: 16rpx 20rpx;
  38. }
  39. .rup {
  40. width: 13rpx;
  41. height: 20rpx;
  42. margin: 2rpx 0 0 6rpx;
  43. }
  44. .contBox {
  45. overflow: hidden;
  46. /* width: 96%; */
  47. margin: -50rpx auto 0 auto;
  48. }
  49. .topImg {
  50. width: 100%;
  51. height: 140rpx;
  52. border-radius: 16rpx;
  53. margin-bottom: 40rpx;
  54. /* background-color: chartreuse; */
  55. }
  56. .topImg image {
  57. border-radius: 16rpx;
  58. width: 100%;
  59. height: 100%;
  60. }
  61. .itemBox {
  62. overflow: hidden;
  63. display: -webkit-box;
  64. overflow-x: scroll;
  65. -webkit-overflow-scrolling: touch;
  66. margin: 20rpx auto;
  67. width: 96%;
  68. }
  69. .itemBox::-webkit-scrollbar {
  70. display: none;
  71. }
  72. .item {
  73. width: 240rpx;
  74. /* background-color: antiquewhite; */
  75. margin-right: 20rpx;
  76. }
  77. .itemImg {
  78. position: relative;
  79. width: 240rpx;
  80. height: 240rpx;
  81. border-radius: 16rpx;
  82. /* background-color: aquamarine; */
  83. }
  84. .itemImg image {
  85. width: 100%;
  86. height: 100%;
  87. border-radius: 16rpx;
  88. }
  89. .sellout {
  90. position: absolute;
  91. top: 0;
  92. left: 0;
  93. background-color: rgba(0, 0, 0, 0.5);
  94. width: 240rpx;
  95. height: 240rpx;
  96. border-radius: 20rpx;
  97. }
  98. .selloutImg {
  99. width: 195rpx !important;
  100. height: 154rpx !important;
  101. margin: 18% auto;
  102. display: block;
  103. }
  104. .titleNameBox {
  105. /* font-size: 18px; */
  106. height: 80rpx;
  107. line-height: 40rpx;
  108. display: flex;
  109. align-items: center;
  110. justify-content: center;
  111. }
  112. .titleName {
  113. width: 100%;
  114. font-size: 28rpx;
  115. font-family: OPPOSans;
  116. font-weight: 500;
  117. color: #333;
  118. margin-top: 10rpx;
  119. display: -webkit-box;
  120. -webkit-line-clamp: 2;
  121. -webkit-box-orient: vertical;
  122. overflow: hidden;
  123. text-overflow: ellipsis;
  124. }
  125. .priceBox {
  126. overflow: hidden;
  127. margin: 10rpx 0;
  128. }
  129. .f {
  130. float: left;
  131. }
  132. .r {
  133. float: right;
  134. }
  135. .sellingBox {
  136. overflow: hidden;
  137. }
  138. .fuhao {
  139. color: #df2d2d;
  140. font-size: 24rpx;
  141. float: left;
  142. font-family: OPPOSans;
  143. /* font-weight: bold; */
  144. margin-top: 10rpx;
  145. }
  146. .int {
  147. float: left;
  148. font-size: 36rpx;
  149. font-family: OPPOSans;
  150. font-weight: bold;
  151. color: #df2d2d;
  152. }
  153. .originalBox {
  154. overflow: hidden;
  155. }
  156. .origina {
  157. text-align: right;
  158. font-size: 24rpx;
  159. font-family: OPPOSans;
  160. font-weight: 400;
  161. text-decoration: line-through;
  162. color: #999;
  163. margin-top: 10rpx;
  164. margin-right: 10rpx;
  165. }
  166. .countBox {
  167. width: 100%;
  168. height: 46rpx;
  169. background-image: url("https://formall.oss-accelerate.aliyuncs.com/cimg/v20211214/home_icon_bq.png");
  170. background-size: 100% 100%;
  171. background-repeat: no-repeat;
  172. margin-bottom: 20rpx;
  173. line-height: 46rpx;
  174. overflow: hidden;
  175. }
  176. .countText {
  177. font-size: 22rpx;
  178. font-family: OPPOSans;
  179. font-weight: 400;
  180. color: #999;
  181. background: linear-gradient(180deg, #dcb07d 0%, #f5e0bf 100%);
  182. -webkit-background-clip: text;
  183. -webkit-text-fill-color: transparent;
  184. margin-left: 8rpx;
  185. }
  186. .countDate {
  187. font-size: 24rpx;
  188. font-family: OPPOSans;
  189. font-weight: bold;
  190. color: #4c3820;
  191. margin-right: 8rpx;
  192. }
  193. .moreItem {
  194. background: #f7f7f7;
  195. border-radius: 8px;
  196. }
  197. .noDataImg {
  198. width: 160rpx;
  199. height: 160rpx;
  200. margin: 25% auto 5% auto;
  201. }
  202. .noDataImg image {
  203. width: 100%;
  204. height: 100%;
  205. }
  206. .noDataText {
  207. text-align: center;
  208. font-size: 22rpx;
  209. font-family: OPPOSans;
  210. font-weight: 500;
  211. color: #999;
  212. }
  213. .product {
  214. width: 96%;
  215. height: 140rpx;
  216. margin: 30rpx auto 10rpx;
  217. border-radius: 16rpx;
  218. overflow: hidden;
  219. }
  220. .product image {
  221. height: 100%;
  222. display: block;
  223. width: 100%;
  224. }