抖音c端
25'ten fazla konu seçemezsiniz Konular bir harf veya rakamla başlamalı, kısa çizgiler ('-') içerebilir ve en fazla 35 karakter uzunluğunda olabilir.

183 satır
4.1 KiB

  1. /* c:\Users\56817\Desktop\Working Space\3,TikTok-MiniPro\ttc\pages2\shopSelect\shopSelect.ttss */
  2. page {
  3. font-size: 30rpx;
  4. box-sizing: border-box !important;
  5. background-color: #fff;
  6. padding-bottom: 0;
  7. }
  8. page .continer {
  9. width: 95%;
  10. height: 100%;
  11. margin: auto;
  12. padding: 30rpx 0;
  13. }
  14. page .continer .selectShop .nav {
  15. display: flex;
  16. justify-content: space-between;
  17. margin-bottom: 20rpx;
  18. padding: 0 20rpx;
  19. }
  20. page .continer .selectShop .nav .item {
  21. color: #ffffff;
  22. padding: 8rpx 15rpx;
  23. background-image: linear-gradient(to top, #48c6ef 0%, #6f86d6 100%);
  24. border-radius: 15rpx;
  25. }
  26. page .continer .selectShop .shopList {
  27. width: 100%;
  28. background-color: #ffffff;
  29. border-radius: 10rpx;
  30. padding: 20rpx 0;
  31. margin: auto;
  32. }
  33. page .continer .selectShop .shopList .item {
  34. position: relative;
  35. display: flex;
  36. justify-content: space-between;
  37. width: 95%;
  38. margin: auto;
  39. color: #ffffff;
  40. margin-bottom: 30rpx;
  41. padding: 20rpx 25rpx 50rpx 25rpx;
  42. box-sizing: border-box !important;
  43. background-image: linear-gradient(to top, #48c6ef 0%, #6f86d6 100%);
  44. border-radius: 12rpx;
  45. }
  46. page .continer .selectShop .shopList .item .img {
  47. width: 30%;
  48. height: 170rpx;
  49. border-radius: 15rpx;
  50. overflow: hidden;
  51. }
  52. page .continer .selectShop .shopList .item .img image {
  53. width: 100%;
  54. height: 100%;
  55. }
  56. page .continer .selectShop .shopList .item .infoBox {
  57. display: flex;
  58. justify-content: space-between;
  59. flex-direction: column;
  60. width: 65%;
  61. margin-left: 20rpx;
  62. padding: 8rpx 0;
  63. }
  64. page .continer .selectShop .shopList .item .infoBox .infoItem {
  65. width: 100%;
  66. white-space: nowrap;
  67. overflow: hidden;
  68. text-overflow: ellipsis;
  69. }
  70. page .continer .selectShop .shopList .item .infoBox2 {
  71. display: flex;
  72. justify-content: space-between;
  73. flex-direction: column;
  74. width: 65%;
  75. margin-left: 20rpx;
  76. padding: 30rpx 0;
  77. }
  78. page .continer .selectShop .shopList .item .infoBox2 .infoItem {
  79. width: 100%;
  80. white-space: nowrap;
  81. overflow: hidden;
  82. text-overflow: ellipsis;
  83. }
  84. page .continer .selectShop .shopList .item .mapBtn {
  85. position: absolute;
  86. bottom: 15rpx;
  87. right: 15rpx;
  88. padding: 7rpx 12rpx;
  89. border-radius: 15rpx;
  90. background-color: #f76767;
  91. }
  92. page .continer .selectShop .shopList .takeingPlace {
  93. text-align: center;
  94. margin-top: 30rpx;
  95. }
  96. page .continer .selectShop .shopList .takeingPlace .title {
  97. font-size: 45rpx;
  98. color: #00000075;
  99. margin-bottom: 40rpx;
  100. }
  101. page .continer .selectCity .nav {
  102. margin-bottom: 20rpx;
  103. padding: 0 20rpx;
  104. }
  105. page .continer .selectCity .nav .item {
  106. width: 10%;
  107. color: #ffffff;
  108. text-align: center;
  109. padding: 8rpx 15rpx;
  110. background-image: linear-gradient(to top, #48c6ef 0%, #6f86d6 100%);
  111. border-radius: 15rpx;
  112. }
  113. page .continer .selectCity .notice {
  114. font-size: 35rpx;
  115. padding: 0 15rpx;
  116. margin-bottom: 30rpx;
  117. }
  118. page .continer .selectCity .indexList {
  119. padding: 0 15rpx;
  120. box-sizing: border-box;
  121. margin-bottom: 25rpx;
  122. }
  123. page .continer .selectCity .indexList .title {
  124. font-size: 35rpx;
  125. }
  126. page .continer .selectCity .indexList .item {
  127. font-size: 30rpx;
  128. height: 80rpx;
  129. line-height: 80rpx;
  130. border-bottom: 1px solid #0000003b;
  131. }
  132. page .continer .indexBar {
  133. position: fixed;
  134. top: 5%;
  135. right: 3%;
  136. font-size: 25rpx;
  137. text-align: center;
  138. background-color: #00000075;
  139. padding-top: 20rpx;
  140. padding-bottom: 10rpx;
  141. border-radius: 30rpx;
  142. }
  143. page .continer .indexBar .indexBarItem {
  144. position: relative;
  145. width: 50rpx;
  146. height: 42rpx;
  147. color: #ffffff;
  148. transition: all 0.3s;
  149. }
  150. page .continer .indexBar .indexBarItem.active {
  151. color: #f92672;
  152. }
  153. page .continer .indexBar .indexBarItem .tag {
  154. position: absolute;
  155. left: -210%;
  156. top: 0;
  157. width: 110rpx;
  158. height: 60rpx;
  159. text-align: center;
  160. transform: scale(1.3);
  161. }
  162. page .continer .indexBar .indexBarItem .name {
  163. position: relative;
  164. top: -11rpx;
  165. left: 10rpx;
  166. display: inline-block;
  167. height: 50rpx;
  168. line-height: 50rpx;
  169. color: #ffffff;
  170. background-color: #8a8a8a;
  171. border-radius: 15rpx;
  172. padding: 0 20rpx;
  173. }
  174. page .continer .indexBar .indexBarItem .tran {
  175. display: inline-block;
  176. width: 0;
  177. height: 0;
  178. border-top: 20rpx solid #ffffff00;
  179. border-bottom: 20rpx solid #ffffff00;
  180. border-left: 20rpx solid #8a8a8a;
  181. border-right: 20rpx solid #ffffff00;
  182. }