main.wxss 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737
  1. @charset "UTF-8";
  2. /* 页面左右间距 */
  3. /* 文字尺寸 */
  4. /*文字颜色*/
  5. /* 边框颜色 */
  6. /*颜色*/
  7. /* 图片加载中颜色 */
  8. /* 行为相关颜色 */
  9. /* 功能栏字体大小 */
  10. /*功能栏左侧小图标*/
  11. /*全局公共样式和字体图标*/
  12. /*初始化类*/
  13. @font-face {
  14. font-family: 'iconfont';
  15. /* project id 1482221 */
  16. src: url('https://at.alicdn.com/t/font_1482221_x9emymthrxs.eot');
  17. src: url('https://at.alicdn.com/t/font_1482221_x9emymthrxs.eot?#iefix') format('embedded-opentype'),
  18. url('https://at.alicdn.com/t/font_1482221_x9emymthrxs.woff2') format('woff2'),
  19. url('https://at.alicdn.com/t/font_1482221_x9emymthrxs.woff') format('woff'),
  20. url('https://at.alicdn.com/t/font_1482221_x9emymthrxs.ttf') format('truetype'),
  21. url('https://at.alicdn.com/t/font_1482221_x9emymthrxs.svg#iconfont') format('svg');
  22. }
  23. .acea-row {
  24. display: -webkit-box;
  25. display: -webkit-flex;
  26. display: flex;
  27. -webkit-box-lines: multiple;
  28. -moz-box-lines: multiple;
  29. -o-box-lines: multiple;
  30. -webkit-flex-wrap: wrap;
  31. flex-wrap: wrap
  32. }
  33. .acea-row.row-middle {
  34. -webkit-box-align: center;
  35. -o-box-align: center;
  36. -webkit-align-items: center;
  37. align-items: center
  38. }
  39. .bg-color-red {
  40. background-color: #e93323 !important;
  41. }
  42. .acea-row.row-right {
  43. -webkit-box-pack: end;
  44. -o-box-pack: end;
  45. -webkit-justify-content: flex-end;
  46. justify-content: flex-end
  47. }
  48. .acea-row.row-between-wrapper {
  49. -webkit-box-align: center;
  50. -o-box-align: center;
  51. -webkit-align-items: center;
  52. align-items: center;
  53. -webkit-box-pack: justify;
  54. -o-box-pack: justify;
  55. -webkit-justify-content: space-between;
  56. justify-content: space-between
  57. }
  58. .acea-row.row-column-around {
  59. -webkit-flex-direction: column;
  60. -webkit-box-orient: vertical;
  61. -webkit-box-direction: normal;
  62. flex-direction: column;
  63. justify-content: space-around;
  64. -webkit-justify-content: space-around
  65. }
  66. .acea-row.row-center-wrapper {
  67. -webkit-box-align: center;
  68. -o-box-align: center;
  69. -webkit-align-items: center;
  70. align-items: center;
  71. -webkit-box-pack: center;
  72. -o-box-pack: center;
  73. -webkit-justify-content: center;
  74. justify-content: center
  75. }
  76. .iconfont {
  77. font-family: "iconfont" !important;
  78. font-size: 34rpx;
  79. font-style: normal;
  80. -webkit-font-smoothing: antialiased;
  81. -webkit-text-stroke-width: 0rpx;
  82. -moz-osx-font-smoothing: grayscale;
  83. }
  84. .iconedit:before {
  85. content: "\e649";
  86. }
  87. .iconfavorfill:before {
  88. content: "\e64b";
  89. }
  90. .iconfavor:before {
  91. content: "\e64c";
  92. }
  93. .iconlocation:before {
  94. content: "\e651";
  95. }
  96. .iconroundcheckfill:before {
  97. content: "\e656";
  98. }
  99. .iconroundcheck:before {
  100. content: "\e657";
  101. }
  102. .iconunfold:before {
  103. content: "\e661";
  104. }
  105. .iconlikefill:before {
  106. content: "\e668";
  107. }
  108. .iconlike:before {
  109. content: "\e669";
  110. }
  111. .iconshop:before {
  112. content: "\e676";
  113. }
  114. .iconcart:before {
  115. content: "\e6af";
  116. }
  117. .icondelete:before {
  118. content: "\e6b4";
  119. }
  120. .iconhome:before {
  121. content: "\e6b8";
  122. }
  123. .iconcartfill:before {
  124. content: "\e6b9";
  125. }
  126. .iconhomefill:before {
  127. content: "\e6bb";
  128. }
  129. .iconlock:before {
  130. content: "\e6c0";
  131. }
  132. .iconfriendadd:before {
  133. content: "\e6ca";
  134. }
  135. .iconfold:before {
  136. content: "\e6de";
  137. }
  138. .iconapps:before {
  139. content: "\e729";
  140. }
  141. .iconadd:before {
  142. content: "\e767";
  143. }
  144. .iconmove:before {
  145. content: "\e768";
  146. }
  147. .icontriangledownfill:before {
  148. content: "\e79b";
  149. }
  150. .icontriangleupfill:before {
  151. content: "\e79c";
  152. }
  153. .iconshaixuan:before {
  154. content: "\e74a";
  155. }
  156. .iconyanzhengma:before {
  157. content: "\e684";
  158. }
  159. .iconjifen:before {
  160. content: "\e60f";
  161. }
  162. .iconwuliuxinxi:before {
  163. content: "\e62b";
  164. }
  165. .iconmessage:before {
  166. content: "\e78a";
  167. }
  168. .iconsetting:before {
  169. content: "\e78e";
  170. }
  171. .iconaddition:before {
  172. content: "\e6e0";
  173. }
  174. .iconclose:before {
  175. content: "\e6e9";
  176. }
  177. .iconenter:after {
  178. content: "\e6f8";
  179. }
  180. .iconprompt:before {
  181. content: "\e71b";
  182. }
  183. .iconreturn:before {
  184. content: "\e720";
  185. }
  186. .iconsearch:before {
  187. content: "\e741";
  188. }
  189. .iconpengyouquan:before {
  190. content: "\e62c";
  191. }
  192. .iconweixin:before {
  193. content: "\e60e";
  194. }
  195. .iconzhifubao:before {
  196. content: "\e673";
  197. }
  198. .iconyue:before {
  199. content: "\e618";
  200. }
  201. .iconweixin1:before {
  202. content: "\e622";
  203. }
  204. .iconlock1:before {
  205. content: "\e64d";
  206. }
  207. .iconuser:before {
  208. content: "\e64e";
  209. }
  210. .iconchenggongtixianshouyi:before {
  211. content: "\e64f";
  212. }
  213. .iconviptuiguangdingdan:before {
  214. content: "\e650";
  215. }
  216. .icondaifukuan:before {
  217. content: "\e652";
  218. }
  219. .icondaijiesuanshouyi:before {
  220. content: "\e653";
  221. }
  222. .icondaidakuanshouyi:before {
  223. content: "\e654";
  224. }
  225. .icondaifahuo:before {
  226. content: "\e655";
  227. }
  228. .icondaishouhuoshouyi:before {
  229. content: "\e658";
  230. }
  231. .icondaishouhuo:before {
  232. content: "\e659";
  233. }
  234. .iconwuxiaoshouyi:before {
  235. content: "\e65a";
  236. }
  237. .icontixianmingxi:before {
  238. content: "\e65b";
  239. }
  240. .iconshouyi:before {
  241. content: "\e65c";
  242. }
  243. .iconkouchutixianshouxufei:before {
  244. content: "\e65d";
  245. }
  246. .iconyishenqingshouyi:before {
  247. content: "\e65e";
  248. }
  249. .icontuihuanhuo:before {
  250. content: "\e65f";
  251. }
  252. /*水平线*/
  253. .hr {
  254. width: 100%;
  255. position: relative;
  256. border-bottom: 1px solid #dddddd;
  257. /* height: 0.5rpx; */
  258. }
  259. /* 一行显示 */
  260. .clamp {
  261. overflow: hidden;
  262. text-overflow: ellipsis;
  263. white-space: nowrap;
  264. display: block;
  265. }
  266. /* 二行显示 */
  267. .clamp2 {
  268. overflow: hidden;
  269. text-overflow: ellipsis;
  270. display: -webkit-box;
  271. -webkit-line-clamp: 2;
  272. -webkit-box-orient: vertical;
  273. }
  274. /* 二行显示 */
  275. .ellipsis {
  276. overflow: hidden;
  277. text-overflow: ellipsis;
  278. display: -webkit-box;
  279. -webkit-box-orient: vertical;
  280. -webkit-line-clamp: 2;
  281. }
  282. .common-hover {
  283. background: #f5f5f5;
  284. }
  285. /* 角标 */
  286. .corner {
  287. background-color: #e51c23;
  288. position: absolute;
  289. right: -18rpx;
  290. top: -18rpx;
  291. color: #FFFFFF;
  292. text-align: center;
  293. border-radius: 999px;
  294. font-size: 24rpx !important;
  295. min-width: 35rpx;
  296. min-height: 35rpx;
  297. display: -webkit-box;
  298. display: -webkit-flex;
  299. display: flex;
  300. -webkit-box-align: center;
  301. -webkit-align-items: center;
  302. align-items: center;
  303. -webkit-box-pack: center;
  304. -webkit-justify-content: center;
  305. justify-content: center;
  306. line-height: 1;
  307. }
  308. .flex_item {
  309. display: -webkit-box;
  310. display: -webkit-flex;
  311. display: flex;
  312. -webkit-box-align: center;
  313. -webkit-align-items: center;
  314. align-items: center;
  315. /* justify-content: space-between; */
  316. }
  317. /* 左右顶格加上下居中 */
  318. .flex-between-center {
  319. display: -webkit-box;
  320. display: -webkit-flex;
  321. display: flex;
  322. -webkit-box-pack: justify;
  323. -webkit-justify-content: space-between;
  324. justify-content: space-between;
  325. -webkit-box-align: center;
  326. -webkit-align-items: center;
  327. align-items: center;
  328. }
  329. /* flex布局-整体居中 */
  330. .flex-center {
  331. display: -webkit-box;
  332. display: -webkit-flex;
  333. display: flex;
  334. -webkit-box-align: center;
  335. -webkit-align-items: center;
  336. align-items: center;
  337. -webkit-box-pack: center;
  338. -webkit-justify-content: center;
  339. justify-content: center;
  340. }
  341. .flex-start {
  342. display: -webkit-box;
  343. display: -webkit-flex;
  344. display: flex;
  345. -webkit-box-align: center;
  346. -webkit-align-items: center;
  347. align-items: center;
  348. -webkit-box-pack: start;
  349. -webkit-justify-content: flex-start;
  350. justify-content: flex-start;
  351. }
  352. /*文字对齐*/
  353. .text-left {
  354. text-align: left !important;
  355. }
  356. .text-center {
  357. text-align: center !important;
  358. }
  359. .text-justify {
  360. text-align: justify !important;
  361. }
  362. .text-right {
  363. text-align: right !important;
  364. }
  365. .text-default {
  366. color: #212121 !important;
  367. }
  368. .text-white {
  369. color: #ffffff !important;
  370. }
  371. .text-primary {
  372. color: #00bcd4 !important;
  373. }
  374. .text-success {
  375. color: #009688 !important;
  376. }
  377. .text-info {
  378. color: #03a9f4 !important;
  379. }
  380. .text-warning {
  381. color: #ffc107 !important;
  382. }
  383. .text-danger {
  384. color: #e51c23 !important;
  385. }
  386. .text-pink {
  387. color: #e91e63 !important;
  388. }
  389. .text-purple {
  390. color: #673ab7 !important;
  391. }
  392. .text-indigo {
  393. color: #3f51b5 !important;
  394. }
  395. .text-gray {
  396. color: #999999 !important;
  397. }
  398. .bg-default {
  399. background-color: #f5f5f5 !important;
  400. }
  401. .bg-primary {
  402. background-color: #00bcd4 !important;
  403. }
  404. .bg-success {
  405. background-color: #009688 !important;
  406. }
  407. .bg-info {
  408. background-color: #03a9f4 !important;
  409. }
  410. .bg-warning {
  411. background-color: #FFB238 !important;
  412. }
  413. .bg-danger {
  414. background-color: #DC4D46 !important;
  415. }
  416. .bg-pink {
  417. background-color: #e91e63 !important;
  418. }
  419. .bg-purple {
  420. background-color: #673ab7 !important;
  421. }
  422. .bg-indigo {
  423. background-color: #3f51b5 !important;
  424. }
  425. .bg-white {
  426. background-color: white !important;
  427. }
  428. .bg-gray {
  429. background-color: #e3e3e3 !important;
  430. }
  431. /* 边框 */
  432. .border-radius-15 {
  433. border-radius: 15rpx;
  434. }
  435. .border-radius-10 {
  436. border-radius: 10rpx;
  437. }
  438. .border-radius-all {
  439. border-radius: 1000rpx;
  440. }
  441. /* 底部边线 */
  442. .borde-b {
  443. border-bottom: 1px solid #dddddd;
  444. }
  445. /* 弹性盒子 */
  446. .flex {
  447. display: -webkit-box;
  448. display: -webkit-flex;
  449. display: flex;
  450. -webkit-box-align: center;
  451. -webkit-align-items: center;
  452. align-items: center;
  453. -webkit-box-pack: justify;
  454. -webkit-justify-content: space-between;
  455. justify-content: space-between;
  456. }
  457. .items-left {
  458. -webkit-box-pack: start;
  459. -webkit-justify-content: flex-start;
  460. justify-content: flex-start;
  461. }
  462. .items-right {
  463. -webkit-box-pack: end;
  464. -webkit-justify-content: flex-end;
  465. justify-content: flex-end;
  466. }
  467. .flex-shrink-false {
  468. -webkit-flex-shrink: 0;
  469. flex-shrink: 0;
  470. }
  471. .flex-grow-true {
  472. -webkit-box-flex: 1;
  473. -webkit-flex-grow: 1;
  474. flex-grow: 1;
  475. }
  476. .position-relative {
  477. position: relative;
  478. }
  479. view,
  480. scroll-view,
  481. swiper,
  482. swiper-item,
  483. cover-view,
  484. cover-image,
  485. icon,
  486. text,
  487. rich-text,
  488. progress,
  489. button,
  490. checkbox,
  491. form,
  492. input,
  493. label,
  494. radio,
  495. slider,
  496. switch,
  497. textarea,
  498. navigator,
  499. audio,
  500. camera,
  501. image,
  502. video {
  503. box-sizing: border-box;
  504. }
  505. /* 骨架屏替代方案 */
  506. .Skeleton {
  507. background: #f3f3f3;
  508. padding: 20rpx 0;
  509. border-radius: 8rpx;
  510. }
  511. /* 图片载入替代方案 */
  512. .image-wrapper {
  513. font-size: 0;
  514. background: #f3f3f3;
  515. border-radius: 4px;
  516. }
  517. .image-wrapper image {
  518. width: 100%;
  519. height: 100%;
  520. -webkit-transition: 0.6s;
  521. transition: 0.6s;
  522. opacity: 0;
  523. }
  524. .image-wrapper image.loaded {
  525. opacity: 1;
  526. }
  527. uni-rich-text ._img {
  528. max-width: 100% !important;
  529. }
  530. /*边框*/
  531. .b-b:after,
  532. .b-t:after {
  533. position: absolute;
  534. z-index: 3;
  535. left: 0;
  536. right: 0;
  537. height: 0;
  538. content: '';
  539. -webkit-transform: scaleY(0.5);
  540. transform: scaleY(0.5);
  541. border-bottom: 1px solid #e4e7ed;
  542. }
  543. .b-b:after {
  544. bottom: 0;
  545. }
  546. .b-t:after {
  547. top: 0;
  548. }
  549. /* button样式改写 */
  550. uni-button,
  551. button {
  552. height: 80rpx;
  553. line-height: 80rpx;
  554. font-size: 34rpx;
  555. font-weight: normal;
  556. }
  557. uni-button.no-border:before, uni-button.no-border:after, button.no-border:before, button.no-border:after {
  558. border: 0;
  559. }
  560. uni-button[type='default'],
  561. button[type='default'] {
  562. color: #303133;
  563. }
  564. /* input 样式 */
  565. .input-placeholder {
  566. color: #999999;
  567. }
  568. .placeholder {
  569. color: #999999;
  570. }
  571. .margin-l-10 {
  572. margin-left: 10rpx !important;
  573. }
  574. .margin-r-10 {
  575. margin-right: 10rpx !important;
  576. }
  577. .margin-t-10 {
  578. margin-top: 10rpx !important;
  579. }
  580. .margin-b-10 {
  581. margin-bottom: 10rpx !important;
  582. }
  583. .margin-10 {
  584. margin: 10rpx !important;
  585. }
  586. .margin-v-10 {
  587. margin-top: 10rpx !important;
  588. margin-bottom: 10rpx !important;
  589. }
  590. .margin-c-10 {
  591. margin-left: 10rpx !important;
  592. margin-right: 10rpx !important;
  593. }
  594. .padding-l-10 {
  595. padding-left: 10rpx !important;
  596. }
  597. .padding-r-10 {
  598. padding-right: 10rpx !important;
  599. }
  600. .padding-t-10 {
  601. padding-top: 10rpx !important;
  602. }
  603. .padding-b-10 {
  604. padding-bottom: 10rpx !important;
  605. }
  606. .padding-10 {
  607. padding: 10rpx !important;
  608. }
  609. .padding-v-10 {
  610. padding-top: 10rpx !important;
  611. padding-bottom: 10rpx !important;
  612. }
  613. .padding-c-10 {
  614. padding-left: 10rpx !important;
  615. padding-right: 10rpx !important;
  616. }
  617. .margin-l-20 {
  618. margin-left: 20rpx !important;
  619. }
  620. .margin-r-20 {
  621. margin-right: 20rpx !important;
  622. }
  623. .margin-t-20 {
  624. margin-top: 20rpx !important;
  625. }
  626. .margin-b-20 {
  627. margin-bottom: 20rpx !important;
  628. }
  629. .margin-20 {
  630. margin: 20rpx !important;
  631. }
  632. .margin-v-20 {
  633. margin-top: 20rpx !important;
  634. margin-bottom: 20rpx !important;
  635. }
  636. .margin-c-20 {
  637. margin-left: 20rpx !important;
  638. margin-right: 20rpx !important;
  639. }
  640. .padding-l-20 {
  641. padding-left: 20rpx !important;
  642. }
  643. .padding-r-20 {
  644. padding-right: 20rpx !important;
  645. }
  646. .padding-t-20 {
  647. padding-top: 20rpx !important;
  648. }
  649. .padding-b-20 {
  650. padding-bottom: 20rpx !important;
  651. }
  652. .padding-20 {
  653. padding: 20rpx !important;
  654. }
  655. .padding-v-20 {
  656. padding-top: 20rpx !important;
  657. padding-bottom: 20rpx !important;
  658. }
  659. .padding-c-20 {
  660. padding-left: 20rpx !important;
  661. padding-right: 20rpx !important;
  662. }
  663. .margin-l-30 {
  664. margin-left: 30rpx !important;
  665. }
  666. .margin-r-30 {
  667. margin-right: 30rpx !important;
  668. }
  669. .margin-t-30 {
  670. margin-top: 30rpx !important;
  671. }
  672. .margin-b-30 {
  673. margin-bottom: 30rpx !important;
  674. }
  675. .margin-30 {
  676. margin: 30rpx !important;
  677. }
  678. .margin-v-30 {
  679. margin-top: 30rpx !important;
  680. margin-bottom: 30rpx !important;
  681. }
  682. .margin-c-30 {
  683. margin-left: 30rpx !important;
  684. margin-right: 30rpx !important;
  685. }
  686. .padding-l-30 {
  687. padding-left: 30rpx !important;
  688. }
  689. .padding-r-30 {
  690. padding-right: 30rpx !important;
  691. }
  692. .padding-t-30 {
  693. padding-top: 30rpx !important;
  694. }
  695. .padding-b-30 {
  696. padding-bottom: 30rpx !important;
  697. }
  698. .padding-30 {
  699. padding: 30rpx !important;
  700. }
  701. .padding-v-30 {
  702. padding-top: 30rpx !important;
  703. padding-bottom: 30rpx !important;
  704. }
  705. .padding-c-30 {
  706. padding-left: 30rpx !important;
  707. padding-right: 30rpx !important;
  708. }
  709. .font-size-sm {
  710. font-size: 24rpx;
  711. }
  712. .font-size-base {
  713. font-size: 28rpx;
  714. }
  715. .font-size-lg {
  716. font-size: 32rpx;
  717. }
  718. .font-color-yellow {
  719. color: #fd5b23;
  720. }
  721. .font-color-gray {
  722. color: #999999;
  723. }
  724. .font-color-red {
  725. color: #dd524d;
  726. }
  727. .border-color-yellow {
  728. border: 1rpx solid #fd5b23;
  729. }
  730. uni-page-wrapper {
  731. background-color: #f8f6f6;
  732. }
  733. page {
  734. background-color: #f8f6f6;
  735. font-family: PingFang SC, STHeitiSC-Light, Helvetica-Light, arial, sans-serif, Droid Sans Fallback;
  736. }