C端小程序
Du kannst nicht mehr als 25 Themen auswählen Themen müssen entweder mit einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

823 Zeilen
12 KiB

  1. @import "../app.wxss";
  2. page {
  3. background: #f4f5f9;
  4. }
  5. .xia {
  6. width: 24rpx;
  7. height: 14rpx;
  8. margin: auto 10rpx;
  9. display: block;
  10. position: absolute;
  11. top: 0;
  12. left: 0;
  13. right: 0;
  14. bottom: 0;
  15. /* margin: auto; */
  16. }
  17. .goSqunar {
  18. display: flex;
  19. justify-content: space-around;
  20. }
  21. .goSqunar1 {
  22. display: flex;
  23. justify-content: center;
  24. }
  25. .title {
  26. font-size: 32rpx;
  27. font-family: OPPOSans;
  28. font-weight: bold;
  29. }
  30. .title1 {
  31. max-width:320rpx;
  32. font-size: 32rpx;
  33. font-family: OPPOSans;
  34. font-weight: bold;
  35. text-overflow: ellipsis;
  36. white-space: nowrap;
  37. overflow: hidden;
  38. }
  39. .squareMore {
  40. width: 24rpx;
  41. /* height: 15rpx; */
  42. }
  43. .marketName{
  44. }
  45. .f {
  46. float: left;
  47. }
  48. .r {
  49. float: right;
  50. }
  51. .vgrade {
  52. /* width: 40rpx; */
  53. height: 26rpx;
  54. float: left;
  55. margin: 10rpx;
  56. background: linear-gradient(180deg, #d5a56e, #e9d0aa);
  57. border-radius: 16rpx 0 16rpx 0;
  58. color: #fff;
  59. line-height: 26rpx;
  60. font-size: 24rpx;
  61. padding: 4rpx 10rpx;
  62. }
  63. .integralNum {
  64. float: left;
  65. font-family: OPPOSans;
  66. font-weight: bold;
  67. color: #be8b50;
  68. font-size: 26rpx;
  69. }
  70. .color_box1 {
  71. background-color: #fff;
  72. background-image: url('https://formall.oss-accelerate.aliyuncs.com/cimg/v20211214/home_top_bnt.png');
  73. background-size: 100% 100%;
  74. border-radius: 0 0 40rpx 40rpx;
  75. overflow: hidden;
  76. background-repeat: no-repeat;
  77. }
  78. .color_box {
  79. /* padding-top: 20rpx; *//* background-image: linear-gradient(#DC143C, #F4F5F9); */
  80. background-color: #f4f5f9;
  81. }
  82. .underlingImg {
  83. width: 30rpx;
  84. height: 60rpx;
  85. font-size: 30prx;
  86. float: left;
  87. /* margin-top: 20rpx; */
  88. }
  89. .underlingName {
  90. float: left;
  91. line-height: 30rpx;
  92. color: #a6a6a6;
  93. /* margin-top: 20rpx; */
  94. margin-bottom: 20rpx;
  95. margin-left: 5rpx;
  96. }
  97. .index-position {
  98. background: rgba(0, 0, 0, 0.5);
  99. height: 88rpx;
  100. position: absolute;
  101. top: 0;
  102. width: 100%;
  103. font-family: PingFangSC-Semibold;
  104. font-size: 30rpx;
  105. color: #fff;
  106. letter-spacing: 0.75rpx;
  107. z-index: 9;
  108. line-height: 88rpx;
  109. overflow: hidden;
  110. }
  111. .red {
  112. position: absolute;
  113. width: 13rpx;
  114. height: 13rpx;
  115. border-radius: 50%;
  116. background: red;
  117. right: -50rpx;
  118. top: 19rpx;
  119. left: 0;
  120. margin: auto;
  121. display: none;
  122. }
  123. page {
  124. width: 100%;
  125. height: auto !important;
  126. overflow-x: hidden;
  127. }
  128. .txt {
  129. margin-left: 20rpx;
  130. }
  131. .game-entry {
  132. position: fixed;
  133. right: 27rpx;
  134. bottom: 443rpx;
  135. width: 120rpx;
  136. margin: 37rpx auto 0;
  137. z-index: 10;
  138. }
  139. .gameimg {
  140. display: block;
  141. width: 100%;
  142. }
  143. .underling {
  144. padding: 10rpx 30rpx;
  145. }
  146. .userinfo {
  147. width: 690rpx;
  148. height: 96rpx;
  149. border-radius: 16rpx;
  150. display: flex;
  151. justify-content: space-between;
  152. margin: 0 auto 30rpx;
  153. }
  154. .userinfo1 {
  155. width: 690rpx;
  156. height: 96rpx;
  157. border-radius: 16rpx;
  158. display: flex;
  159. justify-content: space-between;
  160. margin: 0 auto;
  161. }
  162. .infoLeft {
  163. height: 100%;
  164. border-radius: 12rpx;
  165. background: #fff;
  166. }
  167. .section {
  168. padding: 0 20rpx;
  169. justify-content: space-around;
  170. text-align: center;
  171. margin-top: 25rpx;
  172. margin-bottom: 30rpx;
  173. }
  174. .sellsection {
  175. margin-bottom: 37rpx;
  176. padding: 0 38rpx;
  177. }
  178. .section >view, .sellsection>view {
  179. width: 25%;
  180. display: inline-block;
  181. position: relative;
  182. }
  183. .section >view image, .sellsection>view image {
  184. display: block;
  185. margin: 0 auto;
  186. }
  187. .section >view image {
  188. width: 55rpx;
  189. height: 55rpx;
  190. margin-top: 20rpx;
  191. margin-bottom: 14rpx;
  192. }
  193. .sellsection>view image {
  194. width: 159rpx;
  195. height: 134rpx;
  196. }
  197. .section text {
  198. font-size: 24rpx;
  199. color: rgba(51, 51, 51, 1);
  200. display: block;
  201. margin-top: 0rpx;
  202. }
  203. .showQrcode {
  204. position: fixed;
  205. top: 0;
  206. left: 0;
  207. right: 0;
  208. bottom: 0;
  209. z-index: 1000;
  210. background: rgba(0, 0, 0, 0.6);
  211. }
  212. .qrcode image {
  213. margin: 15rpx 20rpx 15rpx;
  214. z-index: 100;
  215. }
  216. .qrcode1 image {
  217. margin: 15rpx 20rpx 15rpx;
  218. z-index: 100;
  219. }
  220. .showQrcode {
  221. position: fixed;
  222. top: 0;
  223. left: 0;
  224. right: 0;
  225. bottom: 0;
  226. z-index: 1000;
  227. background: rgba(0, 0, 0, 0.6);
  228. }
  229. .canvas-box {
  230. position: fixed;
  231. width: 500rpx;
  232. overflow: hidden;
  233. left: 0;
  234. top: 200rpx;
  235. right: 0;
  236. margin: auto;
  237. background: #fff;
  238. border-radius: 16rpx;
  239. z-index: 100;
  240. padding-bottom: 30rpx;
  241. }
  242. .showQrcode text {
  243. display: none;
  244. text-align: center;
  245. font-size: 28rpx;
  246. }
  247. .button {
  248. width: 414rpx;
  249. text-align: center;
  250. margin: 0 auto;
  251. height: 80rpx;
  252. line-height: 80rpx;
  253. background: rgba(255, 255, 255, 1);
  254. border-radius: 10rpx;
  255. font-size: 32rpx;
  256. color: rgba(2, 192, 255, 1);
  257. overflow: hidden;
  258. }
  259. .memberIds {
  260. padding-top: 30rpx;
  261. font-size: 30rpx;
  262. }
  263. .search {
  264. background: rgba(2, 192, 255, 1);
  265. height: 50rpx;
  266. }
  267. .searchbar {
  268. position: relative;
  269. width: 685rpx;
  270. height: 76rpx;
  271. margin: 0 auto;
  272. text-align: center;
  273. }
  274. .searchbar image {
  275. width: 40rpx;
  276. }
  277. .searchbar text {
  278. font-size: 28rpx;
  279. line-height: 50rpx;
  280. color: #fff;
  281. display: inline-block;
  282. }
  283. .user-avatar {
  284. width: 80rpx;
  285. height: 80rpx;
  286. border-radius: 50%;
  287. overflow: hidden;
  288. float: left;
  289. margin: 10rpx 10rpx;
  290. }
  291. .user-avatar open-data {
  292. display: block;
  293. width: 100%;
  294. height: 100%;
  295. }
  296. .user-avatar1 {
  297. width: 80rpx;
  298. height: 80rpx;
  299. border-radius: 50%;
  300. overflow: hidden;
  301. float: left;
  302. margin: 0 10rpx;
  303. }
  304. .user-avatar1 open-data {
  305. display: block;
  306. width: 100%;
  307. height: 100%;
  308. }
  309. .user-data {
  310. letter-spacing: 0.64rpx;
  311. line-height: 46rpx;
  312. font-size: 30rpx;
  313. color: #333;
  314. background: #fff;
  315. margin-top: 10rpx;
  316. margin-bottom: 26rpx;
  317. float: right;
  318. display: flex;
  319. flex-direction: column;
  320. }
  321. .user-data1 {
  322. letter-spacing: 0.64rpx;
  323. line-height: 46rpx;
  324. font-size: 30rpx;
  325. color: #333;
  326. background: #fff;
  327. /* margin-top: 10rpx; */
  328. margin-bottom: 26rpx;
  329. float: right;
  330. display: flex;
  331. flex-direction: column;
  332. }
  333. .nameBox open-data {
  334. float: left;
  335. }
  336. .chengzhangBox {
  337. height: 32rpx;
  338. line-height: 26rpx;
  339. border-radius: 9px 9px 9px 0px;
  340. font-family: PingFangSC-Regular;
  341. font-weight: 400;
  342. color: rgba(255, 255, 255, 1);
  343. float: left;
  344. margin-top: 8rpx;
  345. }
  346. .chengzhang {
  347. font-size: 22rpx;
  348. font-weight: 400;
  349. color: #fff;
  350. height: 22rpx;
  351. line-height: 22rpx;
  352. padding: 0 8rpx;
  353. }
  354. .integral {
  355. margin-left: 70rpx;
  356. }
  357. .jifen {
  358. display: inline-block;
  359. height: 34rpx;
  360. color: #999;
  361. font-size: 24rpx;
  362. line-height: 34rpx;
  363. }
  364. .jifenNumber {
  365. color: #d18b4c;
  366. font-size: 34rpx;
  367. line-height: 34rpx;
  368. margin-left: 10rpx;
  369. font-weight: bold;
  370. }
  371. .view {
  372. display: flex;
  373. font-size: 24rpx;
  374. color: #999;
  375. }
  376. .view>.score {
  377. margin-left: 9rpx;
  378. color: #333;
  379. font-size: 30rpx;
  380. margin-right: 23rpx;
  381. font-family: PingFang-SC-Bold;
  382. }
  383. .qrcode1 {
  384. width: 106rpx;
  385. height: 96rpx;
  386. border-radius: 12rpx;
  387. }
  388. .qrcode {
  389. width: 106rpx;
  390. height: 96rpx;
  391. background: #fff;
  392. border-radius: 12rpx;
  393. }
  394. .qrcodeimg {
  395. width: 68rpx !important;
  396. height: 68rpx !important;
  397. }
  398. .leftimg {
  399. position: absolute;
  400. right: 40rpx;
  401. top: 60rpx;
  402. margin-top: -7rpx;
  403. width: 14rpx;
  404. height: 26rpx;
  405. }
  406. .duihuanimg {
  407. display: block;
  408. width: 48rpx;
  409. margin-top: 6rpx;
  410. }
  411. .product {
  412. width: 710rpx;
  413. margin: 30rpx auto 10rpx;
  414. border-radius: 16rpx;
  415. overflow: hidden;
  416. }
  417. .product image {
  418. display: block;
  419. width: 100%;
  420. }
  421. .textBox {
  422. width: 400rpx;
  423. height: 100%;
  424. float: left;
  425. margin-left: 10rpx;
  426. }
  427. .textBox .name {
  428. width: 400rpx;
  429. font-size: 28rpx;
  430. color: #3c3c3c;
  431. margin-top: 20rpx;
  432. }
  433. .textBox .title {
  434. width: 400rpx;
  435. font-size: 20rpx;
  436. color: #a6a6a6;
  437. margin-top: 10rpx;
  438. }
  439. .product .gift {
  440. width: 88rpx;
  441. height: 88rpx;
  442. float: left;
  443. margin-top: 30rpx;
  444. margin-left: 15rpx;
  445. }
  446. .next image {
  447. width: 26rpx;
  448. height: 40rpx;
  449. }
  450. .gift image {
  451. width: 88rpx;
  452. height: 76rpx;
  453. }
  454. .product .next {
  455. width: 32rpx;
  456. height: 60rpx;
  457. float: right;
  458. margin-top: 40rpx;
  459. margin-right: 26rpx;
  460. }
  461. #rushtobyCard {
  462. margin-top: 30rpx;
  463. }
  464. .signin {
  465. width: 542rpx;
  466. height: 94rpx;
  467. position: fixed;
  468. top: 0;
  469. left: 0;
  470. right: 0;
  471. z-index: 10000000;
  472. margin: auto;
  473. }
  474. .signin open-data {
  475. position: absolute;
  476. width: 90rpx;
  477. left: 0;
  478. top: 0;
  479. bottom: 0;
  480. height: 94rpx;
  481. margin: auto;
  482. border-radius: 50%;
  483. overflow: hidden;
  484. }
  485. .signin text {
  486. display: block;
  487. background: rgba(0, 0, 0, 0.5);
  488. font-size: 28rpx;
  489. height: 80rpx;
  490. width: 100%;
  491. line-height: 80rpx;
  492. color: #d6d5d5;
  493. text-indent: 4em;
  494. border-radius: 60rpx;
  495. margin-top: 7rpx;
  496. }
  497. .remainchengzhangzhi {
  498. display: block;
  499. color: #a6a6a6;
  500. font-size: 22rpx;
  501. margin-top: 5rpx;
  502. height: 30rpx;
  503. line-height: 30rpx;
  504. float: left;
  505. margin-left: 10rpx;
  506. width: 255rpx;
  507. overflow: hidden;
  508. text-overflow: ellipsis;
  509. white-space: nowrap;
  510. }
  511. progress {
  512. width: 200rpx;
  513. border-radius: 60rpx;
  514. overflow: hidden;
  515. float: left;
  516. margin-top: 10rpx;
  517. }
  518. .channelBox {
  519. width: 688rpx;
  520. /* height: 220rpx; */
  521. margin: 20rpx auto;
  522. display: flex;
  523. flex-wrap: wrap;
  524. /* justify-content: space-between; */
  525. background: #f4f5f9;
  526. }
  527. .kjBox {
  528. width: 25%;
  529. height: 118rpx;
  530. font-size: 24rpx;
  531. color: #a6a6a6;
  532. margin-top: 10rpx;
  533. text-align: center;
  534. }
  535. .kjBox1 {
  536. width: 25%;
  537. height: 118rpx;
  538. font-size: 24rpx;
  539. color: #a6a6a6;
  540. margin-top: 10rpx;
  541. text-align: center;
  542. }
  543. .kjBox image {
  544. width: 60rpx;
  545. height: 60rpx;
  546. margin: auto;
  547. }
  548. .kjBox1 image {
  549. width: 80rpx;
  550. height: 80rpx;
  551. margin: auto;
  552. }
  553. .text {
  554. margin: 0 auto;
  555. }
  556. .toutiao {
  557. width: 710rpx;
  558. height: 128rpx;
  559. line-height: 128rpx;
  560. margin: 0 auto;
  561. background: #fff;
  562. box-shadow: 0px 6rpx 16rpx 0px rgba(236, 238, 243, 1);
  563. border-radius: 12rpx;
  564. margin-top: 18rpx;
  565. margin-bottom: 18rpx;
  566. position: relative;
  567. }
  568. .toutiao1 {
  569. width: 710rpx;
  570. height: 128rpx;
  571. margin: 0 auto;
  572. background: #fff;
  573. box-shadow: 0px 6rpx 16rpx 0px rgba(236, 238, 243, 1);
  574. border-radius: 12rpx;
  575. margin-top: 18rpx;
  576. margin-bottom: 18rpx;
  577. display: flex;
  578. justify-content: space-between;
  579. }
  580. .xianshi {
  581. display: flex;
  582. flex-direction: column;
  583. justify-content: center;
  584. align-content: center;
  585. font-size: 30rpx;
  586. padding: 20rpx;
  587. }
  588. .xianshi>text {
  589. height: 40rpx;
  590. }
  591. .xianshi>text:nth-child(1) {
  592. font-size: 30rpx;
  593. font-family: PingFangSC;
  594. font-weight: 500;
  595. }
  596. .xianshi>text:nth-child(2) {
  597. margin-top: 10rpx;
  598. height: 28rpx;
  599. font-size: 20rpx;
  600. font-family: PingFangSC;
  601. font-weight: 400;
  602. color: rgba(166, 166, 166, 1);
  603. line-height: 28rpx;
  604. }
  605. .xsCon {
  606. width: 300rpx;
  607. display: flex;
  608. justify-content: flex-end;
  609. overflow: hidden;
  610. }
  611. .igBox {
  612. height: 100%;
  613. width: 100rpx;
  614. display: flex;
  615. flex-direction: column;
  616. justify-content: center;
  617. align-content: center;
  618. }
  619. .igBoxm {
  620. height: 100%;
  621. width: 100rpx;
  622. display: flex;
  623. flex-direction: column;
  624. text-align: center;
  625. }
  626. .imageH {
  627. height: 50rpx !important;
  628. width: 50rpx !important;
  629. border-radius: 50%;
  630. margin: 15rpx auto;
  631. margin-bottom: 15rpx;
  632. }
  633. .more {
  634. height: 70rpx !important;
  635. width: 70rpx !important;
  636. margin: 0 auto;
  637. }
  638. .imTit {
  639. height: 14px;
  640. font-size: 10px;
  641. font-family: PingFangSC;
  642. font-weight: 400;
  643. color: rgba(60, 60, 60, 1);
  644. line-height: 14px;
  645. width: 100%;
  646. overflow: hidden;
  647. text-overflow: ellipsis;
  648. white-space: nowrap;
  649. text-align: center;
  650. }
  651. .toutiao view:nth-child(2) {
  652. font-size: 26rpx;
  653. font-family: PingFangSC-Regular;
  654. font-weight: 400;
  655. color: rgba(60, 60, 60, 1);
  656. float: left;
  657. width: 500rpx;
  658. overflow: hidden;
  659. text-overflow: ellipsis;
  660. white-space: nowrap;
  661. }
  662. .toutiao view:nth-child(2) text:nth-child(1) {
  663. color: red;
  664. }
  665. .toutiao view:nth-child(2) text:nth-child(2) {
  666. text-decoration: line-through;
  667. color: red;
  668. }
  669. .toutiao .imgBox {
  670. width: 64rpx;
  671. height: 64rpx;
  672. float: left;
  673. margin: 5rpx 0 5rpx 20rpx;
  674. }
  675. .toutiao image {
  676. width: 48rpx;
  677. height: 38rpx;
  678. margin: auto;
  679. }
  680. .toutiao .qg {
  681. width: 80rpx;
  682. height: 44rpx;
  683. line-height: 44rpx;
  684. border-radius: 18rpx;
  685. border: 2rpx solid;
  686. position: absolute;
  687. top: 0;
  688. bottom: 0;
  689. right: 20rpx;
  690. margin: auto;
  691. font-size: 24rpx;
  692. font-family: PingFangSC-Medium;
  693. font-weight: 500;
  694. color: #fd782d;
  695. text-align: center;
  696. }
  697. i-tabs i-tabs-scroll {
  698. background: #f4f5f9 !important;
  699. }
  700. .integralBox {
  701. width: 110rpx;
  702. height: 110rpx;
  703. bottom: 500rpx;
  704. right: 20rpx;
  705. position: fixed;
  706. z-index: 1000000;
  707. }
  708. .integralBox1 {
  709. width: 140rpx;
  710. height: 140rpx;
  711. bottom: 500rpx;
  712. right: 20rpx;
  713. position: fixed;
  714. z-index: 1000000;
  715. }