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.

581 lines
9.1 KiB

  1. @import "../app.wxss";
  2. page{
  3. background: #F4F5F9;
  4. }
  5. .underlingImg{
  6. width: 30rpx;
  7. height: 60rpx;
  8. font-size: 30prx;
  9. float: left;
  10. }
  11. .underlingName{
  12. float: left;
  13. line-height: 30rpx;
  14. }
  15. .underling{
  16. font-size: 30rpx;
  17. overflow: hidden;
  18. }
  19. .index-position {
  20. background: rgba(0, 0, 0, 0.5);
  21. height: 88rpx;
  22. position: absolute;
  23. top: 0;
  24. width: 100%;
  25. font-family: PingFangSC-Semibold;
  26. font-size: 30rpx;
  27. color: #fff;
  28. letter-spacing: 0.75rpx;
  29. z-index: 9;
  30. line-height: 88rpx;
  31. overflow: hidden;
  32. }
  33. .red{
  34. position:absolute;
  35. width:13rpx;
  36. height:13rpx;
  37. border-radius:50%;
  38. background:red;
  39. right:-50rpx;
  40. top:19rpx;
  41. left:0;
  42. margin:auto;
  43. display: none;
  44. }
  45. page {
  46. width: 100%;
  47. height: auto !important;
  48. overflow-x: hidden;
  49. }
  50. .txt {
  51. margin-left: 20rpx;
  52. }
  53. .game-entry {
  54. position: fixed;
  55. right: 27rpx;
  56. bottom:443rpx;
  57. width: 120rpx;
  58. margin: 37rpx auto 0;
  59. z-index: 10;
  60. }
  61. .gameimg {
  62. display: block;
  63. width: 100%;
  64. }
  65. .underling{
  66. margin: 10rpx 30rpx;
  67. }
  68. .userinfo{
  69. width:690rpx;
  70. height: 96rpx;
  71. border-radius:16rpx;
  72. display: flex;
  73. justify-content: space-between;
  74. margin: 0 auto 30rpx;
  75. }
  76. .infoLeft{
  77. height: 100%;
  78. border-radius:12rpx;
  79. background: #FFF;
  80. }
  81. .section {
  82. padding: 0 20rpx;
  83. justify-content: space-around;
  84. text-align: center;
  85. margin-top: 25rpx;
  86. margin-bottom: 30rpx;
  87. }
  88. .sellsection{
  89. margin-bottom: 37rpx;
  90. padding: 0 38rpx;
  91. }
  92. .section >view,.sellsection>view{
  93. width: 25%;
  94. display: inline-block;
  95. position: relative;
  96. }
  97. .section >view image,.sellsection>view image{
  98. display: block;
  99. margin: 0 auto;
  100. }
  101. .section >view image {
  102. width: 55rpx;
  103. height: 55rpx;
  104. margin-top: 20rpx;
  105. margin-bottom: 14rpx;
  106. }
  107. .sellsection>view image{
  108. width: 159rpx;
  109. height: 134rpx;
  110. }
  111. .section text {
  112. font-size: 24rpx;
  113. color: rgba(51, 51, 51, 1);
  114. display: block;
  115. margin-top: 0rpx;
  116. }
  117. .showQrcode {
  118. position: fixed;
  119. top: 0;
  120. left: 0;
  121. right: 0;
  122. bottom: 0;
  123. z-index: 1000;
  124. background: rgba(0, 0, 0, 0.6);
  125. }
  126. .qrcode image {
  127. margin: 15rpx 20rpx 15rpx;
  128. z-index:100;
  129. }
  130. .showQrcode {
  131. position: fixed;
  132. top: 0;
  133. left: 0;
  134. right: 0;
  135. bottom: 0;
  136. z-index: 1000;
  137. background: rgba(0, 0, 0, 0.6);
  138. }
  139. .canvas-box {
  140. position: fixed;
  141. width: 500rpx;
  142. overflow: hidden;
  143. left: 0;
  144. top: 200rpx;
  145. right: 0;
  146. margin: auto;
  147. background: #fff;
  148. border-radius: 16rpx;
  149. z-index:100;
  150. padding-bottom: 30rpx;
  151. }
  152. .showQrcode text {
  153. display: none;
  154. text-align: center;
  155. font-size: 28rpx;
  156. }
  157. .button {
  158. width: 414rpx;
  159. text-align: center;
  160. margin: 0 auto;
  161. height: 80rpx;
  162. line-height: 80rpx;
  163. background: rgba(255, 255, 255, 1);
  164. border-radius: 10rpx;
  165. font-size: 32rpx;
  166. color: rgba(2, 192, 255, 1);
  167. overflow: hidden;
  168. }
  169. .memberIds{
  170. padding-top: 30rpx;
  171. font-size: 30rpx;
  172. }
  173. .search{
  174. background:rgba(2, 192, 255, 1);
  175. height: 50rpx;
  176. }
  177. .searchbar{
  178. position: relative;
  179. width: 685rpx;
  180. height: 76rpx;
  181. margin: 0 auto;
  182. text-align: center;
  183. }
  184. .searchbar image{
  185. width: 40rpx;
  186. }
  187. .searchbar text{
  188. font-size: 28rpx;
  189. line-height: 50rpx;
  190. color: #fff;
  191. display: inline-block;
  192. }
  193. .user-avatar {
  194. width: 80rpx;
  195. height: 80rpx;
  196. border-radius: 50%;
  197. overflow: hidden;
  198. float: left;
  199. margin: 10rpx 10rpx;
  200. }
  201. .user-avatar open-data {
  202. display:block;
  203. width:100%;
  204. height:100%;
  205. }
  206. .user-data {
  207. letter-spacing: 0.64rpx;
  208. line-height: 46rpx;
  209. font-size: 30rpx;
  210. color: #333;
  211. background: #FFF;
  212. margin-top: 10rpx;
  213. margin-bottom: 26rpx;
  214. float: right;
  215. display: flex;
  216. flex-direction: column;
  217. }
  218. .nameBox open-data{
  219. float: left;
  220. }
  221. .chengzhangBox{
  222. height:32rpx;
  223. line-height: 26rpx;
  224. border-radius:9px 9px 9px 0px;
  225. font-family:PingFangSC-Regular;
  226. font-weight:400;
  227. color:rgba(255,255,255,1);
  228. float: left;
  229. margin-top: 8rpx;
  230. }
  231. .chengzhang {
  232. font-size: 22rpx;
  233. font-weight: 400;
  234. color: #FFFFFF;
  235. height:22rpx;
  236. line-height: 22rpx;
  237. padding: 0 8rpx;
  238. }
  239. .integral{
  240. margin-left: 70rpx;
  241. }
  242. .jifen{
  243. display: inline-block;
  244. height: 34rpx;
  245. color: #999999;
  246. font-size:24rpx;
  247. line-height: 34rpx;
  248. }
  249. .jifenNumber{
  250. color:#D18B4C;
  251. font-size: 34rpx;
  252. line-height: 34rpx;
  253. margin-left: 10rpx;
  254. font-weight: bold;
  255. }
  256. .view {
  257. display: flex;
  258. font-size: 24rpx;
  259. color: #999999;
  260. }
  261. .view>.score{
  262. margin-left:9rpx;
  263. color:#333333;
  264. font-size:30rpx;
  265. margin-right:23rpx;
  266. font-family:PingFang-SC-Bold;
  267. }
  268. .qrcode{
  269. width: 106rpx;
  270. height: 96rpx;
  271. background: #FFF;
  272. border-radius:12rpx;
  273. }
  274. .qrcodeimg{
  275. width: 68rpx!important;
  276. height: 68rpx!important;
  277. }
  278. .leftimg{
  279. position: absolute;
  280. right: 40rpx;
  281. top: 60rpx;
  282. margin-top: -7rpx;
  283. width: 14rpx;
  284. height: 26rpx;
  285. }
  286. .duihuanimg{
  287. display: block;
  288. width: 48rpx;
  289. margin-top: 6rpx;
  290. }
  291. .product{
  292. width: 710rpx;
  293. margin: 30rpx auto 10rpx;
  294. border-radius: 16rpx;
  295. overflow: hidden;
  296. }
  297. .product image{
  298. display: block;
  299. width: 100%;
  300. }
  301. .textBox{
  302. width: 400rpx;
  303. height: 100%;
  304. float: left;
  305. margin-left: 10rpx;
  306. }
  307. .textBox .name{
  308. width: 400rpx;
  309. font-size: 28rpx;
  310. color: #3C3C3C;
  311. margin-top: 20rpx;
  312. }
  313. .textBox .title{
  314. width: 400rpx;
  315. font-size: 20rpx;
  316. color: #A6A6A6;
  317. margin-top: 10rpx;
  318. }
  319. .product .gift{
  320. width:88rpx;
  321. height:88rpx;
  322. float: left;
  323. margin-top: 30rpx;
  324. margin-left: 15rpx;
  325. }
  326. .next image{
  327. width: 26rpx;
  328. height: 40rpx;
  329. }
  330. .gift image{
  331. width:88rpx;
  332. height:76rpx;
  333. }
  334. .product .next{
  335. width:32rpx;
  336. height:60rpx;
  337. float: right;
  338. margin-top: 40rpx;
  339. margin-right: 26rpx;
  340. }
  341. #rushtobyCard{
  342. margin-top: 30rpx;
  343. }
  344. .signin{
  345. width: 542rpx;
  346. height: 94rpx;
  347. position: fixed;
  348. top: 0;
  349. left: 0;
  350. right: 0;
  351. z-index: 100;
  352. margin: auto;
  353. }
  354. .signin open-data {
  355. position: absolute;
  356. width:90rpx;
  357. left: 0;
  358. top: 0;
  359. bottom: 0;
  360. height:94rpx;
  361. margin: auto;
  362. border-radius: 50%;
  363. overflow: hidden;
  364. }
  365. .signin text{
  366. display: block;
  367. background: rgba(0, 0, 0, 0.5);
  368. font-size: 28rpx;
  369. height: 80rpx;
  370. width: 100%;
  371. line-height: 80rpx;
  372. color: #D6D5D5;
  373. text-indent: 4em;
  374. border-radius:60rpx;
  375. margin-top: 7rpx;
  376. }
  377. .remainchengzhangzhi{
  378. display: block;
  379. color: #A6A6A6;
  380. font-size: 22rpx;
  381. margin-top: 5rpx;
  382. height: 30rpx;
  383. line-height: 30rpx;
  384. float: left;
  385. margin-left:10rpx;
  386. width: 255rpx;
  387. overflow: hidden;
  388. text-overflow:ellipsis;
  389. white-space: nowrap;
  390. }
  391. progress{
  392. width:200rpx;
  393. border-radius:60rpx;
  394. overflow:hidden;
  395. float: left;
  396. margin-top: 10rpx;
  397. }
  398. .channelBox{
  399. width:688rpx;
  400. height: 220rpx;
  401. margin:0 auto;
  402. display: flex;
  403. justify-content: space-between;
  404. background: #F4F5F9;
  405. }
  406. .kjBox{
  407. width: 104rpx;
  408. height: 148rpx;
  409. font-size: 24rpx;
  410. color: #A6A6A6;
  411. margin-top: 46rpx;
  412. text-align: center;
  413. }
  414. .kjBox image{
  415. width: 104rpx;
  416. height: 104rpx;
  417. }
  418. .toutiao{
  419. width:710rpx;
  420. height: 128rpx;
  421. line-height: 128rpx;
  422. margin:0 auto;
  423. background: #FFF;
  424. box-shadow:0px 6rpx 16rpx 0px rgba(236,238,243,1);
  425. border-radius:12rpx;
  426. margin-top: 18rpx;
  427. margin-bottom:18rpx;
  428. position: relative;
  429. }
  430. .toutiao1{
  431. width:710rpx;
  432. height: 128rpx;
  433. margin:0 auto;
  434. background: #FFF;
  435. box-shadow:0px 6rpx 16rpx 0px rgba(236,238,243,1);
  436. border-radius:12rpx;
  437. margin-top: 18rpx;
  438. margin-bottom:18rpx;
  439. display: flex;
  440. justify-content: space-between;
  441. }
  442. .xianshi{
  443. display: flex;
  444. flex-direction: column;
  445. justify-content: center;
  446. align-content: center;
  447. font-size: 30rpx;
  448. padding: 20rpx;
  449. }
  450. .xianshi>text{
  451. height: 40rpx;
  452. }
  453. .xianshi>text:nth-child(1){
  454. font-size:30rpx;
  455. font-family:PingFangSC;
  456. font-weight:500;
  457. }
  458. .xianshi>text:nth-child(2){
  459. margin-top: 10rpx;
  460. height:28rpx;
  461. font-size:20rpx;
  462. font-family:PingFangSC;
  463. font-weight:400;
  464. color:rgba(166,166,166,1);
  465. line-height:28rpx;
  466. }
  467. .xsCon{
  468. width: 300rpx;
  469. display: flex;
  470. justify-content:flex-end;
  471. overflow: hidden;
  472. }
  473. .igBox{
  474. height: 100%;
  475. width: 100rpx;
  476. display: flex;
  477. flex-direction: column;
  478. justify-content: center;
  479. align-content: center;
  480. }
  481. .igBoxm{
  482. height: 100%;
  483. width: 100rpx;
  484. display: flex;
  485. flex-direction: column;
  486. text-align: center;
  487. }
  488. .imageH{
  489. height:50rpx!important;
  490. width: 50rpx!important;
  491. border-radius: 50%;
  492. margin: 15rpx auto;
  493. margin-bottom: 15rpx;
  494. }
  495. .more{
  496. height:70rpx!important;
  497. width: 70rpx!important;
  498. margin: 0 auto;
  499. }
  500. .imTit{
  501. height:14px;
  502. font-size:10px;
  503. font-family:PingFangSC;
  504. font-weight:400;
  505. color:rgba(60,60,60,1);
  506. line-height:14px;
  507. width: 100%;
  508. overflow: hidden;
  509. text-overflow:ellipsis;
  510. white-space: nowrap;
  511. text-align: center;
  512. }
  513. .toutiao view:nth-child(2){
  514. font-size:26rpx;
  515. font-family:PingFangSC-Regular;
  516. font-weight:400;
  517. color:rgba(60,60,60,1);
  518. float: left;
  519. width: 500rpx;
  520. overflow: hidden;
  521. text-overflow:ellipsis;
  522. white-space: nowrap;
  523. }
  524. .toutiao view:nth-child(2) text:nth-child(1){
  525. color: red;
  526. }
  527. .toutiao view:nth-child(2) text:nth-child(2){
  528. text-decoration: line-through;
  529. color: red;
  530. }
  531. .toutiao .imgBox{
  532. width: 64rpx;
  533. height: 64rpx;
  534. float: left;
  535. margin:5rpx 0 5rpx 20rpx;
  536. }
  537. .toutiao image{
  538. width: 48rpx;
  539. height: 38rpx;
  540. margin: auto;
  541. }
  542. .toutiao .qg{
  543. width: 80rpx;
  544. height: 44rpx;
  545. line-height: 44rpx;
  546. border-radius:18rpx;
  547. border:2rpx solid;
  548. position: absolute;
  549. top: 0;
  550. bottom: 0;
  551. right: 20rpx;
  552. margin: auto;
  553. font-size:24rpx;
  554. font-family:PingFangSC-Medium;
  555. font-weight:500;
  556. color:#FD782D;
  557. text-align: center;
  558. }
  559. i-tabs i-tabs-scroll{
  560. background: #F4F5F9!important;
  561. }