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.

475 lines
8.1 KiB

  1. /* pages/spellGroup/mySpellGroup/index.wxss */
  2. .top-img{
  3. width: 100%;
  4. height: 533rpx;
  5. z-index: 1;
  6. }
  7. .top-img image{
  8. width: 100%;
  9. height: 533rpx;
  10. }
  11. .content-box{
  12. box-sizing: content-box;
  13. height: auto;
  14. overflow: hidden;
  15. }
  16. .edit-right{
  17. float: right;
  18. width: 268rpx;
  19. height: 96rpx;
  20. line-height: 46rpx;
  21. background:linear-gradient(90deg,rgba(40,179,255,1) 0%,rgba(48,103,255,1) 100%);
  22. border-radius:32rpx;
  23. }
  24. .content{
  25. position: relative;
  26. width: 100%;
  27. height: auto;
  28. background: #fff;
  29. overflow: hidden;
  30. padding-bottom: 130rpx;
  31. }
  32. .text{
  33. padding: 0 30rpx;
  34. }
  35. .title{
  36. position: relative;
  37. background-color: #fff;
  38. z-index: 100;
  39. width: 750rpx;
  40. padding-top: 30rpx;
  41. padding-left: 30rpx;
  42. line-height: 50rpx;
  43. border-radius:20rpx 20rpx 0px 0px;
  44. margin-top: -25rpx;
  45. opacity: 1;
  46. font-size:32rpx;
  47. font-family:PingFang-SC-Bold;
  48. font-weight:bold;
  49. color:rgba(51,51,51,1);
  50. box-sizing: border-box;
  51. }
  52. .remark{
  53. font-size:24rpx;
  54. font-family:PingFang-SC-Medium;
  55. font-weight:500;
  56. color:rgba(134,134,134,1);
  57. line-height: 48rpx;
  58. }
  59. .des{
  60. width: 100%;
  61. height: auto;
  62. padding-top: 6rpx;
  63. background: #FFF;
  64. padding: 0 30rpx 0 0;
  65. color: #FD782D
  66. }
  67. .status{
  68. width: 100%;
  69. border-radius: 15rpx;
  70. background:rgba(255,235,229,1);
  71. margin: 30rpx 0;
  72. overflow: hidden;
  73. }
  74. .status01{
  75. float: left;
  76. width: 130rpx;
  77. height: 130rpx;
  78. }
  79. .status01 image{
  80. width: 90rpx;
  81. height: 90rpx;
  82. border-radius: 45rpx;
  83. margin: 20rpx 0 0 20rpx;
  84. }
  85. .status02{
  86. margin-top: 20rpx;
  87. float: left;
  88. width: 140rpx;
  89. font-size:28rpx;
  90. font-family:PingFang-SC-Medium;
  91. font-weight:500;
  92. color:rgba(51,51,51,1);
  93. }
  94. .r-p-num{
  95. display: inline;
  96. color: #FF3535;
  97. }
  98. .status03{
  99. /* width: 160rpx; */
  100. float: left;
  101. padding-left: 80rpx;
  102. color: #F74812;
  103. }
  104. .hh,.mm,.ss{
  105. display: inline-block;
  106. font-size:26rpx;
  107. font-family:PingFang-SC-Medium;
  108. font-weight:500;
  109. color:rgba(255,255,255,1);
  110. height: 38rpx;
  111. width: 38rpx;
  112. background: #F74812;
  113. border-radius:10rpx;
  114. margin: 46rpx 8rpx 0 0;
  115. text-align: center;
  116. line-height: 38rpx;
  117. }
  118. .status04{
  119. float: left;
  120. width: 163rpx;
  121. }
  122. .s-button{
  123. background:#ED3D2E;
  124. width: 120rpx;
  125. height: 48rpx;
  126. font-size:28rpx;
  127. font-family:PingFang-SC-Medium;
  128. font-weight:500;
  129. color:rgba(255,255,255,1);
  130. text-align: center;
  131. line-height: 48rpx;
  132. border-radius: 24rpx;
  133. margin: 40rpx auto 0;
  134. }
  135. .p-title{
  136. font-size:32rpx;
  137. font-family:PingFang-SC-Bold;
  138. font-weight:bold;
  139. color:rgba(51,51,51,1);
  140. margin: 10rpx 0 20rpx 0;
  141. }
  142. .p-list{
  143. font-size:24rpx;
  144. font-family:PingFang-SC-Medium;
  145. font-weight:500;
  146. color:rgba(51,51,51,1);
  147. line-height:50rpx;
  148. }
  149. .edit-left-top{
  150. height: 46rpx;
  151. text-align: center;
  152. line-height:65rpx;
  153. }
  154. .price{
  155. display: inline;
  156. font-size:32rpx;
  157. line-height: 32rpx;
  158. font-family:PingFang-SC-Medium;
  159. font-weight:500;
  160. color:rgba(254,254,254,1);
  161. }
  162. .price-unit{
  163. display: inline;
  164. font-size:27rpx;
  165. line-height: 27rpx;
  166. font-family:PingFang-SC-Medium;
  167. font-weight:500;
  168. color:rgba(254,254,254,1);
  169. }
  170. .edit-left-bottom{
  171. text-align: center;
  172. font-size:30rpx;
  173. line-height: 40rpx;
  174. font-family:PingFang-SC-Medium;
  175. font-weight:500;
  176. color:rgba(254,254,254,1);
  177. }
  178. .edit-left{
  179. float: left;
  180. width: 268rpx;
  181. height: 96rpx;
  182. background:linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%);
  183. border-radius:32rpx;
  184. }
  185. .edit-right-top{
  186. line-height: 32rpx;
  187. text-align: center;
  188. margin-top: 13rpx;
  189. }
  190. .real-price{
  191. display: inline;
  192. font-size:32rpx;
  193. font-family:PingFang-SC-Medium;
  194. font-weight:500;
  195. color:rgba(254,254,254,1);
  196. }
  197. .real-price-unit{
  198. display: inline;
  199. font-size:27rpx;
  200. line-height: 27rpx;
  201. font-weight:500;
  202. color:rgba(254,254,254,1);
  203. }
  204. .edit-right-bottom{
  205. text-align: center;
  206. font-size:30rpx;
  207. line-height: 40rpx;
  208. font-weight:500;
  209. color:rgba(254,254,254,1);
  210. }
  211. .posi {
  212. position: relative;
  213. }
  214. .applyshop{
  215. font-size:32rpx;
  216. font-family:PingFang-SC-Bold;
  217. font-weight:bold;
  218. color:rgba(51,51,51,1);
  219. margin: 10rpx 0 20rpx 0;
  220. }
  221. .posi>view:nth-child(2) {
  222. width: 100%;
  223. height: 87rpx;
  224. display: flex;
  225. justify-content: space-between;
  226. line-height: 87rpx;
  227. }
  228. .posi>view:nth-child(2) text:nth-child(1) {
  229. font-size: 30rpx;
  230. color: #a9a9a9;
  231. }
  232. .posi>view:nth-child(2) text:nth-child(2) {
  233. font-size: 30rpx;
  234. color: #a9a9a9;
  235. }
  236. .posi_logo {
  237. width: 100%;
  238. display: flex;
  239. padding: 20rpx 0;
  240. background: #fff;
  241. height: 100rpx;
  242. margin-bottom: 20rpx;
  243. }
  244. .posi_logo view:nth-child(1) {
  245. width: 100rpx;
  246. height: 100rpx;
  247. border-radius: 16rpx;
  248. }
  249. .posi_logo view:nth-child(1) image {
  250. display: block;
  251. width: 100rpx;
  252. height: 100rpx;
  253. border-radius: 16rpx;
  254. border: 1px solid #e5e5e5;
  255. }
  256. .posi_logo view:nth-child(2) {
  257. display: flex;
  258. flex-direction: column;
  259. flex: 8;
  260. padding-left: 30rpx;
  261. }
  262. .posi_logo view:nth-child(2) text:nth-child(1) {
  263. font-size: 32rpx;
  264. color: #333;
  265. letter-spacing: 0;
  266. }
  267. .posi_logo view:nth-child(2) text:nth-child(2) {
  268. font-size: 24rpx;
  269. color: #b8b8b8;
  270. padding-top: 3rpx;
  271. width: 450rpx;
  272. height: 36rpx;
  273. overflow: hidden;
  274. }
  275. .tel {
  276. right: 0;
  277. top: 0;
  278. bottom: 0;
  279. margin: auto;
  280. width: 76rpx;
  281. height: 76rpx;
  282. }
  283. .j-f{
  284. font-size:28rpx;
  285. font-family:PingFang-SC-Medium;
  286. font-weight:500;
  287. color:rgba(51,51,51,1);
  288. margin-top: 20rpx;
  289. }
  290. .j-t{
  291. font-size:28rpx;
  292. font-family:PingFang-SC-Medium;
  293. font-weight:500;
  294. color:rgba(51,51,51,1);
  295. line-height: 44rpx;
  296. }
  297. button::after{ border: none; }
  298. .j-time{
  299. display: inline;
  300. font-size:26rpx;
  301. font-family:PingFang-SC-Medium;
  302. font-weight:500;
  303. color:rgba(255,53,53,1);
  304. line-height: 44rpx;
  305. }
  306. .goback {
  307. float:left;
  308. width:132rpx!important;
  309. height:96rpx;
  310. background:#fff!important;
  311. line-height:96rpx;
  312. border-radius:32rpx;
  313. margin-right:25rpx;
  314. border: 0!important;
  315. box-sizing: border-box;
  316. }
  317. .goback image{
  318. position: absolute;
  319. width:52rpx;
  320. height: 50rpx;
  321. left: 0;
  322. right: 0;
  323. top: 0;
  324. bottom:0;
  325. margin:10rpx auto;
  326. }
  327. .rest {
  328. font-size: 24rpx;
  329. color: #919191;
  330. letter-spacing: 0;
  331. height: 70rpx;
  332. line-height: 70rpx;
  333. /* border-bottom: 1px solid #eee; */
  334. border-bottom: 1px solid #f9f9f9;
  335. }
  336. .restNum {
  337. font-size: 24rpx;
  338. color: #999;
  339. letter-spacing: 1.16rpx;
  340. text-align: right;
  341. }
  342. .time {
  343. font-size: 24rpx;
  344. color: #333;
  345. letter-spacing: 0;
  346. line-height: 33rpx;
  347. display: inline-block;
  348. }
  349. .txt01 {
  350. font-size: 24rpx;
  351. color: #919191;
  352. letter-spacing: 0;
  353. }
  354. .edit{
  355. position:fixed;
  356. bottom:0;
  357. left:0;
  358. right:0;
  359. padding:20rpx 22rpx;
  360. /* background:#fff; */
  361. }
  362. .times {
  363. display: inline-block;
  364. color: #ff4949;
  365. font-weight: bold;
  366. font-size: 26rpx;
  367. text-align: center;
  368. }
  369. .times text {
  370. display: inline-block;
  371. margin: 6rpx;
  372. width: 46rpx;
  373. height: 56rpx;
  374. text-align: center;
  375. font-size: 28rpx;
  376. line-height: 60rpx;
  377. border-radius: 12rpx;
  378. color: #fff;
  379. font-weight: bold;
  380. background: #ff4949;
  381. }
  382. .al-bg{
  383. position: fixed;
  384. width: 100%;
  385. height: 100vh;
  386. top: 0;
  387. left: 0;
  388. background:rgba(0,0,0,1);
  389. opacity:0.65;
  390. z-index: 200;
  391. }
  392. .al-content{
  393. background: #fff;
  394. position: fixed;
  395. width: 545rpx;
  396. z-index: 300;
  397. top: 200rpx;
  398. left: 102rpx;
  399. border-radius: 15rpx;
  400. }
  401. .al-top{
  402. width: 100%;
  403. }
  404. .al-top image{
  405. position: relative;
  406. height: 298rpx;
  407. margin-top: -96rpx;
  408. width: 545rpx;
  409. }
  410. .al-center{
  411. padding: 80rpx 30rpx;
  412. font-size:30rpx;
  413. font-family:PingFang-SC-Regular;
  414. font-weight:400;
  415. color:rgba(51,51,51,1);
  416. }
  417. .al-bottom{
  418. width:462rpx;
  419. height:95rpx;
  420. background:linear-gradient(90deg,rgba(248,85,45,1) 0%,rgba(241,60,66,1) 0%,rgba(248,86,46,1) 100%);
  421. border-radius:47rpx;
  422. font-size:30rpx;
  423. font-family:PingFang-SC-Medium;
  424. font-weight:500;
  425. color:rgba(255,255,255,1);
  426. text-align: center;
  427. line-height: 95rpx;
  428. margin: 0 auto 43rpx;
  429. }
  430. .btnTxt{
  431. width: 50rpx;
  432. height: 30rpx;
  433. line-height: 50rpx;
  434. color: #FD782D;
  435. font-size: 20rpx;
  436. position: absolute;
  437. right:42rpx ;
  438. bottom: 15rpx;
  439. }
  440. .des-peoplenum{
  441. display: inline;
  442. font-size:24rpx;
  443. font-family:PingFang-SC-Medium;
  444. font-weight:500;
  445. line-height:44rpx;
  446. margin-right: 15rpx;
  447. }
  448. .des-saleprice{
  449. display: inline;
  450. font-size:40rpx;
  451. font-family:PingFang-SC-Medium;
  452. font-weight:500;
  453. }
  454. .quan{
  455. float: left;
  456. margin:28rpx 15rpx 0 0;
  457. width: 12rpx;
  458. height: 12rpx;
  459. background: #E1E1E1;
  460. border-radius: 50%;
  461. }