C端小程序
Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.

295 wiersze
5.4 KiB

  1. /* pages/spellDetail/index.wxss */
  2. page {
  3. height: auto;
  4. overflow: auto;
  5. background: #f89132;
  6. background-image: url('https://s3.cn-northwest-1.amazonaws.com.cn/iformall-net/cimg/spelldetail-bg.png');
  7. background-size: cover;
  8. background-repeat: no-repeat;
  9. }
  10. .status{
  11. width: 690rpx;
  12. padding:0 28rpx;
  13. margin: 0 auto;
  14. box-sizing: border-box;
  15. background:rgba(255,255,255,1);
  16. border-radius:15rpx;
  17. }
  18. .status-top{
  19. width: 100%;
  20. height: 75rpx;
  21. box-sizing: border-box;
  22. border-bottom: 1rpx solid #F9F9F9;
  23. /* overflow: hidden; */
  24. }
  25. .p-status{
  26. float: left;
  27. width: 260rpx;
  28. font-size:32rpx;
  29. font-family:PingFang-SC-Bold;
  30. font-weight:bold;
  31. color:rgba(243,69,58,1);
  32. line-height: 75rpx;
  33. }
  34. .p-time{
  35. float: right;
  36. font-size:26rpx;
  37. font-family:PingFang-SC-Medium;
  38. font-weight:500;
  39. color:rgba(243,69,58,1);
  40. width: 38rpx;
  41. height: 30rpx;
  42. margin-top: 22rpx;
  43. background:rgba(252,220,221,1);
  44. border-radius:10rpx;
  45. line-height: 30rpx;
  46. text-align: center;
  47. margin: 22rpx 6rpx;
  48. }
  49. .p-mao{
  50. float: right;
  51. font-size:26rpx;
  52. font-family:PingFang-SC-Medium;
  53. font-weight:500;
  54. color:rgba(243,69,58,1);
  55. line-height: 75rpx;
  56. }
  57. .p-text{
  58. float: right;
  59. font-size:26rpx;
  60. font-family:PingFang-SC-Regular;
  61. font-weight:400;
  62. color:rgba(51,51,51,1);
  63. line-height:75rpx;
  64. }
  65. .status-center{
  66. width: 100%;
  67. overflow: hidden;
  68. padding: 20rpx 0;
  69. text-align: center;
  70. border-bottom: 1rpx solid #F9F9F9;
  71. }
  72. .tuanzhang{
  73. display: inline-block;
  74. width: 80rpx;
  75. height: 80rpx;
  76. position: relative;
  77. }
  78. .touxiangitems{
  79. margin: 20rpx;
  80. }
  81. .touxiang{
  82. width: 80rpx;
  83. height: 80rpx;
  84. border-radius: 40rpx;
  85. overflow: hidden;
  86. }
  87. .no-touxiang{
  88. width: 80rpx;
  89. height: 80rpx;
  90. overflow: hidden;
  91. background:rgba(252,220,221,1);
  92. border:1rpx solid rgba(243,69,58,1);
  93. border-radius:50%;
  94. box-sizing: border-box;
  95. line-height: 78rpx;
  96. text-align: center;
  97. font-size:32rpx;
  98. font-family:PingFang-SC-Regular;
  99. font-weight:400;
  100. color:rgba(243,69,58,1);
  101. }
  102. .touxiang image{
  103. width: 80rpx;
  104. height: 80rpx;
  105. }
  106. .tuan-icon{
  107. position: absolute;
  108. bottom: 0rpx;
  109. left: 8rpx;
  110. width: 64rpx;
  111. height: 27rpx;
  112. }
  113. .tuan-icon image{
  114. display: block;
  115. width: 64rpx;
  116. height: 27rpx;
  117. }
  118. .status-bottom{
  119. width: 100%;
  120. height: auto;
  121. overflow: hidden;
  122. }
  123. .position-icon{
  124. width: 38rpx;
  125. float: left;
  126. }
  127. .position-icon image{
  128. width: 27rpx;
  129. height: 37rpx;
  130. margin-top: 17rpx;
  131. }
  132. .position{
  133. font-size:28rpx;
  134. font-family:PingFang-SC-Medium;
  135. font-weight:500;
  136. color:rgba(51,51,51,1);
  137. line-height: 72rpx;
  138. }
  139. .detail{
  140. width: 690rpx;
  141. padding:0 28rpx;
  142. margin: 30rpx auto 0;
  143. box-sizing: border-box;
  144. background:rgba(255,255,255,1);
  145. border-radius:15rpx;
  146. }
  147. .detail-top{
  148. width: 100%;
  149. height: auto;
  150. overflow: hidden;
  151. padding-bottom: 12rpx;
  152. }
  153. .detail-top01{
  154. float: left;
  155. width: 180rpx;
  156. }
  157. .detail-top01 image{
  158. width: 180rpx;
  159. height: 180rpx;
  160. margin-top: 33rpx;
  161. }
  162. .detail-top02{
  163. width: 208rpx;
  164. float: left;
  165. margin-left: 16rpx;
  166. }
  167. .title{
  168. font-size:30rpx;
  169. font-family:PingFang-SC-Bold;
  170. font-weight:bold;
  171. color:rgba(51,51,51,1);
  172. line-height:44rpx;
  173. margin-top: 30rpx;
  174. }
  175. .des{
  176. font-size:26rpx;
  177. font-family:PingFang-SC-Medium;
  178. font-weight:500;
  179. color:rgba(134,134,134,1);
  180. line-height:40rpx;
  181. }
  182. .detail-top03{
  183. float: left;
  184. padding-top: 180rpx;
  185. width: 230rpx;
  186. }
  187. .detail-p-name{
  188. float: right;
  189. font-size:26rpx;
  190. font-family:PingFang-SC-Medium;
  191. font-weight:500;
  192. color:rgba(134,134,134,1);
  193. line-height:44rpx;
  194. }
  195. .detail-p-price{
  196. float: right;
  197. font-size:26rpx;
  198. font-family:PingFang-SC-Medium;
  199. font-weight:500;
  200. color:rgba(51,51,51,1);
  201. }
  202. .detail-bottom{
  203. border-top: 1rpx solid #F9F9F9;
  204. width: 100%;
  205. overflow: hidden;
  206. height: 86rpx;
  207. }
  208. .b-unit{
  209. float: right;
  210. font-size:24rpx;
  211. font-family:PingFang-SC-Medium;
  212. font-weight:500;
  213. color:rgba(237,63,46,1);
  214. margin-top: 36rpx;
  215. }
  216. .b-price{
  217. float: right;
  218. font-size:40rpx;
  219. font-family:PingFang-SC-Medium;
  220. font-weight:500;
  221. color:rgba(237,63,46,1);
  222. margin-top: 18rpx;
  223. }
  224. .b-name{
  225. float: right;
  226. font-size:26rpx;
  227. font-family:PingFang-SC-Medium;
  228. font-weight:500;
  229. color:rgba(51,51,51,1);
  230. margin-right: 6rpx;
  231. margin-top: 34rpx;
  232. }
  233. .order{
  234. width: 690rpx;
  235. padding:10rpx 28rpx;
  236. margin: 30rpx auto 0;
  237. box-sizing: border-box;
  238. background:rgba(255,255,255,1);
  239. border-radius:15rpx;
  240. }
  241. .order-list{
  242. height: 55rpx;
  243. }
  244. .order-title{
  245. line-height: 55rpx;
  246. float: left;
  247. font-size:26rpx;
  248. font-family:PingFang-SC-Medium;
  249. font-weight:500;
  250. color:rgba(51,51,51,1);
  251. }
  252. .order-text{
  253. float: right;
  254. text-align: right;
  255. line-height: 55rpx;
  256. font-size:26rpx;
  257. font-family:PingFang-SC-Medium;
  258. font-weight:500;
  259. color:rgba(134,134,134,1);
  260. }
  261. .user-motto {
  262. border: 0;
  263. width:650rpx;
  264. height:85rpx;
  265. background:linear-gradient(90deg,rgba(248,85,45,1) 0%,rgba(241,60,66,1) 0%,rgba(248,86,46,1) 100%);
  266. box-shadow:0px 8rpx 8rpx 1rpx rgba(242,61,65,0.32);
  267. border-radius:43rpx;
  268. font-size:36rpx;
  269. font-family:PingFang-SC-Medium;
  270. font-weight:500;
  271. color:rgba(254,254,254,1);
  272. line-height: 85rpx;
  273. margin-top: 200rpx;
  274. }
  275. .user-motto::after {
  276. border: none;
  277. }
  278. .button button:nth-of-type(1){
  279. width:520rpx;
  280. height:95rpx;
  281. margin: 30rpx auto 38rpx;
  282. background:linear-gradient(90deg,rgba(248,85,45,1) 0%,rgba(241,60,66,1) 0%,rgba(248,86,46,1) 100%);
  283. border-radius:47rpx;
  284. color: #fff;
  285. }
  286. .button button:nth-of-type(2){
  287. width:520rpx;
  288. height:95rpx;
  289. background:rgba(255,255,255,1);
  290. border:1rpx solid rgba(190,190,190,1);
  291. border-radius:47rpx;
  292. color:#333333;
  293. margin-bottom: 50rpx;
  294. }