C端小程序
Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.

840 строки
12 KiB

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