C端小程序
Ви не можете вибрати більше 25 тем Теми мають розпочинатися з літери або цифри, можуть містити дефіси (-) і не повинні перевищувати 35 символів.

135 рядки
2.2 KiB

  1. /* components/hot/hot.wxss */
  2. @import "../../app.wxss";
  3. .hotBox{
  4. width:710rpx;
  5. margin: 20rpx auto 0;
  6. }
  7. .hotTitle{
  8. width: 100%;
  9. height: 60rpx;
  10. line-height: 60rpx;
  11. font-size: 30rpx;
  12. display: flex;
  13. justify-content: space-between;
  14. font-family:PingFangSC-Medium;
  15. }
  16. .titleL .titleR{
  17. width: 100rpx;
  18. }
  19. .titleR text{
  20. float: left;
  21. margin-right: 10rpx;
  22. font-family:PingFangSC-Regular!important;
  23. }
  24. .titleR view{
  25. height: 40rpx;
  26. width: 40rpx;
  27. /* margin-top: 10rpx; */
  28. float: left;
  29. }
  30. .titleR image{
  31. height: 28rpx;
  32. width: 28rpx;
  33. }
  34. .sql{
  35. width:12rpx;
  36. height:24rpx;
  37. border-radius:8rpx;
  38. float: left;
  39. margin: 20rpx 10rpx 0 0;
  40. }
  41. .hotCon{
  42. width: 100%;
  43. }
  44. .kanjia, .pintuan{
  45. width: 346rpx;
  46. height: 156rpx;
  47. float: left;
  48. border-radius: 12rpx;
  49. display: flex;
  50. justify-content: space-between;
  51. position: relative;
  52. }
  53. .kanjia{
  54. margin-right: 18rpx;
  55. background:linear-gradient(130deg,rgba(50,177,252,1) 0%,rgba(47,108,255,1) 100%);
  56. }
  57. .pintuan{
  58. background:linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%);
  59. }
  60. .hotCon image{
  61. width: 86rpx;
  62. height: 86rpx;
  63. margin: 24rpx 0 46rpx 16rpx;
  64. }
  65. .hotCon .btn{
  66. width:80rpx;
  67. height:44rpx;
  68. line-height: 44rpx;
  69. background:rgba(255,255,255,1);
  70. border-radius:18rpx;
  71. font-size: 24rpx;
  72. position: absolute;
  73. right: 20rpx;
  74. bottom: 20rpx;
  75. text-align: center;
  76. }
  77. .btnk{
  78. color: #2C8DFF;
  79. }
  80. .btnp{
  81. color: #FD782D;
  82. }
  83. .btnNone{
  84. width:80rpx;
  85. height:44rpx;
  86. line-height: 44rpx;
  87. border-radius:18rpx;
  88. font-size: 24rpx;
  89. position: absolute;
  90. right: 20rpx;
  91. bottom: 20rpx;
  92. text-align: center;
  93. background:rgba(255,255,255,0.5)
  94. }
  95. .kjText,.ptText{
  96. color: #FFFFFF;
  97. margin: 14rpx 10rpx 20rpx 10rpx;
  98. }
  99. .title{
  100. width: 210rpx;
  101. font-size: 30rpx;
  102. overflow: hidden;
  103. text-overflow:ellipsis;
  104. white-space:nowrap;
  105. float: left;
  106. }
  107. .price{
  108. width: 128rpx;
  109. overflow: hidden;
  110. text-overflow:ellipsis;
  111. white-space:nowrap;
  112. font-size: 22rpx;
  113. text-decoration:line-through;
  114. float: left;
  115. }
  116. .expect{
  117. width: 210rpx;
  118. font-size: 22rpx;
  119. float: left;
  120. }
  121. .sale{
  122. font-size: 32rpx;
  123. float: left;
  124. margin-top: -8rpx;
  125. width: 128rpx;
  126. overflow: hidden;
  127. text-overflow:ellipsis;
  128. white-space:nowrap;
  129. }
  130. .sale text{
  131. font-size: 20rpx!important;
  132. }