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.

591 line
9.4 KiB

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