weui.wxss 21 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211
  1. /*!
  2. * weui.js v1.1.0 (https://github.com/weui/weui-wxss)
  3. * Copyright 2016, wechat ui team
  4. * MIT license
  5. */
  6. page {
  7. line-height: 1.6;
  8. font-family: -apple-system-font, "Helvetica Neue", sans-serif;
  9. }
  10. icon {
  11. vertical-align: middle;
  12. }
  13. .weui-cells {
  14. position: relative;
  15. margin-top: 1.17647059em;
  16. background-color: #fff;
  17. line-height: 1.41176471;
  18. font-size: 26rpx;
  19. }
  20. .weui-cells:before {
  21. content: " ";
  22. position: absolute;
  23. left: 0;
  24. top: 0;
  25. right: 0;
  26. height: 1px;
  27. border-top: 1rpx solid #d9d9d9;
  28. color: #d9d9d9;
  29. }
  30. .weui-cells:after {
  31. content: " ";
  32. position: absolute;
  33. left: 0;
  34. bottom: 0;
  35. right: 0;
  36. height: 1px;
  37. border-bottom: 1rpx solid #d9d9d9;
  38. color: #d9d9d9;
  39. }
  40. .weui-cells__title {
  41. margin-top: 0.77em;
  42. margin-bottom: 0.3em;
  43. padding-left: 15px;
  44. padding-right: 15px;
  45. color: #999;
  46. font-size: 14px;
  47. }
  48. .weui-cells_after-title {
  49. margin-top: 0;
  50. }
  51. .weui-cells__tips {
  52. margin-top: 0.3em;
  53. color: #999;
  54. padding-left: 15px;
  55. padding-right: 15px;
  56. font-size: 14px;
  57. }
  58. .weui-cell {
  59. padding: 10px 15px;
  60. position: relative;
  61. display: -webkit-box;
  62. display: -webkit-flex;
  63. display: flex;
  64. -webkit-box-align: center;
  65. -webkit-align-items: center;
  66. align-items: center;
  67. font-size: 30rpx;
  68. }
  69. .weui-cell:before {
  70. content: " ";
  71. position: absolute;
  72. top: 0;
  73. right: 0;
  74. border-top: 1rpx solid #d9d9d9;
  75. color: #d9d9d9;
  76. left: 15px;
  77. }
  78. .weui-cell:first-child:before {
  79. display: none;
  80. }
  81. .weui-cell_active {
  82. background-color: #ececec;
  83. }
  84. .weui-cell_primary {
  85. -webkit-box-align: start;
  86. -webkit-align-items: flex-start;
  87. align-items: flex-start;
  88. }
  89. .weui-cell__bd {
  90. -webkit-box-flex: 1;
  91. -webkit-flex: 1;
  92. flex: 1;
  93. }
  94. .weui-cell__ft {
  95. text-align: right;
  96. color: #999;
  97. }
  98. .weui-cell_access {
  99. color: inherit;
  100. }
  101. .weui-cell__ft_in-access {
  102. padding-right: 13px;
  103. position: relative;
  104. }
  105. .weui-cell__ft_in-access:after {
  106. content: " ";
  107. display: inline-block;
  108. height: 6px;
  109. width: 6px;
  110. border-width: 2px 2px 0 0;
  111. border-color: #c8c8cd;
  112. border-style: solid;
  113. -webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
  114. transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
  115. position: relative;
  116. top: -2px;
  117. position: absolute;
  118. top: 50%;
  119. margin-top: -4px;
  120. right: 2px;
  121. }
  122. .weui-cell_link {
  123. color: #586c94;
  124. font-size: 14px;
  125. }
  126. .weui-cell_link:active {
  127. background-color: #ececec;
  128. }
  129. .weui-cell_link:first-child:before {
  130. display: block;
  131. }
  132. .weui-icon-radio {
  133. margin-left: 3.2px;
  134. margin-right: 3.2px;
  135. }
  136. .weui-icon-checkbox_circle, .weui-icon-checkbox_success {
  137. margin-left: 4.6px;
  138. margin-right: 4.6px;
  139. }
  140. .weui-check__label:active {
  141. background-color: #ececec;
  142. }
  143. .weui-check {
  144. position: absolute;
  145. left: -9999px;
  146. }
  147. .weui-check__hd_in-checkbox {
  148. padding-right: 0.35em;
  149. }
  150. .weui-cell__ft_in-radio {
  151. padding-left: 0.35em;
  152. }
  153. .weui-cell_input {
  154. padding-top: 0;
  155. padding-bottom: 0;
  156. }
  157. .weui-label {
  158. width: 105px;
  159. word-wrap: break-word;
  160. word-break: break-all;
  161. }
  162. .weui-input {
  163. height: 80rpx;
  164. min-height: 2.58823529em;
  165. line-height: 80rpx;
  166. }
  167. .weui-toptips {
  168. position: fixed;
  169. -webkit-transform: translateZ(0);
  170. transform: translateZ(0);
  171. top: 0;
  172. left: 0;
  173. right: 0;
  174. padding: 5px;
  175. font-size: 14px;
  176. text-align: center;
  177. color: #fff;
  178. z-index: 5000;
  179. word-wrap: break-word;
  180. word-break: break-all;
  181. }
  182. .weui-toptips_warn {
  183. background-color: #e64340;
  184. }
  185. .weui-textarea {
  186. display: block;
  187. width: 100%;
  188. }
  189. .weui-textarea-counter {
  190. color: #b2b2b2;
  191. text-align: right;
  192. }
  193. .weui-textarea-counter_warn {
  194. color: #e64340;
  195. }
  196. .weui-cell_warn {
  197. color: #e64340;
  198. }
  199. .weui-form-preview {
  200. position: relative;
  201. background-color: #fff;
  202. }
  203. .weui-form-preview:before {
  204. content: " ";
  205. position: absolute;
  206. left: 0;
  207. top: 0;
  208. right: 0;
  209. height: 1px;
  210. border-top: 1rpx solid #d9d9d9;
  211. color: #d9d9d9;
  212. }
  213. .weui-form-preview:after {
  214. content: " ";
  215. position: absolute;
  216. left: 0;
  217. bottom: 0;
  218. right: 0;
  219. height: 1px;
  220. border-bottom: 1rpx solid #d9d9d9;
  221. color: #d9d9d9;
  222. }
  223. .weui-form-preview__value {
  224. font-size: 14px;
  225. }
  226. .weui-form-preview__value_in-hd {
  227. font-size: 26px;
  228. }
  229. .weui-form-preview__hd {
  230. position: relative;
  231. padding: 10px 15px;
  232. text-align: right;
  233. line-height: 2.5em;
  234. }
  235. .weui-form-preview__hd:after {
  236. content: " ";
  237. position: absolute;
  238. left: 0;
  239. bottom: 0;
  240. right: 0;
  241. height: 1px;
  242. border-bottom: 1rpx solid #d9d9d9;
  243. color: #d9d9d9;
  244. left: 15px;
  245. }
  246. .weui-form-preview__bd {
  247. padding: 10px 15px;
  248. font-size: 0.9em;
  249. text-align: right;
  250. color: #999;
  251. line-height: 2;
  252. }
  253. .weui-form-preview__ft {
  254. position: relative;
  255. line-height: 50px;
  256. display: -webkit-box;
  257. display: -webkit-flex;
  258. display: flex;
  259. }
  260. .weui-form-preview__ft:after {
  261. content: " ";
  262. position: absolute;
  263. left: 0;
  264. top: 0;
  265. right: 0;
  266. height: 1px;
  267. border-top: 1rpx solid #d5d5d6;
  268. color: #d5d5d6;
  269. }
  270. .weui-form-preview__item {
  271. overflow: hidden;
  272. }
  273. .weui-form-preview__label {
  274. float: left;
  275. margin-right: 1em;
  276. min-width: 4em;
  277. color: #999;
  278. text-align: justify;
  279. text-align-last: justify;
  280. }
  281. .weui-form-preview__value {
  282. display: block;
  283. overflow: hidden;
  284. word-break: normal;
  285. word-wrap: break-word;
  286. }
  287. .weui-form-preview__btn {
  288. position: relative;
  289. display: block;
  290. -webkit-box-flex: 1;
  291. -webkit-flex: 1;
  292. flex: 1;
  293. color: #3cc51f;
  294. text-align: center;
  295. }
  296. .weui-form-preview__btn:after {
  297. content: " ";
  298. position: absolute;
  299. left: 0;
  300. top: 0;
  301. width: 1px;
  302. bottom: 0;
  303. border-left: 1rpx solid #d5d5d6;
  304. color: #d5d5d6;
  305. }
  306. .weui-form-preview__btn:first-child:after {
  307. display: none;
  308. }
  309. .weui-form-preview__btn_active {
  310. background-color: #eee;
  311. }
  312. .weui-form-preview__btn_default {
  313. color: #999;
  314. }
  315. .weui-form-preview__btn_primary {
  316. color: #0bb20c;
  317. }
  318. .weui-cell_select {
  319. padding: 0;
  320. }
  321. .weui-select {
  322. position: relative;
  323. padding-left: 15px;
  324. padding-right: 30px;
  325. height: 2.58823529em;
  326. min-height: 2.58823529em;
  327. line-height: 2.58823529em;
  328. border-right: 1rpx solid #d9d9d9;
  329. }
  330. .weui-select:before {
  331. content: " ";
  332. display: inline-block;
  333. height: 6px;
  334. width: 6px;
  335. border-width: 2px 2px 0 0;
  336. border-color: #c8c8cd;
  337. border-style: solid;
  338. -webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
  339. transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
  340. position: relative;
  341. top: -2px;
  342. position: absolute;
  343. top: 50%;
  344. right: 15px;
  345. margin-top: -4px;
  346. }
  347. .weui-select_in-select-after {
  348. padding-left: 0;
  349. }
  350. .weui-cell__hd_in-select-after, .weui-cell__bd_in-select-before {
  351. padding-left: 15px;
  352. }
  353. .weui-cell_vcode {
  354. padding-right: 0;
  355. }
  356. .weui-vcode-img {
  357. margin-left: 5px;
  358. height: 2.58823529em;
  359. vertical-align: middle;
  360. }
  361. .weui-vcode-btn {
  362. display: inline-block;
  363. height: 2.58823529em;
  364. margin-left: 5px;
  365. padding: 0 0.6em 0 0.7em;
  366. border-left: 1px solid #e5e5e5;
  367. line-height: 2.58823529em;
  368. vertical-align: middle;
  369. font-size: 17px;
  370. color: #3cc51f;
  371. white-space: nowrap;
  372. }
  373. .weui-vcode-btn:active {
  374. color: #52a341;
  375. }
  376. .weui-cell_switch {
  377. padding-top: 6px;
  378. padding-bottom: 6px;
  379. }
  380. .weui-uploader__hd {
  381. display: -webkit-box;
  382. display: -webkit-flex;
  383. display: flex;
  384. padding-bottom: 10px;
  385. -webkit-box-align: center;
  386. -webkit-align-items: center;
  387. align-items: center;
  388. }
  389. .weui-uploader__title {
  390. -webkit-box-flex: 1;
  391. -webkit-flex: 1;
  392. flex: 1;
  393. }
  394. .weui-uploader__info {
  395. color: #b2b2b2;
  396. }
  397. .weui-uploader__bd {
  398. margin-bottom: -4px;
  399. margin-right: -9px;
  400. overflow: hidden;
  401. }
  402. .weui-uploader__file {
  403. float: left;
  404. margin-right: 9px;
  405. margin-bottom: 9px;
  406. }
  407. .weui-uploader__img {
  408. display: block;
  409. width: 79px;
  410. height: 79px;
  411. }
  412. .weui-uploader__file_status {
  413. position: relative;
  414. }
  415. .weui-uploader__file_status:before {
  416. content: " ";
  417. position: absolute;
  418. top: 0;
  419. right: 0;
  420. bottom: 0;
  421. left: 0;
  422. background-color: rgba(0, 0, 0, 0.5);
  423. }
  424. .weui-uploader__file-content {
  425. position: absolute;
  426. top: 50%;
  427. left: 50%;
  428. -webkit-transform: translate(-50%, -50%);
  429. transform: translate(-50%, -50%);
  430. color: #fff;
  431. }
  432. .weui-uploader__input-box {
  433. float: left;
  434. position: relative;
  435. margin-right: 9px;
  436. margin-bottom: 9px;
  437. width: 77px;
  438. height: 77px;
  439. border: 1px solid #d9d9d9;
  440. }
  441. .weui-uploader__input-box:before, .weui-uploader__input-box:after {
  442. content: " ";
  443. position: absolute;
  444. top: 50%;
  445. left: 50%;
  446. -webkit-transform: translate(-50%, -50%);
  447. transform: translate(-50%, -50%);
  448. background-color: #d9d9d9;
  449. }
  450. .weui-uploader__input-box:before {
  451. width: 2px;
  452. height: 39.5px;
  453. }
  454. .weui-uploader__input-box:after {
  455. width: 39.5px;
  456. height: 2px;
  457. }
  458. .weui-uploader__input-box:active {
  459. border-color: #999;
  460. }
  461. .weui-uploader__input-box:active:before, .weui-uploader__input-box:active:after {
  462. background-color: #999;
  463. }
  464. .weui-uploader__input {
  465. position: absolute;
  466. z-index: 1;
  467. top: 0;
  468. left: 0;
  469. width: 100%;
  470. height: 100%;
  471. opacity: 0;
  472. }
  473. .weui-article {
  474. padding: 20px 15px;
  475. font-size: 15px;
  476. }
  477. .weui-article__section {
  478. margin-bottom: 1.5em;
  479. }
  480. .weui-article__h1 {
  481. font-size: 18px;
  482. font-weight: 400;
  483. margin-bottom: 0.9em;
  484. }
  485. .weui-article__h2 {
  486. font-size: 16px;
  487. font-weight: 400;
  488. margin-bottom: 0.34em;
  489. }
  490. .weui-article__h3 {
  491. font-weight: 400;
  492. font-size: 15px;
  493. margin-bottom: 0.34em;
  494. }
  495. .weui-article__p {
  496. margin: 0 0 0.8em;
  497. }
  498. .weui-msg {
  499. padding-top: 36px;
  500. text-align: center;
  501. }
  502. .weui-msg__link {
  503. display: inline;
  504. color: #586c94;
  505. }
  506. .weui-msg__icon-area {
  507. margin-bottom: 30px;
  508. }
  509. .weui-msg__text-area {
  510. margin-bottom: 25px;
  511. padding: 0 20px;
  512. }
  513. .weui-msg__title {
  514. margin-bottom: 5px;
  515. font-weight: 400;
  516. font-size: 20px;
  517. }
  518. .weui-msg__desc {
  519. font-size: 14px;
  520. color: #999;
  521. }
  522. .weui-msg__opr-area {
  523. margin-bottom: 25px;
  524. }
  525. .weui-msg__extra-area {
  526. margin-bottom: 15px;
  527. font-size: 14px;
  528. color: #999;
  529. }
  530. @media screen and (min-height: 438px) {
  531. .weui-msg__extra-area {
  532. position: fixed;
  533. left: 0;
  534. bottom: 0;
  535. width: 100%;
  536. text-align: center;
  537. }
  538. }
  539. .weui-flex {
  540. display: -webkit-box;
  541. display: -webkit-flex;
  542. display: flex;
  543. }
  544. .weui-flex__item {
  545. -webkit-box-flex: 1;
  546. -webkit-flex: 1;
  547. flex: 1;
  548. }
  549. .weui-btn {
  550. margin-top: 15px;
  551. }
  552. .weui-btn:first-child {
  553. margin-top: 0;
  554. }
  555. .weui-btn-area {
  556. margin: 1.17647059em 15px 0.3em;
  557. }
  558. .weui-agree {
  559. display: block;
  560. padding: 0.5em 15px;
  561. font-size: 13px;
  562. }
  563. .weui-agree__text {
  564. color: #999;
  565. }
  566. .weui-agree__link {
  567. display: inline;
  568. color: #586c94;
  569. }
  570. .weui-agree__checkbox {
  571. position: absolute;
  572. left: -9999px;
  573. }
  574. .weui-agree__checkbox-icon {
  575. position: relative;
  576. top: 2px;
  577. display: inline-block;
  578. border: 1px solid #d1d1d1;
  579. background-color: #fff;
  580. border-radius: 3px;
  581. width: 11px;
  582. height: 11px;
  583. }
  584. .weui-agree__checkbox-icon-check {
  585. position: absolute;
  586. top: 1px;
  587. left: 1px;
  588. }
  589. .weui-footer {
  590. color: #999;
  591. font-size: 14px;
  592. text-align: center;
  593. }
  594. .weui-footer_fixed-bottom {
  595. position: fixed;
  596. bottom: 0.52em;
  597. left: 0;
  598. right: 0;
  599. }
  600. .weui-footer__links {
  601. font-size: 0;
  602. }
  603. .weui-footer__link {
  604. display: inline-block;
  605. vertical-align: top;
  606. margin: 0 0.62em;
  607. position: relative;
  608. font-size: 14px;
  609. color: #586c94;
  610. }
  611. .weui-footer__link:before {
  612. content: " ";
  613. position: absolute;
  614. left: 0;
  615. top: 0;
  616. width: 1px;
  617. bottom: 0;
  618. border-left: 1rpx solid #c7c7c7;
  619. color: #c7c7c7;
  620. left: -0.65em;
  621. top: 0.36em;
  622. bottom: 0.36em;
  623. }
  624. .weui-footer__link:first-child:before {
  625. display: none;
  626. }
  627. .weui-footer__text {
  628. padding: 0 0.34em;
  629. font-size: 12px;
  630. }
  631. .weui-grids {
  632. border-top: 1rpx solid #d9d9d9;
  633. border-left: 1rpx solid #d9d9d9;
  634. overflow: hidden;
  635. }
  636. .weui-grid {
  637. position: relative;
  638. float: left;
  639. padding: 20px 10px;
  640. width: 33.33333333%;
  641. box-sizing: border-box;
  642. border-right: 1rpx solid #d9d9d9;
  643. border-bottom: 1rpx solid #d9d9d9;
  644. }
  645. .weui-grid_active {
  646. background-color: #ececec;
  647. }
  648. .weui-grid__icon {
  649. display: block;
  650. width: 28px;
  651. height: 28px;
  652. margin: 0 auto;
  653. }
  654. .weui-grid__label {
  655. margin-top: 5px;
  656. display: block;
  657. text-align: center;
  658. color: #000;
  659. font-size: 14px;
  660. white-space: nowrap;
  661. text-overflow: ellipsis;
  662. overflow: hidden;
  663. }
  664. .weui-loading {
  665. margin: 0 5px;
  666. width: 20px;
  667. height: 20px;
  668. display: inline-block;
  669. vertical-align: middle;
  670. -webkit-animation: weuiLoading 1s steps(12, end) infinite;
  671. animation: weuiLoading 1s steps(12, end) infinite;
  672. background: transparent url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgxMDB2MTAwSDB6Ii8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTlFOUU5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTMwKSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iIzk4OTY5NyIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCAxMDUuOTggNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjOUI5OTlBIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDYwIDc1Ljk4IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0EzQTFBMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSg5MCA2NSA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNBQkE5QUEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoMTIwIDU4LjY2IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0IyQjJCMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNTQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjQkFCOEI5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDE4MCA1MCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDMkMwQzEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTE1MCA0NS45OCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDQkNCQ0IiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTEyMCA0MS4zNCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNEMkQyRDIiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTkwIDM1IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0RBREFEQSIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtNjAgMjQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTJFMkUyIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKC0zMCAtNS45OCA2NSkiLz48L3N2Zz4=) no-repeat;
  673. background-size: 100%;
  674. }
  675. @-webkit-keyframes weuiLoading {
  676. 0% {
  677. -webkit-transform: rotate3d(0, 0, 1, 0deg);
  678. transform: rotate3d(0, 0, 1, 0deg);
  679. }
  680. 100% {
  681. -webkit-transform: rotate3d(0, 0, 1, 360deg);
  682. transform: rotate3d(0, 0, 1, 360deg);
  683. }
  684. }
  685. @keyframes weuiLoading {
  686. 0% {
  687. -webkit-transform: rotate3d(0, 0, 1, 0deg);
  688. transform: rotate3d(0, 0, 1, 0deg);
  689. }
  690. 100% {
  691. -webkit-transform: rotate3d(0, 0, 1, 360deg);
  692. transform: rotate3d(0, 0, 1, 360deg);
  693. }
  694. }
  695. .weui-badge {
  696. display: inline-block;
  697. padding: 0.15em 0.4em;
  698. min-width: 8px;
  699. border-radius: 18px;
  700. background-color: #f43530;
  701. color: #fff;
  702. line-height: 1.2;
  703. text-align: center;
  704. font-size: 12px;
  705. vertical-align: middle;
  706. }
  707. .weui-badge_dot {
  708. padding: 0.4em;
  709. min-width: 0;
  710. }
  711. .weui-loadmore {
  712. width: 65%;
  713. margin: 1.5em auto;
  714. line-height: 1.6em;
  715. font-size: 14px;
  716. text-align: center;
  717. }
  718. .weui-loadmore__tips {
  719. display: inline-block;
  720. vertical-align: middle;
  721. }
  722. .weui-loadmore_line {
  723. border-top: 1px solid #e5e5e5;
  724. margin-top: 2.4em;
  725. }
  726. .weui-loadmore__tips_in-line {
  727. position: relative;
  728. top: -0.9em;
  729. padding: 0 0.55em;
  730. background-color: #fff;
  731. color: #999;
  732. }
  733. .weui-loadmore__tips_in-dot {
  734. position: relative;
  735. padding: 0 0.16em;
  736. width: 4px;
  737. height: 1.6em;
  738. }
  739. .weui-loadmore__tips_in-dot:before {
  740. content: " ";
  741. position: absolute;
  742. top: 50%;
  743. left: 50%;
  744. margin-top: -1px;
  745. margin-left: -2px;
  746. width: 4px;
  747. height: 4px;
  748. border-radius: 50%;
  749. background-color: #e5e5e5;
  750. }
  751. .weui-panel {
  752. background-color: #fff;
  753. margin-top: 10px;
  754. position: relative;
  755. overflow: hidden;
  756. }
  757. .weui-panel:first-child {
  758. margin-top: 0;
  759. }
  760. .weui-panel:before {
  761. content: " ";
  762. position: absolute;
  763. left: 0;
  764. top: 0;
  765. right: 0;
  766. height: 1px;
  767. border-top: 1rpx solid #e5e5e5;
  768. color: #e5e5e5;
  769. }
  770. .weui-panel:after {
  771. content: " ";
  772. position: absolute;
  773. left: 0;
  774. bottom: 0;
  775. right: 0;
  776. height: 1px;
  777. border-bottom: 1rpx solid #e5e5e5;
  778. color: #e5e5e5;
  779. }
  780. .weui-panel__hd {
  781. padding: 14px 15px 10px;
  782. color: #999;
  783. font-size: 13px;
  784. position: relative;
  785. }
  786. .weui-panel__hd:after {
  787. content: " ";
  788. position: absolute;
  789. left: 0;
  790. bottom: 0;
  791. right: 0;
  792. height: 1px;
  793. border-bottom: 1rpx solid #e5e5e5;
  794. color: #e5e5e5;
  795. left: 15px;
  796. }
  797. .weui-media-box {
  798. padding: 15px;
  799. position: relative;
  800. }
  801. .weui-media-box:before {
  802. content: " ";
  803. position: absolute;
  804. left: 0;
  805. top: 0;
  806. right: 0;
  807. height: 1px;
  808. border-top: 1rpx solid #e5e5e5;
  809. color: #e5e5e5;
  810. left: 15px;
  811. }
  812. .weui-media-box:first-child:before {
  813. display: none;
  814. }
  815. .weui-media-box__title {
  816. font-weight: 400;
  817. font-size: 17px;
  818. width: auto;
  819. overflow: hidden;
  820. text-overflow: ellipsis;
  821. white-space: nowrap;
  822. word-wrap: normal;
  823. word-wrap: break-word;
  824. word-break: break-all;
  825. }
  826. .weui-media-box__desc {
  827. color: #999;
  828. font-size: 13px;
  829. line-height: 1.2;
  830. overflow: hidden;
  831. text-overflow: ellipsis;
  832. display: -webkit-box;
  833. -webkit-box-orient: vertical;
  834. -webkit-line-clamp: 2;
  835. }
  836. .weui-media-box__info {
  837. margin-top: 15px;
  838. padding-bottom: 5px;
  839. font-size: 13px;
  840. color: #cecece;
  841. line-height: 1em;
  842. list-style: none;
  843. overflow: hidden;
  844. }
  845. .weui-media-box__info__meta {
  846. float: left;
  847. padding-right: 1em;
  848. }
  849. .weui-media-box__info__meta_extra {
  850. padding-left: 1em;
  851. border-left: 1px solid #cecece;
  852. }
  853. .weui-media-box__title_in-text {
  854. margin-bottom: 8px;
  855. }
  856. .weui-media-box_appmsg {
  857. display: -webkit-box;
  858. display: -webkit-flex;
  859. display: flex;
  860. -webkit-box-align: center;
  861. -webkit-align-items: center;
  862. align-items: center;
  863. }
  864. .weui-media-box__thumb {
  865. width: 100%;
  866. height: 100%;
  867. vertical-align: top;
  868. }
  869. .weui-media-box__hd_in-appmsg {
  870. margin-right: 0.8em;
  871. width: 60px;
  872. height: 60px;
  873. line-height: 60px;
  874. text-align: center;
  875. }
  876. .weui-media-box__bd_in-appmsg {
  877. -webkit-box-flex: 1;
  878. -webkit-flex: 1;
  879. flex: 1;
  880. min-width: 0;
  881. }
  882. .weui-media-box_small-appmsg {
  883. padding: 0;
  884. }
  885. .weui-cells_in-small-appmsg {
  886. margin-top: 0;
  887. }
  888. .weui-cells_in-small-appmsg:before {
  889. display: none;
  890. }
  891. .weui-progress {
  892. display: -webkit-box;
  893. display: -webkit-flex;
  894. display: flex;
  895. -webkit-box-align: center;
  896. -webkit-align-items: center;
  897. align-items: center;
  898. }
  899. .weui-progress__bar {
  900. -webkit-box-flex: 1;
  901. -webkit-flex: 1;
  902. flex: 1;
  903. }
  904. .weui-progress__opr {
  905. margin-left: 15px;
  906. font-size: 0;
  907. }
  908. .weui-navbar {
  909. display: -webkit-box;
  910. display: -webkit-flex;
  911. display: flex;
  912. position: absolute;
  913. z-index: 500;
  914. top: 0;
  915. width: 100%;
  916. border-bottom: 1rpx solid #ccc;
  917. }
  918. .weui-navbar__item {
  919. position: relative;
  920. display: block;
  921. -webkit-box-flex: 1;
  922. -webkit-flex: 1;
  923. flex: 1;
  924. padding: 13px 0;
  925. text-align: center;
  926. font-size: 0;
  927. }
  928. .weui-navbar__item.weui-bar__item_on {
  929. color: #1aad19;
  930. }
  931. .weui-navbar__slider {
  932. position: absolute;
  933. content: " ";
  934. left: 0;
  935. bottom: 0;
  936. width: 6em;
  937. height: 3px;
  938. background-color: #1aad19;
  939. -webkit-transition: -webkit-transform 0.3s;
  940. transition: -webkit-transform 0.3s;
  941. transition: transform 0.3s;
  942. transition: transform 0.3s, -webkit-transform 0.3s;
  943. }
  944. .weui-navbar__title {
  945. display: inline-block;
  946. font-size: 15px;
  947. max-width: 8em;
  948. width: auto;
  949. overflow: hidden;
  950. text-overflow: ellipsis;
  951. white-space: nowrap;
  952. word-wrap: normal;
  953. }
  954. .weui-tab {
  955. position: relative;
  956. height: 100%;
  957. }
  958. .weui-tab__panel {
  959. box-sizing: border-box;
  960. height: 100%;
  961. padding-top: 50px;
  962. overflow: auto;
  963. -webkit-overflow-scrolling: touch;
  964. }
  965. .weui-search-bar {
  966. position: relative;
  967. padding: 8px 10px;
  968. display: -webkit-box;
  969. display: -webkit-flex;
  970. display: flex;
  971. box-sizing: border-box;
  972. background-color: #efeff4;
  973. border-top: 1rpx solid #d7d6dc;
  974. border-bottom: 1rpx solid #d7d6dc;
  975. }
  976. .weui-icon-search {
  977. margin-right: 8px;
  978. font-size: inherit;
  979. }
  980. .weui-icon-search_in-box {
  981. position: absolute;
  982. left: 10px;
  983. top: 7px;
  984. }
  985. .weui-search-bar__text {
  986. display: inline-block;
  987. font-size: 14px;
  988. vertical-align: middle;
  989. }
  990. .weui-search-bar__form {
  991. position: relative;
  992. -webkit-box-flex: 1;
  993. -webkit-flex: auto;
  994. flex: auto;
  995. border-radius: 5px;
  996. background: #fff;
  997. border: 1rpx solid #e6e6ea;
  998. }
  999. .weui-search-bar__box {
  1000. position: relative;
  1001. padding-left: 30px;
  1002. padding-right: 30px;
  1003. width: 100%;
  1004. box-sizing: border-box;
  1005. z-index: 1;
  1006. }
  1007. .weui-search-bar__input {
  1008. height: 28px;
  1009. line-height: 28px;
  1010. font-size: 14px;
  1011. }
  1012. .weui-icon-clear {
  1013. position: absolute;
  1014. top: 0;
  1015. right: 0;
  1016. padding: 7px 8px;
  1017. font-size: 0;
  1018. }
  1019. .weui-search-bar__label {
  1020. position: absolute;
  1021. top: 0;
  1022. right: 0;
  1023. bottom: 0;
  1024. left: 0;
  1025. z-index: 2;
  1026. border-radius: 3px;
  1027. text-align: center;
  1028. color: #9b9b9b;
  1029. background: #fff;
  1030. line-height: 28px;
  1031. }
  1032. .weui-search-bar__cancel-btn {
  1033. margin-left: 10px;
  1034. line-height: 28px;
  1035. color: #09bb07;
  1036. white-space: nowrap;
  1037. }