main.wxss 11 KB

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