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.

907 lines
13 KiB

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