main.wxss 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744
  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. -webkit-border-radius: 999px;
  294. border-radius: 999px;
  295. font-size: 24rpx !important;
  296. min-width: 35rpx;
  297. min-height: 35rpx;
  298. display: -webkit-box;
  299. display: -webkit-flex;
  300. display: flex;
  301. -webkit-box-align: center;
  302. -webkit-align-items: center;
  303. align-items: center;
  304. -webkit-box-pack: center;
  305. -webkit-justify-content: center;
  306. justify-content: center;
  307. line-height: 1;
  308. }
  309. .flex_item {
  310. display: -webkit-box;
  311. display: -webkit-flex;
  312. display: flex;
  313. -webkit-box-align: center;
  314. -webkit-align-items: center;
  315. align-items: center;
  316. /* justify-content: space-between; */
  317. }
  318. /* 左右顶格加上下居中 */
  319. .flex-between-center {
  320. display: -webkit-box;
  321. display: -webkit-flex;
  322. display: flex;
  323. -webkit-box-pack: justify;
  324. -webkit-justify-content: space-between;
  325. justify-content: space-between;
  326. -webkit-box-align: center;
  327. -webkit-align-items: center;
  328. align-items: center;
  329. }
  330. /* flex布局-整体居中 */
  331. .flex-center {
  332. display: -webkit-box;
  333. display: -webkit-flex;
  334. display: flex;
  335. -webkit-box-align: center;
  336. -webkit-align-items: center;
  337. align-items: center;
  338. -webkit-box-pack: center;
  339. -webkit-justify-content: center;
  340. justify-content: center;
  341. }
  342. .flex-start {
  343. display: -webkit-box;
  344. display: -webkit-flex;
  345. display: flex;
  346. -webkit-box-align: center;
  347. -webkit-align-items: center;
  348. align-items: center;
  349. -webkit-box-pack: start;
  350. -webkit-justify-content: flex-start;
  351. justify-content: flex-start;
  352. }
  353. /*文字对齐*/
  354. .text-left {
  355. text-align: left !important;
  356. }
  357. .text-center {
  358. text-align: center !important;
  359. }
  360. .text-justify {
  361. text-align: justify !important;
  362. }
  363. .text-right {
  364. text-align: right !important;
  365. }
  366. .text-default {
  367. color: #212121 !important;
  368. }
  369. .text-white {
  370. color: #ffffff !important;
  371. }
  372. .text-primary {
  373. color: #00bcd4 !important;
  374. }
  375. .text-success {
  376. color: #009688 !important;
  377. }
  378. .text-info {
  379. color: #03a9f4 !important;
  380. }
  381. .text-warning {
  382. color: #ffc107 !important;
  383. }
  384. .text-danger {
  385. color: #e51c23 !important;
  386. }
  387. .text-pink {
  388. color: #e91e63 !important;
  389. }
  390. .text-purple {
  391. color: #673ab7 !important;
  392. }
  393. .text-indigo {
  394. color: #3f51b5 !important;
  395. }
  396. .text-gray {
  397. color: #999999 !important;
  398. }
  399. .bg-default {
  400. background-color: #f5f5f5 !important;
  401. }
  402. .bg-primary {
  403. background-color: #00bcd4 !important;
  404. }
  405. .bg-success {
  406. background-color: #009688 !important;
  407. }
  408. .bg-info {
  409. background-color: #03a9f4 !important;
  410. }
  411. .bg-warning {
  412. background-color: #FFB238 !important;
  413. }
  414. .bg-danger {
  415. background-color: #DC4D46 !important;
  416. }
  417. .bg-pink {
  418. background-color: #e91e63 !important;
  419. }
  420. .bg-purple {
  421. background-color: #673ab7 !important;
  422. }
  423. .bg-indigo {
  424. background-color: #3f51b5 !important;
  425. }
  426. .bg-white {
  427. background-color: white !important;
  428. }
  429. .bg-gray {
  430. background-color: #e3e3e3 !important;
  431. }
  432. /* 边框 */
  433. .border-radius-15 {
  434. -webkit-border-radius: 15rpx;
  435. border-radius: 15rpx;
  436. }
  437. .border-radius-10 {
  438. -webkit-border-radius: 10rpx;
  439. border-radius: 10rpx;
  440. }
  441. .border-radius-all {
  442. -webkit-border-radius: 1000rpx;
  443. border-radius: 1000rpx;
  444. }
  445. /* 底部边线 */
  446. .borde-b {
  447. border-bottom: 1px solid #dddddd;
  448. }
  449. /* 弹性盒子 */
  450. .flex {
  451. display: -webkit-box;
  452. display: -webkit-flex;
  453. display: flex;
  454. -webkit-box-align: center;
  455. -webkit-align-items: center;
  456. align-items: center;
  457. -webkit-box-pack: justify;
  458. -webkit-justify-content: space-between;
  459. justify-content: space-between;
  460. }
  461. .items-left {
  462. -webkit-box-pack: start;
  463. -webkit-justify-content: flex-start;
  464. justify-content: flex-start;
  465. }
  466. .items-right {
  467. -webkit-box-pack: end;
  468. -webkit-justify-content: flex-end;
  469. justify-content: flex-end;
  470. }
  471. .flex-shrink-false {
  472. -webkit-flex-shrink: 0;
  473. flex-shrink: 0;
  474. }
  475. .flex-grow-true {
  476. -webkit-box-flex: 1;
  477. -webkit-flex-grow: 1;
  478. flex-grow: 1;
  479. }
  480. .position-relative {
  481. position: relative;
  482. }
  483. view,
  484. scroll-view,
  485. swiper,
  486. swiper-item,
  487. cover-view,
  488. cover-image,
  489. icon,
  490. text,
  491. rich-text,
  492. progress,
  493. button,
  494. checkbox,
  495. form,
  496. input,
  497. label,
  498. radio,
  499. slider,
  500. switch,
  501. textarea,
  502. navigator,
  503. audio,
  504. camera,
  505. image,
  506. video {
  507. -webkit-box-sizing: border-box;
  508. box-sizing: border-box;
  509. }
  510. /* 骨架屏替代方案 */
  511. .Skeleton {
  512. background: #f3f3f3;
  513. padding: 20rpx 0;
  514. -webkit-border-radius: 8rpx;
  515. border-radius: 8rpx;
  516. }
  517. /* 图片载入替代方案 */
  518. .image-wrapper {
  519. font-size: 0;
  520. background: #f3f3f3;
  521. -webkit-border-radius: 4px;
  522. border-radius: 4px;
  523. }
  524. .image-wrapper image {
  525. width: 100%;
  526. height: 100%;
  527. -webkit-transition: 0.6s;
  528. transition: 0.6s;
  529. opacity: 0;
  530. }
  531. .image-wrapper image.loaded {
  532. opacity: 1;
  533. }
  534. uni-rich-text ._img {
  535. max-width: 100% !important;
  536. }
  537. /*边框*/
  538. .b-b:after,
  539. .b-t:after {
  540. position: absolute;
  541. z-index: 3;
  542. left: 0;
  543. right: 0;
  544. height: 0;
  545. content: '';
  546. -webkit-transform: scaleY(0.5);
  547. transform: scaleY(0.5);
  548. border-bottom: 1px solid #e4e7ed;
  549. }
  550. .b-b:after {
  551. bottom: 0;
  552. }
  553. .b-t:after {
  554. top: 0;
  555. }
  556. /* button样式改写 */
  557. uni-button,
  558. button {
  559. height: 80rpx;
  560. line-height: 80rpx;
  561. font-size: 34rpx;
  562. font-weight: normal;
  563. }
  564. uni-button.no-border:before, uni-button.no-border:after, button.no-border:before, button.no-border:after {
  565. border: 0;
  566. }
  567. uni-button[type='default'],
  568. button[type='default'] {
  569. color: #303133;
  570. }
  571. /* input 样式 */
  572. .input-placeholder {
  573. color: #999999;
  574. }
  575. .placeholder {
  576. color: #999999;
  577. }
  578. .margin-l-10 {
  579. margin-left: 10rpx !important;
  580. }
  581. .margin-r-10 {
  582. margin-right: 10rpx !important;
  583. }
  584. .margin-t-10 {
  585. margin-top: 10rpx !important;
  586. }
  587. .margin-b-10 {
  588. margin-bottom: 10rpx !important;
  589. }
  590. .margin-10 {
  591. margin: 10rpx !important;
  592. }
  593. .margin-v-10 {
  594. margin-top: 10rpx !important;
  595. margin-bottom: 10rpx !important;
  596. }
  597. .margin-c-10 {
  598. margin-left: 10rpx !important;
  599. margin-right: 10rpx !important;
  600. }
  601. .padding-l-10 {
  602. padding-left: 10rpx !important;
  603. }
  604. .padding-r-10 {
  605. padding-right: 10rpx !important;
  606. }
  607. .padding-t-10 {
  608. padding-top: 10rpx !important;
  609. }
  610. .padding-b-10 {
  611. padding-bottom: 10rpx !important;
  612. }
  613. .padding-10 {
  614. padding: 10rpx !important;
  615. }
  616. .padding-v-10 {
  617. padding-top: 10rpx !important;
  618. padding-bottom: 10rpx !important;
  619. }
  620. .padding-c-10 {
  621. padding-left: 10rpx !important;
  622. padding-right: 10rpx !important;
  623. }
  624. .margin-l-20 {
  625. margin-left: 20rpx !important;
  626. }
  627. .margin-r-20 {
  628. margin-right: 20rpx !important;
  629. }
  630. .margin-t-20 {
  631. margin-top: 20rpx !important;
  632. }
  633. .margin-b-20 {
  634. margin-bottom: 20rpx !important;
  635. }
  636. .margin-20 {
  637. margin: 20rpx !important;
  638. }
  639. .margin-v-20 {
  640. margin-top: 20rpx !important;
  641. margin-bottom: 20rpx !important;
  642. }
  643. .margin-c-20 {
  644. margin-left: 20rpx !important;
  645. margin-right: 20rpx !important;
  646. }
  647. .padding-l-20 {
  648. padding-left: 20rpx !important;
  649. }
  650. .padding-r-20 {
  651. padding-right: 20rpx !important;
  652. }
  653. .padding-t-20 {
  654. padding-top: 20rpx !important;
  655. }
  656. .padding-b-20 {
  657. padding-bottom: 20rpx !important;
  658. }
  659. .padding-20 {
  660. padding: 20rpx !important;
  661. }
  662. .padding-v-20 {
  663. padding-top: 20rpx !important;
  664. padding-bottom: 20rpx !important;
  665. }
  666. .padding-c-20 {
  667. padding-left: 20rpx !important;
  668. padding-right: 20rpx !important;
  669. }
  670. .margin-l-30 {
  671. margin-left: 30rpx !important;
  672. }
  673. .margin-r-30 {
  674. margin-right: 30rpx !important;
  675. }
  676. .margin-t-30 {
  677. margin-top: 30rpx !important;
  678. }
  679. .margin-b-30 {
  680. margin-bottom: 30rpx !important;
  681. }
  682. .margin-30 {
  683. margin: 30rpx !important;
  684. }
  685. .margin-v-30 {
  686. margin-top: 30rpx !important;
  687. margin-bottom: 30rpx !important;
  688. }
  689. .margin-c-30 {
  690. margin-left: 30rpx !important;
  691. margin-right: 30rpx !important;
  692. }
  693. .padding-l-30 {
  694. padding-left: 30rpx !important;
  695. }
  696. .padding-r-30 {
  697. padding-right: 30rpx !important;
  698. }
  699. .padding-t-30 {
  700. padding-top: 30rpx !important;
  701. }
  702. .padding-b-30 {
  703. padding-bottom: 30rpx !important;
  704. }
  705. .padding-30 {
  706. padding: 30rpx !important;
  707. }
  708. .padding-v-30 {
  709. padding-top: 30rpx !important;
  710. padding-bottom: 30rpx !important;
  711. }
  712. .padding-c-30 {
  713. padding-left: 30rpx !important;
  714. padding-right: 30rpx !important;
  715. }
  716. .font-size-sm {
  717. font-size: 24rpx;
  718. }
  719. .font-size-base {
  720. font-size: 28rpx;
  721. }
  722. .font-size-lg {
  723. font-size: 32rpx;
  724. }
  725. .font-color-yellow {
  726. color: #fd5b23;
  727. }
  728. .font-color-gray {
  729. color: #999999;
  730. }
  731. .font-color-red {
  732. color: #dd524d;
  733. }
  734. .border-color-yellow {
  735. border: 1rpx solid #fd5b23;
  736. }
  737. uni-page-wrapper {
  738. background-color: #f8f8f8;
  739. }
  740. page {
  741. background-color: #f8f8f8;
  742. font-family: PingFang SC, STHeitiSC-Light, Helvetica-Light, arial, sans-serif, Droid Sans Fallback;
  743. }