jquery-weui.css 66 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313
  1. /**
  2. * jQuery WeUI V1.2.1
  3. * By 言川
  4. * http://lihongxun945.github.io/jquery-weui/
  5. */
  6. .preloader {
  7. width: 20px;
  8. height: 20px;
  9. -webkit-transform-origin: 50%;
  10. transform-origin: 50%;
  11. -webkit-animation: preloader-spin 1s steps(12, end) infinite;
  12. animation: preloader-spin 1s steps(12, end) infinite;
  13. }
  14. .preloader:after {
  15. display: block;
  16. width: 100%;
  17. height: 100%;
  18. content: "";
  19. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  20. background-repeat: no-repeat;
  21. background-position: 50%;
  22. background-size: 100%;
  23. }
  24. @-webkit-keyframes preloader-spin {
  25. 100% {
  26. -webkit-transform: rotate(360deg);
  27. transform: rotate(360deg);
  28. }
  29. }
  30. @keyframes preloader-spin {
  31. 100% {
  32. -webkit-transform: rotate(360deg);
  33. transform: rotate(360deg);
  34. }
  35. }
  36. /*
  37. .hairline(@position, @color) when (@position = top) {
  38. border-top: 1px solid @color;
  39. }
  40. .hairline(@position, @color) when (@position = left) {
  41. border-left: 1px solid @color;
  42. }
  43. .hairline(@position, @color) when (@position = bottom) {
  44. border-bottom: 1px solid @color;
  45. }
  46. .hairline(@position, @color) when (@position = right) {
  47. border-right: 1px solid @color;
  48. }
  49. // For right and bottom
  50. .hairline-remove(@position) when not (@position = left) and not (@position = top) {
  51. border-left: 0;
  52. border-bottom: 0;
  53. }
  54. // For left and top
  55. .hairline-remove(@position) when not (@position = right) and not (@position = bottom) {
  56. border-right: 0;
  57. border-top: 0;
  58. }
  59. // For right and bottom
  60. .hairline-color(@position, @color) when not (@position = left) and not (@position = top) {
  61. border-right-color: @color;
  62. border-bottom-color: @color;
  63. }
  64. // For left and top
  65. .hairline-color(@position, @color) when not (@position = right) and not (@position = bottom) {
  66. border-left-color: @color;
  67. border-top-color: @color;
  68. }
  69. */
  70. label > * {
  71. pointer-events: none;
  72. }
  73. html {
  74. font-size: 20px;
  75. }
  76. /*body {*/
  77. /* font-size: 16px;*/
  78. /*}*/
  79. @media only screen and (min-width: 400px) {
  80. html {
  81. font-size: 21.33333333px !important;
  82. }
  83. }
  84. @media only screen and (min-width: 414px) {
  85. html {
  86. font-size: 22.08px !important;
  87. }
  88. }
  89. @media only screen and (min-width: 480px) {
  90. html {
  91. font-size: 25.6px !important;
  92. }
  93. }
  94. .weui_navbar {
  95. z-index: 10;
  96. }
  97. .weui-popup-overlay,
  98. .weui-popup-container {
  99. z-index: 1000;
  100. }
  101. .weui-mask {
  102. z-index: 1000;
  103. }
  104. /* === Grid === */
  105. .weui-row {
  106. display: -webkit-box;
  107. display: -ms-flexbox;
  108. display: flex;
  109. -webkit-box-pack: justify;
  110. -ms-flex-pack: justify;
  111. justify-content: space-between;
  112. -webkit-box-lines: multiple;
  113. -moz-box-lines: multiple;
  114. -ms-flex-wrap: wrap;
  115. flex-wrap: wrap;
  116. -webkit-box-align: start;
  117. -ms-flex-align: start;
  118. align-items: flex-start;
  119. }
  120. .weui-row > [class*="col-"] {
  121. box-sizing: border-box;
  122. }
  123. .weui-row .col-auto {
  124. width: 100%;
  125. }
  126. .weui-row .weui-col-100 {
  127. width: 100%;
  128. width: calc((100% - 15px*0) / 1);
  129. }
  130. .weui-row.weui-no-gutter .weui-col-100 {
  131. width: 100%;
  132. }
  133. .weui-row .weui-col-95 {
  134. width: 95%;
  135. width: calc((100% - 15px*0.05263157894736836) / 1.0526315789473684);
  136. }
  137. .weui-row.weui-no-gutter .weui-col-95 {
  138. width: 95%;
  139. }
  140. .weui-row .weui-col-90 {
  141. width: 90%;
  142. width: calc((100% - 15px*0.11111111111111116) / 1.1111111111111112);
  143. }
  144. .weui-row.weui-no-gutter .weui-col-90 {
  145. width: 90%;
  146. }
  147. .weui-row .weui-col-85 {
  148. width: 85%;
  149. width: calc((100% - 15px*0.17647058823529416) / 1.1764705882352942);
  150. }
  151. .weui-row.weui-no-gutter .weui-col-85 {
  152. width: 85%;
  153. }
  154. .weui-row .weui-col-80 {
  155. width: 80%;
  156. width: calc((100% - 15px*0.25) / 1.25);
  157. }
  158. .weui-row.weui-no-gutter .weui-col-80 {
  159. width: 80%;
  160. }
  161. .weui-row .weui-col-75 {
  162. width: 75%;
  163. width: calc((100% - 15px*0.33333333333333326) / 1.3333333333333333);
  164. }
  165. .weui-row.weui-no-gutter .weui-col-75 {
  166. width: 75%;
  167. }
  168. .weui-row .weui-col-66 {
  169. width: 66.66666666666666%;
  170. width: calc((100% - 15px*0.5000000000000002) / 1.5000000000000002);
  171. }
  172. .weui-row.weui-no-gutter .weui-col-66 {
  173. width: 66.66666666666666%;
  174. }
  175. .weui-row .weui-col-60 {
  176. width: 60%;
  177. width: calc((100% - 15px*0.6666666666666667) / 1.6666666666666667);
  178. }
  179. .weui-row.weui-no-gutter .weui-col-60 {
  180. width: 60%;
  181. }
  182. .weui-row .weui-col-50 {
  183. width: 50%;
  184. width: calc((100% - 15px*1) / 2);
  185. }
  186. .weui-row.weui-no-gutter .weui-col-50 {
  187. width: 50%;
  188. }
  189. .weui-row .weui-col-40 {
  190. width: 40%;
  191. width: calc((100% - 15px*1.5) / 2.5);
  192. }
  193. .weui-row.weui-no-gutter .weui-col-40 {
  194. width: 40%;
  195. }
  196. .weui-row .weui-col-33 {
  197. width: 33.333333333333336%;
  198. width: calc((100% - 15px*2) / 3);
  199. }
  200. .weui-row.weui-no-gutter .weui-col-33 {
  201. width: 33.333333333333336%;
  202. }
  203. .weui-row .weui-col-25 {
  204. width: 25%;
  205. width: calc((100% - 15px*3) / 4);
  206. }
  207. .weui-row.weui-no-gutter .weui-col-25 {
  208. width: 25%;
  209. }
  210. .weui-row .weui-col-20 {
  211. width: 20%;
  212. width: calc((100% - 15px*4) / 5);
  213. }
  214. .weui-row.weui-no-gutter .weui-col-20 {
  215. width: 20%;
  216. }
  217. .weui-row .weui-col-15 {
  218. width: 15%;
  219. width: calc((100% - 15px*5.666666666666667) / 6.666666666666667);
  220. }
  221. .weui-row.weui-no-gutter .weui-col-15 {
  222. width: 15%;
  223. }
  224. .weui-row .weui-col-10 {
  225. width: 10%;
  226. width: calc((100% - 15px*9) / 10);
  227. }
  228. .weui-row.weui-no-gutter .weui-col-10 {
  229. width: 10%;
  230. }
  231. .weui-row .weui-col-5 {
  232. width: 5%;
  233. width: calc((100% - 15px*19) / 20);
  234. }
  235. .weui-row.weui-no-gutter .weui-col-5 {
  236. width: 5%;
  237. }
  238. .weui-row .weui-col-auto:nth-last-child(1),
  239. .weui-row .weui-col-auto:nth-last-child(1) ~ .weui-col-auto {
  240. width: 100%;
  241. width: calc((100% - 15px*0) / 1);
  242. }
  243. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(1),
  244. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(1) ~ .weui-col-auto {
  245. width: 100%;
  246. }
  247. .weui-row .weui-col-auto:nth-last-child(2),
  248. .weui-row .weui-col-auto:nth-last-child(2) ~ .weui-col-auto {
  249. width: 50%;
  250. width: calc((100% - 15px*1) / 2);
  251. }
  252. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(2),
  253. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(2) ~ .weui-col-auto {
  254. width: 50%;
  255. }
  256. .weui-row .weui-col-auto:nth-last-child(3),
  257. .weui-row .weui-col-auto:nth-last-child(3) ~ .weui-col-auto {
  258. width: 33.33333333%;
  259. width: calc((100% - 15px*2) / 3);
  260. }
  261. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(3),
  262. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(3) ~ .weui-col-auto {
  263. width: 33.33333333%;
  264. }
  265. .weui-row .weui-col-auto:nth-last-child(4),
  266. .weui-row .weui-col-auto:nth-last-child(4) ~ .weui-col-auto {
  267. width: 25%;
  268. width: calc((100% - 15px*3) / 4);
  269. }
  270. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(4),
  271. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(4) ~ .weui-col-auto {
  272. width: 25%;
  273. }
  274. .weui-row .weui-col-auto:nth-last-child(5),
  275. .weui-row .weui-col-auto:nth-last-child(5) ~ .weui-col-auto {
  276. width: 20%;
  277. width: calc((100% - 15px*4) / 5);
  278. }
  279. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(5),
  280. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(5) ~ .weui-col-auto {
  281. width: 20%;
  282. }
  283. .weui-row .weui-col-auto:nth-last-child(6),
  284. .weui-row .weui-col-auto:nth-last-child(6) ~ .weui-col-auto {
  285. width: 16.66666667%;
  286. width: calc((100% - 15px*5) / 6);
  287. }
  288. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(6),
  289. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(6) ~ .weui-col-auto {
  290. width: 16.66666667%;
  291. }
  292. .weui-row .weui-col-auto:nth-last-child(7),
  293. .weui-row .weui-col-auto:nth-last-child(7) ~ .weui-col-auto {
  294. width: 14.28571429%;
  295. width: calc((100% - 15px*6) / 7);
  296. }
  297. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(7),
  298. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(7) ~ .weui-col-auto {
  299. width: 14.28571429%;
  300. }
  301. .weui-row .weui-col-auto:nth-last-child(8),
  302. .weui-row .weui-col-auto:nth-last-child(8) ~ .weui-col-auto {
  303. width: 12.5%;
  304. width: calc((100% - 15px*7) / 8);
  305. }
  306. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(8),
  307. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(8) ~ .weui-col-auto {
  308. width: 12.5%;
  309. }
  310. .weui-row .weui-col-auto:nth-last-child(9),
  311. .weui-row .weui-col-auto:nth-last-child(9) ~ .weui-col-auto {
  312. width: 11.11111111%;
  313. width: calc((100% - 15px*8) / 9);
  314. }
  315. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(9),
  316. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(9) ~ .weui-col-auto {
  317. width: 11.11111111%;
  318. }
  319. .weui-row .weui-col-auto:nth-last-child(10),
  320. .weui-row .weui-col-auto:nth-last-child(10) ~ .weui-col-auto {
  321. width: 10%;
  322. width: calc((100% - 15px*9) / 10);
  323. }
  324. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(10),
  325. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(10) ~ .weui-col-auto {
  326. width: 10%;
  327. }
  328. .weui-row .weui-col-auto:nth-last-child(11),
  329. .weui-row .weui-col-auto:nth-last-child(11) ~ .weui-col-auto {
  330. width: 9.09090909%;
  331. width: calc((100% - 15px*10) / 11);
  332. }
  333. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(11),
  334. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(11) ~ .weui-col-auto {
  335. width: 9.09090909%;
  336. }
  337. .weui-row .weui-col-auto:nth-last-child(12),
  338. .weui-row .weui-col-auto:nth-last-child(12) ~ .weui-col-auto {
  339. width: 8.33333333%;
  340. width: calc((100% - 15px*11) / 12);
  341. }
  342. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(12),
  343. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(12) ~ .weui-col-auto {
  344. width: 8.33333333%;
  345. }
  346. .weui-row .weui-col-auto:nth-last-child(13),
  347. .weui-row .weui-col-auto:nth-last-child(13) ~ .weui-col-auto {
  348. width: 7.69230769%;
  349. width: calc((100% - 15px*12) / 13);
  350. }
  351. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(13),
  352. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(13) ~ .weui-col-auto {
  353. width: 7.69230769%;
  354. }
  355. .weui-row .weui-col-auto:nth-last-child(14),
  356. .weui-row .weui-col-auto:nth-last-child(14) ~ .weui-col-auto {
  357. width: 7.14285714%;
  358. width: calc((100% - 15px*13) / 14);
  359. }
  360. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(14),
  361. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(14) ~ .weui-col-auto {
  362. width: 7.14285714%;
  363. }
  364. .weui-row .weui-col-auto:nth-last-child(15),
  365. .weui-row .weui-col-auto:nth-last-child(15) ~ .weui-col-auto {
  366. width: 6.66666667%;
  367. width: calc((100% - 15px*14) / 15);
  368. }
  369. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(15),
  370. .weui-row.weui-no-gutter .weui-col-auto:nth-last-child(15) ~ .weui-col-auto {
  371. width: 6.66666667%;
  372. }
  373. @media all and (min-width: 768px) {
  374. .row .tablet-100 {
  375. width: 100%;
  376. width: calc((100% - 15px*0) / 1);
  377. }
  378. .row.no-gutter .tablet-100 {
  379. width: 100%;
  380. }
  381. .row .tablet-95 {
  382. width: 95%;
  383. width: calc((100% - 15px*0.05263157894736836) / 1.0526315789473684);
  384. }
  385. .row.no-gutter .tablet-95 {
  386. width: 95%;
  387. }
  388. .row .tablet-90 {
  389. width: 90%;
  390. width: calc((100% - 15px*0.11111111111111116) / 1.1111111111111112);
  391. }
  392. .row.no-gutter .tablet-90 {
  393. width: 90%;
  394. }
  395. .row .tablet-85 {
  396. width: 85%;
  397. width: calc((100% - 15px*0.17647058823529416) / 1.1764705882352942);
  398. }
  399. .row.no-gutter .tablet-85 {
  400. width: 85%;
  401. }
  402. .row .tablet-80 {
  403. width: 80%;
  404. width: calc((100% - 15px*0.25) / 1.25);
  405. }
  406. .row.no-gutter .tablet-80 {
  407. width: 80%;
  408. }
  409. .row .tablet-75 {
  410. width: 75%;
  411. width: calc((100% - 15px*0.33333333333333326) / 1.3333333333333333);
  412. }
  413. .row.no-gutter .tablet-75 {
  414. width: 75%;
  415. }
  416. .row .tablet-66 {
  417. width: 66.66666666666666%;
  418. width: calc((100% - 15px*0.5000000000000002) / 1.5000000000000002);
  419. }
  420. .row.no-gutter .tablet-66 {
  421. width: 66.66666666666666%;
  422. }
  423. .row .tablet-60 {
  424. width: 60%;
  425. width: calc((100% - 15px*0.6666666666666667) / 1.6666666666666667);
  426. }
  427. .row.no-gutter .tablet-60 {
  428. width: 60%;
  429. }
  430. .row .tablet-50 {
  431. width: 50%;
  432. width: calc((100% - 15px*1) / 2);
  433. }
  434. .row.no-gutter .tablet-50 {
  435. width: 50%;
  436. }
  437. .row .tablet-40 {
  438. width: 40%;
  439. width: calc((100% - 15px*1.5) / 2.5);
  440. }
  441. .row.no-gutter .tablet-40 {
  442. width: 40%;
  443. }
  444. .row .tablet-33 {
  445. width: 33.333333333333336%;
  446. width: calc((100% - 15px*2) / 3);
  447. }
  448. .row.no-gutter .tablet-33 {
  449. width: 33.333333333333336%;
  450. }
  451. .row .tablet-25 {
  452. width: 25%;
  453. width: calc((100% - 15px*3) / 4);
  454. }
  455. .row.no-gutter .tablet-25 {
  456. width: 25%;
  457. }
  458. .row .tablet-20 {
  459. width: 20%;
  460. width: calc((100% - 15px*4) / 5);
  461. }
  462. .row.no-gutter .tablet-20 {
  463. width: 20%;
  464. }
  465. .row .tablet-15 {
  466. width: 15%;
  467. width: calc((100% - 15px*5.666666666666667) / 6.666666666666667);
  468. }
  469. .row.no-gutter .tablet-15 {
  470. width: 15%;
  471. }
  472. .row .tablet-10 {
  473. width: 10%;
  474. width: calc((100% - 15px*9) / 10);
  475. }
  476. .row.no-gutter .tablet-10 {
  477. width: 10%;
  478. }
  479. .row .tablet-5 {
  480. width: 5%;
  481. width: calc((100% - 15px*19) / 20);
  482. }
  483. .row.no-gutter .tablet-5 {
  484. width: 5%;
  485. }
  486. .row .tablet-auto:nth-last-child(1),
  487. .row .tablet-auto:nth-last-child(1) ~ .col-auto {
  488. width: 100%;
  489. width: calc((100% - 15px*0) / 1);
  490. }
  491. .row.no-gutter .tablet-auto:nth-last-child(1),
  492. .row.no-gutter .tablet-auto:nth-last-child(1) ~ .tablet-auto {
  493. width: 100%;
  494. }
  495. .row .tablet-auto:nth-last-child(2),
  496. .row .tablet-auto:nth-last-child(2) ~ .col-auto {
  497. width: 50%;
  498. width: calc((100% - 15px*1) / 2);
  499. }
  500. .row.no-gutter .tablet-auto:nth-last-child(2),
  501. .row.no-gutter .tablet-auto:nth-last-child(2) ~ .tablet-auto {
  502. width: 50%;
  503. }
  504. .row .tablet-auto:nth-last-child(3),
  505. .row .tablet-auto:nth-last-child(3) ~ .col-auto {
  506. width: 33.33333333%;
  507. width: calc((100% - 15px*2) / 3);
  508. }
  509. .row.no-gutter .tablet-auto:nth-last-child(3),
  510. .row.no-gutter .tablet-auto:nth-last-child(3) ~ .tablet-auto {
  511. width: 33.33333333%;
  512. }
  513. .row .tablet-auto:nth-last-child(4),
  514. .row .tablet-auto:nth-last-child(4) ~ .col-auto {
  515. width: 25%;
  516. width: calc((100% - 15px*3) / 4);
  517. }
  518. .row.no-gutter .tablet-auto:nth-last-child(4),
  519. .row.no-gutter .tablet-auto:nth-last-child(4) ~ .tablet-auto {
  520. width: 25%;
  521. }
  522. .row .tablet-auto:nth-last-child(5),
  523. .row .tablet-auto:nth-last-child(5) ~ .col-auto {
  524. width: 20%;
  525. width: calc((100% - 15px*4) / 5);
  526. }
  527. .row.no-gutter .tablet-auto:nth-last-child(5),
  528. .row.no-gutter .tablet-auto:nth-last-child(5) ~ .tablet-auto {
  529. width: 20%;
  530. }
  531. .row .tablet-auto:nth-last-child(6),
  532. .row .tablet-auto:nth-last-child(6) ~ .col-auto {
  533. width: 16.66666667%;
  534. width: calc((100% - 15px*5) / 6);
  535. }
  536. .row.no-gutter .tablet-auto:nth-last-child(6),
  537. .row.no-gutter .tablet-auto:nth-last-child(6) ~ .tablet-auto {
  538. width: 16.66666667%;
  539. }
  540. .row .tablet-auto:nth-last-child(7),
  541. .row .tablet-auto:nth-last-child(7) ~ .col-auto {
  542. width: 14.28571429%;
  543. width: calc((100% - 15px*6) / 7);
  544. }
  545. .row.no-gutter .tablet-auto:nth-last-child(7),
  546. .row.no-gutter .tablet-auto:nth-last-child(7) ~ .tablet-auto {
  547. width: 14.28571429%;
  548. }
  549. .row .tablet-auto:nth-last-child(8),
  550. .row .tablet-auto:nth-last-child(8) ~ .col-auto {
  551. width: 12.5%;
  552. width: calc((100% - 15px*7) / 8);
  553. }
  554. .row.no-gutter .tablet-auto:nth-last-child(8),
  555. .row.no-gutter .tablet-auto:nth-last-child(8) ~ .tablet-auto {
  556. width: 12.5%;
  557. }
  558. .row .tablet-auto:nth-last-child(9),
  559. .row .tablet-auto:nth-last-child(9) ~ .col-auto {
  560. width: 11.11111111%;
  561. width: calc((100% - 15px*8) / 9);
  562. }
  563. .row.no-gutter .tablet-auto:nth-last-child(9),
  564. .row.no-gutter .tablet-auto:nth-last-child(9) ~ .tablet-auto {
  565. width: 11.11111111%;
  566. }
  567. .row .tablet-auto:nth-last-child(10),
  568. .row .tablet-auto:nth-last-child(10) ~ .col-auto {
  569. width: 10%;
  570. width: calc((100% - 15px*9) / 10);
  571. }
  572. .row.no-gutter .tablet-auto:nth-last-child(10),
  573. .row.no-gutter .tablet-auto:nth-last-child(10) ~ .tablet-auto {
  574. width: 10%;
  575. }
  576. .row .tablet-auto:nth-last-child(11),
  577. .row .tablet-auto:nth-last-child(11) ~ .col-auto {
  578. width: 9.09090909%;
  579. width: calc((100% - 15px*10) / 11);
  580. }
  581. .row.no-gutter .tablet-auto:nth-last-child(11),
  582. .row.no-gutter .tablet-auto:nth-last-child(11) ~ .tablet-auto {
  583. width: 9.09090909%;
  584. }
  585. .row .tablet-auto:nth-last-child(12),
  586. .row .tablet-auto:nth-last-child(12) ~ .col-auto {
  587. width: 8.33333333%;
  588. width: calc((100% - 15px*11) / 12);
  589. }
  590. .row.no-gutter .tablet-auto:nth-last-child(12),
  591. .row.no-gutter .tablet-auto:nth-last-child(12) ~ .tablet-auto {
  592. width: 8.33333333%;
  593. }
  594. .row .tablet-auto:nth-last-child(13),
  595. .row .tablet-auto:nth-last-child(13) ~ .col-auto {
  596. width: 7.69230769%;
  597. width: calc((100% - 15px*12) / 13);
  598. }
  599. .row.no-gutter .tablet-auto:nth-last-child(13),
  600. .row.no-gutter .tablet-auto:nth-last-child(13) ~ .tablet-auto {
  601. width: 7.69230769%;
  602. }
  603. .row .tablet-auto:nth-last-child(14),
  604. .row .tablet-auto:nth-last-child(14) ~ .col-auto {
  605. width: 7.14285714%;
  606. width: calc((100% - 15px*13) / 14);
  607. }
  608. .row.no-gutter .tablet-auto:nth-last-child(14),
  609. .row.no-gutter .tablet-auto:nth-last-child(14) ~ .tablet-auto {
  610. width: 7.14285714%;
  611. }
  612. .row .tablet-auto:nth-last-child(15),
  613. .row .tablet-auto:nth-last-child(15) ~ .col-auto {
  614. width: 6.66666667%;
  615. width: calc((100% - 15px*14) / 15);
  616. }
  617. .row.no-gutter .tablet-auto:nth-last-child(15),
  618. .row.no-gutter .tablet-auto:nth-last-child(15) ~ .tablet-auto {
  619. width: 6.66666667%;
  620. }
  621. }
  622. .weui-cell__hd img {
  623. display: block;
  624. margin-right: 5px;
  625. }
  626. .weui-cell_swiped .weui-cell__bd {
  627. -webkit-transition: -webkit-transform .3s;
  628. transition: -webkit-transform .3s;
  629. transition: transform .3s;
  630. transition: transform .3s, -webkit-transform .3s;
  631. }
  632. .swipeout-touching .weui-cell__bd {
  633. -webkit-transition: none;
  634. transition: none;
  635. }
  636. .weui-dialog,
  637. .weui-toast {
  638. -webkit-transition-duration: .2s;
  639. transition-duration: .2s;
  640. opacity: 0;
  641. -webkit-transform: translate(-50%, -50%);
  642. transform: translate(-50%, -50%);
  643. -webkit-transform-origin: 0 0;
  644. transform-origin: 0 0;
  645. visibility: hidden;
  646. margin: 0;
  647. top: 45%;
  648. z-index: 2000;
  649. }
  650. .weui-dialog .weui-dialog__btn.default,
  651. .weui-toast .weui-dialog__btn.default {
  652. color: #5f646e;
  653. }
  654. .weui-dialog .weui-dialog__btn + .weui-dialog__btn,
  655. .weui-toast .weui-dialog__btn + .weui-dialog__btn {
  656. position: relative;
  657. }
  658. .weui-dialog .weui-dialog__btn + .weui-dialog__btn:after,
  659. .weui-toast .weui-dialog__btn + .weui-dialog__btn:after {
  660. content: " ";
  661. position: absolute;
  662. left: 0;
  663. top: 0;
  664. width: 1px;
  665. height: 100%;
  666. border-left: 1px solid #D5D5D6;
  667. color: #D5D5D6;
  668. -webkit-transform-origin: 0 0;
  669. transform-origin: 0 0;
  670. -webkit-transform: scaleX(0.5);
  671. transform: scaleX(0.5);
  672. }
  673. .weui-dialog.weui-dialog--visible,
  674. .weui-toast.weui-dialog--visible,
  675. .weui-dialog.weui-toast--visible,
  676. .weui-toast.weui-toast--visible {
  677. opacity: 1;
  678. visibility: visible;
  679. }
  680. .weui-toast_forbidden {
  681. color: #F76260;
  682. }
  683. .weui-toast_cancel .weui-icon-toast:before {
  684. content: "\EA0D";
  685. }
  686. .weui-toast_forbidden .weui-icon-toast:before {
  687. content: "\EA0B";
  688. color: #F76260;
  689. }
  690. .weui-toast_text {
  691. min-height: 1em;
  692. width: auto;
  693. height: 45px;
  694. border-radius: 25px;
  695. margin-left: 0;
  696. -webkit-transform: scale(0.9) translate3d(-50%, 0, 0);
  697. transform: scale(0.9) translate3d(-50%, 0, 0);
  698. -webkit-transform-origin: left;
  699. transform-origin: left;
  700. }
  701. .weui-toast_text.weui-toast--visible {
  702. -webkit-transform: scale(1) translate3d(-50%, 0, 0);
  703. transform: scale(1) translate3d(-50%, 0, 0);
  704. }
  705. .weui-toast_text .weui-icon-toast {
  706. display: none;
  707. }
  708. .weui-toast_text .weui-toast_content {
  709. margin: 10px 15px;
  710. }
  711. .weui-mask {
  712. opacity: 0;
  713. -webkit-transition-duration: .3s;
  714. transition-duration: .3s;
  715. visibility: hidden;
  716. }
  717. .weui-mask.weui-mask--visible {
  718. opacity: 1;
  719. visibility: visible;
  720. }
  721. .weui-prompt-input {
  722. padding: 4px 6px;
  723. border: 1px solid #ccc;
  724. box-sizing: border-box;
  725. height: 2em;
  726. width: 80%;
  727. margin-top: 10px;
  728. }
  729. .weui-pull-to-refresh {
  730. margin-top: -50px;
  731. -webkit-transition: -webkit-transform .4s;
  732. transition: -webkit-transform .4s;
  733. transition: transform .4s;
  734. transition: transform .4s, -webkit-transform .4s;
  735. }
  736. .weui-pull-to-refresh.refreshing {
  737. -webkit-transform: translate3d(0, 50px, 0);
  738. transform: translate3d(0, 50px, 0);
  739. }
  740. .weui-pull-to-refresh.touching {
  741. -webkit-transition-duration: 0s;
  742. transition-duration: 0s;
  743. }
  744. .weui-pull-to-refresh__layer {
  745. height: 30px;
  746. line-height: 30px;
  747. padding: 10px;
  748. text-align: center;
  749. }
  750. .weui-pull-to-refresh__layer .down {
  751. display: inline-block;
  752. }
  753. .weui-pull-to-refresh__layer .up,
  754. .weui-pull-to-refresh__layer .refresh {
  755. display: none;
  756. }
  757. .weui-pull-to-refresh__layer .weui-pull-to-refresh__arrow {
  758. display: inline-block;
  759. z-index: 10;
  760. width: 20px;
  761. height: 20px;
  762. margin-right: 4px;
  763. vertical-align: -4px;
  764. background: no-repeat center;
  765. background-size: 13px 20px;
  766. -webkit-transition-duration: 300ms;
  767. transition-duration: 300ms;
  768. -webkit-transform: rotate(0deg) translate3d(0, 0, 0);
  769. transform: rotate(0deg) translate3d(0, 0, 0);
  770. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2026%2040'%3E%3Cpolygon%20points%3D'9%2C22%209%2C0%2017%2C0%2017%2C22%2026%2C22%2013.5%2C40%200%2C22'%20fill%3D'%238c8c8c'%2F%3E%3C%2Fsvg%3E");
  771. }
  772. .weui-pull-to-refresh__layer .weui-pull-to-refresh__preloader {
  773. display: none;
  774. vertical-align: -4px;
  775. margin-right: 4px;
  776. width: 20px;
  777. height: 20px;
  778. -webkit-transform-origin: 50%;
  779. transform-origin: 50%;
  780. -webkit-animation: preloader-spin 1s steps(12, end) infinite;
  781. animation: preloader-spin 1s steps(12, end) infinite;
  782. }
  783. .weui-pull-to-refresh__layer .weui-pull-to-refresh__preloader:after {
  784. display: block;
  785. width: 100%;
  786. height: 100%;
  787. content: "";
  788. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  789. background-repeat: no-repeat;
  790. background-position: 50%;
  791. background-size: 100%;
  792. }
  793. .pull-up .weui-pull-to-refresh__layer .down,
  794. .refreshing .weui-pull-to-refresh__layer .down {
  795. display: none;
  796. }
  797. .pull-up .weui-pull-to-refresh__layer .weui-pull-to-refresh__arrow {
  798. display: inline-block;
  799. -webkit-transform: rotate(180deg) translate3d(0, 0, 0);
  800. transform: rotate(180deg) translate3d(0, 0, 0);
  801. }
  802. .pull-up .weui-pull-to-refresh__layer .up {
  803. display: inline-block;
  804. }
  805. .pull-down .weui-pull-to-refresh__layer .weui-pull-to-refresh__arrow {
  806. display: inline-block;
  807. }
  808. .pull-down .weui-pull-to-refresh__layer .down {
  809. display: inline-block;
  810. }
  811. .refreshing .weui-pull-to-refresh__layer .weui-pull-to-refresh__arrow {
  812. display: none;
  813. }
  814. .refreshing .weui-pull-to-refresh__layer .weui-pull-to-refresh__preloader {
  815. display: inline-block;
  816. }
  817. .refreshing .weui-pull-to-refresh__layer .refresh {
  818. display: inline-block;
  819. }
  820. @keyframes preloader-spin {
  821. 100% {
  822. -webkit-transform: rotate(360deg);
  823. transform: rotate(360deg);
  824. }
  825. }
  826. .weui-tab__bd-item.weui-pull-to-refresh {
  827. position: absolute;
  828. top: 50px;
  829. }
  830. .weui-tabbar__item {
  831. position: relative;
  832. }
  833. .weui-tabbar__item.weui-bar__item--on .weui-tabbar__label {
  834. color: #04BE02;
  835. }
  836. .weui-navbar__item {
  837. color: #888;
  838. }
  839. .weui-navbar__item.weui-bar__item--on {
  840. color: #666;
  841. background-color: #f1f1f1;
  842. }
  843. .weui-tab__bd {
  844. box-sizing: border-box;
  845. height: 100%;
  846. }
  847. .weui-tab__bd .weui-tab__bd-item {
  848. display: none;
  849. height: 100%;
  850. overflow: auto;
  851. }
  852. .weui-tab__bd .weui-tab__bd-item.weui-tab__bd-item--active {
  853. display: block;
  854. }
  855. .weui-navbar + .weui-tab__bd {
  856. padding-top: 50px;
  857. }
  858. .toolbar {
  859. position: relative;
  860. width: 100%;
  861. font-size: .85rem;
  862. line-height: 1.5;
  863. color: #3d4145;
  864. background: #f7f7f8;
  865. }
  866. .toolbar:before {
  867. content: '';
  868. position: absolute;
  869. left: 0;
  870. top: 0;
  871. bottom: auto;
  872. right: auto;
  873. height: 1px;
  874. width: 100%;
  875. background-color: #d9d9d9;
  876. display: block;
  877. z-index: 15;
  878. -webkit-transform-origin: 50% 0%;
  879. transform-origin: 50% 0%;
  880. }
  881. @media only screen and (-webkit-min-device-pixel-ratio: 2) {
  882. .toolbar:before {
  883. -webkit-transform: scaleY(0.5);
  884. transform: scaleY(0.5);
  885. }
  886. }
  887. @media only screen and (-webkit-min-device-pixel-ratio: 3) {
  888. .toolbar:before {
  889. -webkit-transform: scaleY(0.33);
  890. transform: scaleY(0.33);
  891. }
  892. }
  893. .toolbar .toolbar-inner {
  894. height: 2.2rem;
  895. display: -webkit-box;
  896. display: -ms-flexbox;
  897. display: flex;
  898. text-align: center;
  899. }
  900. .toolbar .title {
  901. position: absolute;
  902. display: block;
  903. width: 100%;
  904. padding: 0;
  905. font-size: .85rem;
  906. font-weight: normal;
  907. line-height: 2.2rem;
  908. color: #3d4145;
  909. text-align: center;
  910. white-space: nowrap;
  911. }
  912. .toolbar .picker-button {
  913. position: absolute;
  914. right: 0;
  915. box-sizing: border-box;
  916. height: 2.2rem;
  917. line-height: 2.2rem;
  918. color: #04BE02;
  919. z-index: 1;
  920. padding: 0 .5rem;
  921. }
  922. /* === Columns Picker === */
  923. .weui-picker-modal {
  924. width: 100%;
  925. position: absolute;
  926. bottom: 0;
  927. text-align: center;
  928. border-radius: 0;
  929. opacity: 0.6;
  930. color: #3d4145;
  931. -webkit-transition-duration: .3s;
  932. transition-duration: .3s;
  933. height: 13rem;
  934. background: #EFEFF4;
  935. -webkit-transform: translate3d(0, 100%, 0);
  936. transform: translate3d(0, 100%, 0);
  937. -webkit-transition-property: opacity, -webkit-transform;
  938. transition-property: opacity, -webkit-transform;
  939. transition-property: transform, opacity;
  940. transition-property: transform, opacity, -webkit-transform;
  941. }
  942. .weui-picker-modal.picker-modal-inline {
  943. height: 10.8rem;
  944. opacity: 1;
  945. position: static;
  946. -webkit-transform: translate3d(0, 0, 0);
  947. transform: translate3d(0, 0, 0);
  948. }
  949. .weui-picker-modal.picker-modal-inline .toolbar {
  950. display: none;
  951. }
  952. .weui-picker-modal.picker-columns-single .picker-items-col {
  953. width: 100%;
  954. }
  955. .weui-picker-modal.weui-picker-modal-visible {
  956. opacity: 1;
  957. -webkit-transform: translate3d(0, 0, 0);
  958. transform: translate3d(0, 0, 0);
  959. }
  960. .weui-picker-modal .picker-modal-inner {
  961. position: relative;
  962. height: 10.8rem;
  963. }
  964. .weui-picker-modal .picker-columns {
  965. width: 100%;
  966. height: 13rem;
  967. z-index: 11500;
  968. }
  969. .weui-picker-modal .picker-columns.picker-modal-inline,
  970. .popover .weui-picker-modal .picker-columns {
  971. height: 10rem;
  972. }
  973. @media (orientation: landscape) and (max-height: 415px) {
  974. .weui-picker-modal .picker-columns:not(.picker-modal-inline) {
  975. height: 10rem;
  976. }
  977. }
  978. .weui-picker-modal .popover.popover-picker-columns {
  979. width: 14rem;
  980. }
  981. .weui-picker-modal .picker-items {
  982. display: -webkit-box;
  983. display: -ms-flexbox;
  984. display: flex;
  985. -webkit-box-pack: center;
  986. -ms-flex-pack: center;
  987. justify-content: center;
  988. width: 100%;
  989. padding: 0;
  990. text-align: right;
  991. font-size: 1rem;
  992. font-weight: normal;
  993. -webkit-mask-box-image: -webkit-linear-gradient(bottom, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent);
  994. -webkit-mask-box-image: linear-gradient(to top, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent);
  995. }
  996. .weui-picker-modal .bar + .picker-items {
  997. height: 10.8rem;
  998. }
  999. .weui-picker-modal .picker-items-col {
  1000. overflow: hidden;
  1001. position: relative;
  1002. max-height: 100%;
  1003. }
  1004. .weui-picker-modal .picker-items-col.picker-items-col-left {
  1005. text-align: left;
  1006. }
  1007. .weui-picker-modal .picker-items-col.picker-items-col-center {
  1008. text-align: center;
  1009. }
  1010. .weui-picker-modal .picker-items-col.picker-items-col-right {
  1011. text-align: right;
  1012. }
  1013. .weui-picker-modal .picker-items-col.picker-items-col-divider {
  1014. color: #3d4145;
  1015. display: -webkit-box;
  1016. display: -ms-flexbox;
  1017. display: flex;
  1018. -webkit-box-align: center;
  1019. -ms-flex-align: center;
  1020. align-items: center;
  1021. }
  1022. .weui-picker-modal .picker-items-col-wrapper {
  1023. -webkit-transition: 300ms;
  1024. transition: 300ms;
  1025. -webkit-transition-timing-function: ease-out;
  1026. transition-timing-function: ease-out;
  1027. }
  1028. .weui-picker-modal .picker-item {
  1029. height: 32px;
  1030. line-height: 32px;
  1031. padding: 0 10px;
  1032. white-space: nowrap;
  1033. position: relative;
  1034. overflow: hidden;
  1035. text-overflow: ellipsis;
  1036. color: #9b9b9b;
  1037. left: 0;
  1038. top: 0;
  1039. width: 100%;
  1040. box-sizing: border-box;
  1041. -webkit-transition: 300ms;
  1042. transition: 300ms;
  1043. }
  1044. .picker-items-col-absolute .weui-picker-modal .picker-item {
  1045. position: absolute;
  1046. }
  1047. .weui-picker-modal .picker-item.picker-item-far {
  1048. pointer-events: none;
  1049. }
  1050. .weui-picker-modal .picker-item.picker-selected {
  1051. color: #3d4145;
  1052. -webkit-transform: translate3d(0, 0, 0);
  1053. transform: translate3d(0, 0, 0);
  1054. -webkit-transform: rotateX(0deg);
  1055. transform: rotateX(0deg);
  1056. }
  1057. .weui-picker-modal .picker-center-highlight {
  1058. height: 32px;
  1059. box-sizing: border-box;
  1060. position: absolute;
  1061. left: 0;
  1062. width: 100%;
  1063. top: 50%;
  1064. margin-top: -16px;
  1065. pointer-events: none;
  1066. }
  1067. .weui-picker-modal .picker-center-highlight:before {
  1068. content: '';
  1069. position: absolute;
  1070. left: 0;
  1071. top: 0;
  1072. bottom: auto;
  1073. right: auto;
  1074. height: 1px;
  1075. width: 100%;
  1076. background-color: #D9D9D9;
  1077. display: block;
  1078. z-index: 15;
  1079. -webkit-transform-origin: 50% 0%;
  1080. transform-origin: 50% 0%;
  1081. }
  1082. @media only screen and (-webkit-min-device-pixel-ratio: 2) {
  1083. .weui-picker-modal .picker-center-highlight:before {
  1084. -webkit-transform: scaleY(0.5);
  1085. transform: scaleY(0.5);
  1086. }
  1087. }
  1088. @media only screen and (-webkit-min-device-pixel-ratio: 3) {
  1089. .weui-picker-modal .picker-center-highlight:before {
  1090. -webkit-transform: scaleY(0.33);
  1091. transform: scaleY(0.33);
  1092. }
  1093. }
  1094. .weui-picker-modal .picker-center-highlight:after {
  1095. content: '';
  1096. position: absolute;
  1097. left: 0;
  1098. bottom: 0;
  1099. right: auto;
  1100. top: auto;
  1101. height: 1px;
  1102. width: 100%;
  1103. background-color: #D9D9D9;
  1104. display: block;
  1105. z-index: 15;
  1106. -webkit-transform-origin: 50% 100%;
  1107. transform-origin: 50% 100%;
  1108. }
  1109. @media only screen and (-webkit-min-device-pixel-ratio: 2) {
  1110. .weui-picker-modal .picker-center-highlight:after {
  1111. -webkit-transform: scaleY(0.5);
  1112. transform: scaleY(0.5);
  1113. }
  1114. }
  1115. @media only screen and (-webkit-min-device-pixel-ratio: 3) {
  1116. .weui-picker-modal .picker-center-highlight:after {
  1117. -webkit-transform: scaleY(0.33);
  1118. transform: scaleY(0.33);
  1119. }
  1120. }
  1121. .weui-picker-modal .picker-3d .picker-items {
  1122. overflow: hidden;
  1123. -webkit-perspective: 1200px;
  1124. perspective: 1200px;
  1125. }
  1126. .weui-picker-modal .picker-3d .picker-items-col,
  1127. .weui-picker-modal .picker-3d .picker-items-col-wrapper,
  1128. .weui-picker-modal .picker-3d .picker-item {
  1129. -webkit-transform-style: preserve-3d;
  1130. transform-style: preserve-3d;
  1131. }
  1132. .weui-picker-modal .picker-3d .picker-items-col {
  1133. overflow: visible;
  1134. }
  1135. .weui-picker-modal .picker-3d .picker-item {
  1136. -webkit-transform-origin: center center -110px;
  1137. transform-origin: center center -110px;
  1138. -webkit-backface-visibility: hidden;
  1139. backface-visibility: hidden;
  1140. -webkit-transition-timing-function: ease-out;
  1141. transition-timing-function: ease-out;
  1142. }
  1143. .weui-picker-overlay,
  1144. .weui-picker-container {
  1145. position: fixed;
  1146. bottom: 0;
  1147. left: 0;
  1148. right: 0;
  1149. height: 0;
  1150. width: 100%;
  1151. z-index: 1000;
  1152. }
  1153. .city-picker .picker-items-col {
  1154. -webkit-box-flex: 1;
  1155. -ms-flex: 1;
  1156. flex: 1;
  1157. max-width: 7rem;
  1158. }
  1159. .weui-picker-container .weui-cells {
  1160. margin: 0;
  1161. text-align: left;
  1162. }
  1163. .datetime-picker .picker-item {
  1164. text-overflow: initial;
  1165. }
  1166. .weui-select-modal {
  1167. height: auto;
  1168. }
  1169. .weui-select-modal .weui-cells {
  1170. margin: 0;
  1171. text-align: left;
  1172. overflow-y: auto;
  1173. overflow-x: hidden;
  1174. max-height: 16rem;
  1175. }
  1176. .weui-select-modal .weui-cells:after {
  1177. display: none;
  1178. }
  1179. /* === Calendar === */
  1180. .weui-picker-calendar {
  1181. background: #fff;
  1182. height: 15rem;
  1183. width: 100%;
  1184. overflow: hidden;
  1185. }
  1186. .weui-picker-calendar .picker-modal-inner {
  1187. overflow: hidden;
  1188. height: 12.8rem;
  1189. }
  1190. .picker-calendar-week-days {
  1191. height: .9rem;
  1192. background: #f7f7f8;
  1193. display: -webkit-box;
  1194. display: -ms-flexbox;
  1195. display: flex;
  1196. font-size: 11px;
  1197. box-sizing: border-box;
  1198. position: relative;
  1199. }
  1200. .picker-calendar-week-days:after {
  1201. content: '';
  1202. position: absolute;
  1203. left: 0;
  1204. bottom: 0;
  1205. right: auto;
  1206. top: auto;
  1207. height: 1px;
  1208. width: 100%;
  1209. background-color: #c4c4c4;
  1210. display: block;
  1211. z-index: 15;
  1212. -webkit-transform-origin: 50% 100%;
  1213. transform-origin: 50% 100%;
  1214. }
  1215. @media only screen and (-webkit-min-device-pixel-ratio: 2) {
  1216. .picker-calendar-week-days:after {
  1217. -webkit-transform: scaleY(0.5);
  1218. transform: scaleY(0.5);
  1219. }
  1220. }
  1221. @media only screen and (-webkit-min-device-pixel-ratio: 3) {
  1222. .picker-calendar-week-days:after {
  1223. -webkit-transform: scaleY(0.33);
  1224. transform: scaleY(0.33);
  1225. }
  1226. }
  1227. .picker-calendar-week-days .picker-calendar-week-day {
  1228. -webkit-flex-shrink: 1;
  1229. -ms-flex: 0 1 auto;
  1230. -ms-flex-negative: 1;
  1231. flex-shrink: 1;
  1232. width: 14.28571429%;
  1233. width: calc(100% / 7);
  1234. line-height: 17px;
  1235. text-align: center;
  1236. }
  1237. .picker-calendar-week-days + .picker-calendar-months {
  1238. height: 11.9rem;
  1239. }
  1240. .picker-calendar-months {
  1241. width: 100%;
  1242. height: 100%;
  1243. overflow: hidden;
  1244. position: relative;
  1245. }
  1246. .picker-calendar-months-wrapper {
  1247. position: relative;
  1248. width: 100%;
  1249. height: 100%;
  1250. -webkit-transition: 300ms;
  1251. transition: 300ms;
  1252. }
  1253. .picker-calendar-month {
  1254. display: -webkit-box;
  1255. display: -ms-flexbox;
  1256. display: flex;
  1257. -webkit-box-orient: vertical;
  1258. -ms-flex-direction: column;
  1259. flex-direction: column;
  1260. width: 100%;
  1261. height: 100%;
  1262. position: absolute;
  1263. left: 0;
  1264. top: 0;
  1265. }
  1266. .picker-calendar-row {
  1267. height: 16.66666667%;
  1268. height: calc(100% / 6);
  1269. display: -webkit-box;
  1270. display: -ms-flexbox;
  1271. display: flex;
  1272. -webkit-flex-shrink: 1;
  1273. -ms-flex: 0 1 auto;
  1274. -ms-flex-negative: 1;
  1275. flex-shrink: 1;
  1276. width: 100%;
  1277. position: relative;
  1278. }
  1279. .picker-calendar-row:after {
  1280. content: '';
  1281. position: absolute;
  1282. left: 0;
  1283. bottom: 0;
  1284. right: auto;
  1285. top: auto;
  1286. height: 1px;
  1287. width: 100%;
  1288. background-color: #ccc;
  1289. display: block;
  1290. z-index: 15;
  1291. -webkit-transform-origin: 50% 100%;
  1292. transform-origin: 50% 100%;
  1293. }
  1294. @media only screen and (-webkit-min-device-pixel-ratio: 2) {
  1295. .picker-calendar-row:after {
  1296. -webkit-transform: scaleY(0.5);
  1297. transform: scaleY(0.5);
  1298. }
  1299. }
  1300. @media only screen and (-webkit-min-device-pixel-ratio: 3) {
  1301. .picker-calendar-row:after {
  1302. -webkit-transform: scaleY(0.33);
  1303. transform: scaleY(0.33);
  1304. }
  1305. }
  1306. .weui-picker-modal .picker-calendar-row:last-child:after {
  1307. display: none;
  1308. }
  1309. .picker-calendar-day {
  1310. -webkit-flex-shrink: 1;
  1311. -ms-flex: 0 1 auto;
  1312. -ms-flex-negative: 1;
  1313. flex-shrink: 1;
  1314. display: -webkit-box;
  1315. display: -ms-flexbox;
  1316. display: flex;
  1317. -webkit-box-pack: center;
  1318. -ms-flex-pack: center;
  1319. justify-content: center;
  1320. -webkit-box-align: center;
  1321. -ms-flex-align: center;
  1322. align-items: center;
  1323. box-sizing: border-box;
  1324. width: 14.28571429%;
  1325. width: calc(100% / 7);
  1326. text-align: center;
  1327. color: #3d4145;
  1328. font-size: 15px;
  1329. cursor: pointer;
  1330. }
  1331. .picker-calendar-day.picker-calendar-day-prev,
  1332. .picker-calendar-day.picker-calendar-day-next {
  1333. color: #ccc;
  1334. }
  1335. .picker-calendar-day.picker-calendar-day-disabled {
  1336. color: #d4d4d4;
  1337. cursor: auto;
  1338. }
  1339. .picker-calendar-day.picker-calendar-day-today span {
  1340. background: #e3e3e3;
  1341. }
  1342. .picker-calendar-day.picker-calendar-day-selected span {
  1343. background: #04BE02;
  1344. color: #fff;
  1345. }
  1346. .picker-calendar-day span {
  1347. display: inline-block;
  1348. border-radius: 100%;
  1349. width: 30px;
  1350. height: 30px;
  1351. line-height: 30px;
  1352. }
  1353. .picker-calendar-month-picker,
  1354. .picker-calendar-year-picker {
  1355. display: -webkit-box;
  1356. display: -ms-flexbox;
  1357. display: flex;
  1358. -webkit-box-align: center;
  1359. -ms-flex-align: center;
  1360. align-items: center;
  1361. -webkit-box-pack: justify;
  1362. -ms-flex-pack: justify;
  1363. justify-content: space-between;
  1364. width: 50%;
  1365. max-width: 200px;
  1366. -webkit-flex-shrink: 10;
  1367. -ms-flex: 0 10 auto;
  1368. -ms-flex-negative: 10;
  1369. flex-shrink: 10;
  1370. }
  1371. .picker-calendar-month-picker a.icon-only,
  1372. .picker-calendar-year-picker a.icon-only {
  1373. min-width: 36px;
  1374. }
  1375. .picker-calendar-month-picker span,
  1376. .picker-calendar-year-picker span {
  1377. -webkit-flex-shrink: 1;
  1378. -ms-flex: 0 1 auto;
  1379. -ms-flex-negative: 1;
  1380. flex-shrink: 1;
  1381. position: relative;
  1382. overflow: hidden;
  1383. text-overflow: ellipsis;
  1384. }
  1385. .popover .picker-calendar .picker-calendar-week-days,
  1386. .picker-calendar.picker-modal-inline .picker-calendar-week-days {
  1387. background: none;
  1388. }
  1389. .popover .picker-calendar .toolbar:before,
  1390. .picker-calendar.picker-modal-inline .toolbar:before,
  1391. .popover .picker-calendar .picker-calendar-week-days:before,
  1392. .picker-calendar.picker-modal-inline .picker-calendar-week-days:before {
  1393. display: none;
  1394. }
  1395. .popover .picker-calendar .toolbar:after,
  1396. .picker-calendar.picker-modal-inline .toolbar:after,
  1397. .popover .picker-calendar .picker-calendar-week-days:after,
  1398. .picker-calendar.picker-modal-inline .picker-calendar-week-days:after {
  1399. display: none;
  1400. }
  1401. .popover .picker-calendar .toolbar ~ .picker-modal-inner .picker-calendar-months:before,
  1402. .picker-calendar.picker-modal-inline .toolbar ~ .picker-modal-inner .picker-calendar-months:before,
  1403. .popover .picker-calendar .picker-calendar-week-days ~ .picker-calendar-months:before,
  1404. .picker-calendar.picker-modal-inline .picker-calendar-week-days ~ .picker-calendar-months:before {
  1405. content: '';
  1406. position: absolute;
  1407. left: 0;
  1408. top: 0;
  1409. bottom: auto;
  1410. right: auto;
  1411. height: 1px;
  1412. width: 100%;
  1413. background-color: #c4c4c4;
  1414. display: block;
  1415. z-index: 15;
  1416. -webkit-transform-origin: 50% 0%;
  1417. transform-origin: 50% 0%;
  1418. }
  1419. @media only screen and (-webkit-min-device-pixel-ratio: 2) {
  1420. .popover .picker-calendar .toolbar ~ .picker-modal-inner .picker-calendar-months:before,
  1421. .picker-calendar.picker-modal-inline .toolbar ~ .picker-modal-inner .picker-calendar-months:before,
  1422. .popover .picker-calendar .picker-calendar-week-days ~ .picker-calendar-months:before,
  1423. .picker-calendar.picker-modal-inline .picker-calendar-week-days ~ .picker-calendar-months:before {
  1424. -webkit-transform: scaleY(0.5);
  1425. transform: scaleY(0.5);
  1426. }
  1427. }
  1428. @media only screen and (-webkit-min-device-pixel-ratio: 3) {
  1429. .popover .picker-calendar .toolbar ~ .picker-modal-inner .picker-calendar-months:before,
  1430. .picker-calendar.picker-modal-inline .toolbar ~ .picker-modal-inner .picker-calendar-months:before,
  1431. .popover .picker-calendar .picker-calendar-week-days ~ .picker-calendar-months:before,
  1432. .picker-calendar.picker-modal-inline .picker-calendar-week-days ~ .picker-calendar-months:before {
  1433. -webkit-transform: scaleY(0.33);
  1434. transform: scaleY(0.33);
  1435. }
  1436. }
  1437. .picker-calendar-month-picker,
  1438. .picker-calendar-year-picker {
  1439. display: block;
  1440. line-height: 2.2rem;
  1441. -webkit-box-flex: 1;
  1442. -ms-flex: 1;
  1443. flex: 1;
  1444. }
  1445. .picker-calendar-month-picker a.icon-only,
  1446. .picker-calendar-year-picker a.icon-only {
  1447. float: left;
  1448. width: 25%;
  1449. height: 2.2rem;
  1450. line-height: 2rem;
  1451. }
  1452. .picker-calendar-month-picker .current-month-value,
  1453. .picker-calendar-year-picker .current-month-value,
  1454. .picker-calendar-month-picker .current-year-value,
  1455. .picker-calendar-year-picker .current-year-value {
  1456. float: left;
  1457. width: 50%;
  1458. height: 2.2rem;
  1459. }
  1460. i.icon {
  1461. display: inline-block;
  1462. vertical-align: middle;
  1463. background-size: 100% auto;
  1464. background-position: center;
  1465. background-repeat: no-repeat;
  1466. font-style: normal;
  1467. position: relative;
  1468. }
  1469. i.icon.icon-next,
  1470. i.icon.icon-prev {
  1471. width: 0.75rem;
  1472. height: 0.75rem;
  1473. }
  1474. i.icon.icon-next {
  1475. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%2304BE02'%20d%3D'M1%2C1.6l11.8%2C5.8L1%2C13.4V1.6%20M0%2C0v15l15-7.6L0%2C0L0%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  1476. }
  1477. i.icon.icon-prev {
  1478. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2015%2015'%3E%3Cg%3E%3Cpath%20fill%3D'%2304BE02'%20d%3D'M14%2C1.6v11.8L2.2%2C7.6L14%2C1.6%20M15%2C0L0%2C7.6L15%2C15V0L15%2C0z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  1479. }
  1480. /**
  1481. * Swiper 3.3.1
  1482. * Most modern mobile touch slider and framework with hardware accelerated transitions
  1483. *
  1484. * http://www.idangero.us/swiper/
  1485. *
  1486. * Copyright 2016, Vladimir Kharlampidi
  1487. * The iDangero.us
  1488. * http://www.idangero.us/
  1489. *
  1490. * Licensed under MIT
  1491. *
  1492. * Released on: February 7, 2016
  1493. */
  1494. .swiper-container {
  1495. margin: 0 auto;
  1496. position: relative;
  1497. overflow: hidden;
  1498. /* Fix of Webkit flickering */
  1499. z-index: 1;
  1500. }
  1501. .swiper-container-no-flexbox .swiper-slide {
  1502. float: left;
  1503. }
  1504. .swiper-container-vertical > .swiper-wrapper {
  1505. -webkit-box-orient: vertical;
  1506. -ms-flex-direction: column;
  1507. flex-direction: column;
  1508. }
  1509. .swiper-wrapper {
  1510. position: relative;
  1511. width: 100%;
  1512. height: 100%;
  1513. z-index: 1;
  1514. display: -webkit-box;
  1515. display: -ms-flexbox;
  1516. display: flex;
  1517. -webkit-transition-property: -webkit-transform;
  1518. transition-property: -webkit-transform;
  1519. transition-property: transform;
  1520. transition-property: transform, -webkit-transform;
  1521. box-sizing: content-box;
  1522. }
  1523. .swiper-container-android .swiper-slide,
  1524. .swiper-wrapper {
  1525. -webkit-transform: translate3d(0px, 0, 0);
  1526. transform: translate3d(0px, 0, 0);
  1527. }
  1528. .swiper-container-multirow > .swiper-wrapper {
  1529. -webkit-box-lines: multiple;
  1530. -moz-box-lines: multiple;
  1531. -ms-flex-wrap: wrap;
  1532. flex-wrap: wrap;
  1533. }
  1534. .swiper-container-free-mode > .swiper-wrapper {
  1535. -webkit-transition-timing-function: ease-out;
  1536. transition-timing-function: ease-out;
  1537. margin: 0 auto;
  1538. }
  1539. .swiper-slide {
  1540. -webkit-flex-shrink: 0;
  1541. -ms-flex: 0 0 auto;
  1542. -ms-flex-negative: 0;
  1543. flex-shrink: 0;
  1544. width: 100%;
  1545. height: 100%;
  1546. position: relative;
  1547. }
  1548. /* Auto Height */
  1549. .swiper-container-autoheight,
  1550. .swiper-container-autoheight .swiper-slide {
  1551. height: auto;
  1552. }
  1553. .swiper-container-autoheight .swiper-wrapper {
  1554. -webkit-box-align: start;
  1555. -ms-flex-align: start;
  1556. align-items: flex-start;
  1557. -webkit-transition-property: -webkit-transform, height;
  1558. -webkit-transition-property: height, -webkit-transform;
  1559. transition-property: height, -webkit-transform;
  1560. transition-property: transform, height;
  1561. transition-property: transform, height, -webkit-transform;
  1562. }
  1563. /* a11y */
  1564. .swiper-container .swiper-notification {
  1565. position: absolute;
  1566. left: 0;
  1567. top: 0;
  1568. pointer-events: none;
  1569. opacity: 0;
  1570. z-index: -1000;
  1571. }
  1572. /* IE10 Windows Phone 8 Fixes */
  1573. .swiper-wp8-horizontal {
  1574. -ms-touch-action: pan-y;
  1575. touch-action: pan-y;
  1576. }
  1577. .swiper-wp8-vertical {
  1578. -ms-touch-action: pan-x;
  1579. touch-action: pan-x;
  1580. }
  1581. /* Arrows */
  1582. .swiper-button-prev,
  1583. .swiper-button-next {
  1584. position: absolute;
  1585. top: 50%;
  1586. width: 27px;
  1587. height: 44px;
  1588. margin-top: -22px;
  1589. z-index: 10;
  1590. cursor: pointer;
  1591. background-size: 27px 44px;
  1592. background-position: center;
  1593. background-repeat: no-repeat;
  1594. }
  1595. .swiper-button-prev.swiper-button-disabled,
  1596. .swiper-button-next.swiper-button-disabled {
  1597. opacity: 0.35;
  1598. cursor: auto;
  1599. pointer-events: none;
  1600. }
  1601. .swiper-button-prev,
  1602. .swiper-container-rtl .swiper-button-next {
  1603. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  1604. left: 10px;
  1605. right: auto;
  1606. }
  1607. .swiper-button-prev.swiper-button-black,
  1608. .swiper-container-rtl .swiper-button-next.swiper-button-black {
  1609. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
  1610. }
  1611. .swiper-button-prev.swiper-button-white,
  1612. .swiper-container-rtl .swiper-button-next.swiper-button-white {
  1613. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
  1614. }
  1615. .swiper-button-next,
  1616. .swiper-container-rtl .swiper-button-prev {
  1617. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  1618. right: 10px;
  1619. left: auto;
  1620. }
  1621. .swiper-button-next.swiper-button-black,
  1622. .swiper-container-rtl .swiper-button-prev.swiper-button-black {
  1623. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
  1624. }
  1625. .swiper-button-next.swiper-button-white,
  1626. .swiper-container-rtl .swiper-button-prev.swiper-button-white {
  1627. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
  1628. }
  1629. /* Pagination Styles */
  1630. .swiper-pagination {
  1631. position: absolute;
  1632. text-align: center;
  1633. -webkit-transition: 300ms;
  1634. transition: 300ms;
  1635. -webkit-transform: translate3d(0, 0, 0);
  1636. transform: translate3d(0, 0, 0);
  1637. z-index: 10;
  1638. }
  1639. .swiper-pagination.swiper-pagination-hidden {
  1640. opacity: 0;
  1641. }
  1642. /* Common Styles */
  1643. .swiper-pagination-fraction,
  1644. .swiper-pagination-custom,
  1645. .swiper-container-horizontal > .swiper-pagination-bullets {
  1646. bottom: 10px;
  1647. left: 0;
  1648. width: 100%;
  1649. }
  1650. /* Bullets */
  1651. .swiper-pagination-bullet {
  1652. width: 8px;
  1653. height: 8px;
  1654. display: inline-block;
  1655. border-radius: 100%;
  1656. background: #000;
  1657. opacity: 0.2;
  1658. }
  1659. button.swiper-pagination-bullet {
  1660. border: none;
  1661. margin: 0;
  1662. padding: 0;
  1663. box-shadow: none;
  1664. -moz-appearance: none;
  1665. -ms-appearance: none;
  1666. -webkit-appearance: none;
  1667. appearance: none;
  1668. }
  1669. .swiper-pagination-clickable .swiper-pagination-bullet {
  1670. cursor: pointer;
  1671. }
  1672. .swiper-pagination-white .swiper-pagination-bullet {
  1673. background: #fff;
  1674. }
  1675. .swiper-pagination-bullet-active {
  1676. opacity: 1;
  1677. background: #04BE02;
  1678. }
  1679. .swiper-pagination-white .swiper-pagination-bullet-active {
  1680. background: #fff;
  1681. }
  1682. .swiper-pagination-black .swiper-pagination-bullet-active {
  1683. background: #000;
  1684. }
  1685. .swiper-container-vertical > .swiper-pagination-bullets {
  1686. right: 10px;
  1687. top: 50%;
  1688. -webkit-transform: translate3d(0px, -50%, 0);
  1689. transform: translate3d(0px, -50%, 0);
  1690. }
  1691. .swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  1692. margin: 5px 0;
  1693. display: block;
  1694. }
  1695. .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  1696. margin: 0 5px;
  1697. }
  1698. /* Progress */
  1699. .swiper-pagination-progress {
  1700. background: rgba(0, 0, 0, 0.25);
  1701. position: absolute;
  1702. }
  1703. .swiper-pagination-progress .swiper-pagination-progressbar {
  1704. background: #007aff;
  1705. position: absolute;
  1706. left: 0;
  1707. top: 0;
  1708. width: 100%;
  1709. height: 100%;
  1710. -webkit-transform: scale(0);
  1711. transform: scale(0);
  1712. -webkit-transform-origin: left top;
  1713. transform-origin: left top;
  1714. }
  1715. .swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
  1716. -webkit-transform-origin: right top;
  1717. transform-origin: right top;
  1718. }
  1719. .swiper-container-horizontal > .swiper-pagination-progress {
  1720. width: 100%;
  1721. height: 4px;
  1722. left: 0;
  1723. top: 0;
  1724. }
  1725. .swiper-container-vertical > .swiper-pagination-progress {
  1726. width: 4px;
  1727. height: 100%;
  1728. left: 0;
  1729. top: 0;
  1730. }
  1731. .swiper-pagination-progress.swiper-pagination-white {
  1732. background: rgba(255, 255, 255, 0.5);
  1733. }
  1734. .swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
  1735. background: #fff;
  1736. }
  1737. .swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
  1738. background: #000;
  1739. }
  1740. /* 3D Container */
  1741. .swiper-container-3d {
  1742. -webkit-perspective: 1200px;
  1743. -o-perspective: 1200px;
  1744. perspective: 1200px;
  1745. }
  1746. .swiper-container-3d .swiper-wrapper,
  1747. .swiper-container-3d .swiper-slide,
  1748. .swiper-container-3d .swiper-slide-shadow-left,
  1749. .swiper-container-3d .swiper-slide-shadow-right,
  1750. .swiper-container-3d .swiper-slide-shadow-top,
  1751. .swiper-container-3d .swiper-slide-shadow-bottom,
  1752. .swiper-container-3d .swiper-cube-shadow {
  1753. -webkit-transform-style: preserve-3d;
  1754. transform-style: preserve-3d;
  1755. }
  1756. .swiper-container-3d .swiper-slide-shadow-left,
  1757. .swiper-container-3d .swiper-slide-shadow-right,
  1758. .swiper-container-3d .swiper-slide-shadow-top,
  1759. .swiper-container-3d .swiper-slide-shadow-bottom {
  1760. position: absolute;
  1761. left: 0;
  1762. top: 0;
  1763. width: 100%;
  1764. height: 100%;
  1765. pointer-events: none;
  1766. z-index: 10;
  1767. }
  1768. .swiper-container-3d .swiper-slide-shadow-left {
  1769. background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  1770. /* Safari 4+, Chrome */
  1771. background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  1772. /* Chrome 10+, Safari 5.1+, iOS 5+ */
  1773. /* Firefox 3.6-15 */
  1774. /* Opera 11.10-12.00 */
  1775. background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  1776. /* Firefox 16+, IE10, Opera 12.50+ */
  1777. }
  1778. .swiper-container-3d .swiper-slide-shadow-right {
  1779. background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  1780. /* Safari 4+, Chrome */
  1781. background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  1782. /* Chrome 10+, Safari 5.1+, iOS 5+ */
  1783. /* Firefox 3.6-15 */
  1784. /* Opera 11.10-12.00 */
  1785. background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  1786. /* Firefox 16+, IE10, Opera 12.50+ */
  1787. }
  1788. .swiper-container-3d .swiper-slide-shadow-top {
  1789. background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  1790. /* Safari 4+, Chrome */
  1791. background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  1792. /* Chrome 10+, Safari 5.1+, iOS 5+ */
  1793. /* Firefox 3.6-15 */
  1794. /* Opera 11.10-12.00 */
  1795. background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  1796. /* Firefox 16+, IE10, Opera 12.50+ */
  1797. }
  1798. .swiper-container-3d .swiper-slide-shadow-bottom {
  1799. background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  1800. /* Safari 4+, Chrome */
  1801. background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  1802. /* Chrome 10+, Safari 5.1+, iOS 5+ */
  1803. /* Firefox 3.6-15 */
  1804. /* Opera 11.10-12.00 */
  1805. background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  1806. /* Firefox 16+, IE10, Opera 12.50+ */
  1807. }
  1808. /* Coverflow */
  1809. .swiper-container-coverflow .swiper-wrapper,
  1810. .swiper-container-flip .swiper-wrapper {
  1811. /* Windows 8 IE 10 fix */
  1812. -ms-perspective: 1200px;
  1813. }
  1814. /* Cube + Flip */
  1815. .swiper-container-cube,
  1816. .swiper-container-flip {
  1817. overflow: visible;
  1818. }
  1819. .swiper-container-cube .swiper-slide,
  1820. .swiper-container-flip .swiper-slide {
  1821. pointer-events: none;
  1822. -webkit-backface-visibility: hidden;
  1823. backface-visibility: hidden;
  1824. z-index: 1;
  1825. }
  1826. .swiper-container-cube .swiper-slide .swiper-slide,
  1827. .swiper-container-flip .swiper-slide .swiper-slide {
  1828. pointer-events: none;
  1829. }
  1830. .swiper-container-cube .swiper-slide-active,
  1831. .swiper-container-flip .swiper-slide-active,
  1832. .swiper-container-cube .swiper-slide-active .swiper-slide-active,
  1833. .swiper-container-flip .swiper-slide-active .swiper-slide-active {
  1834. pointer-events: auto;
  1835. }
  1836. .swiper-container-cube .swiper-slide-shadow-top,
  1837. .swiper-container-flip .swiper-slide-shadow-top,
  1838. .swiper-container-cube .swiper-slide-shadow-bottom,
  1839. .swiper-container-flip .swiper-slide-shadow-bottom,
  1840. .swiper-container-cube .swiper-slide-shadow-left,
  1841. .swiper-container-flip .swiper-slide-shadow-left,
  1842. .swiper-container-cube .swiper-slide-shadow-right,
  1843. .swiper-container-flip .swiper-slide-shadow-right {
  1844. z-index: 0;
  1845. -webkit-backface-visibility: hidden;
  1846. backface-visibility: hidden;
  1847. }
  1848. /* Cube */
  1849. .swiper-container-cube .swiper-slide {
  1850. visibility: hidden;
  1851. -webkit-transform-origin: 0 0;
  1852. transform-origin: 0 0;
  1853. width: 100%;
  1854. height: 100%;
  1855. }
  1856. .swiper-container-cube.swiper-container-rtl .swiper-slide {
  1857. -webkit-transform-origin: 100% 0;
  1858. transform-origin: 100% 0;
  1859. }
  1860. .swiper-container-cube .swiper-slide-active,
  1861. .swiper-container-cube .swiper-slide-next,
  1862. .swiper-container-cube .swiper-slide-prev,
  1863. .swiper-container-cube .swiper-slide-next + .swiper-slide {
  1864. pointer-events: auto;
  1865. visibility: visible;
  1866. }
  1867. .swiper-container-cube .swiper-cube-shadow {
  1868. position: absolute;
  1869. left: 0;
  1870. bottom: 0px;
  1871. width: 100%;
  1872. height: 100%;
  1873. background: #000;
  1874. opacity: 0.6;
  1875. -webkit-filter: blur(50px);
  1876. filter: blur(50px);
  1877. z-index: 0;
  1878. }
  1879. /* Fade */
  1880. .swiper-container-fade.swiper-container-free-mode .swiper-slide {
  1881. -webkit-transition-timing-function: ease-out;
  1882. transition-timing-function: ease-out;
  1883. }
  1884. .swiper-container-fade .swiper-slide {
  1885. pointer-events: none;
  1886. -webkit-transition-property: opacity;
  1887. transition-property: opacity;
  1888. }
  1889. .swiper-container-fade .swiper-slide .swiper-slide {
  1890. pointer-events: none;
  1891. }
  1892. .swiper-container-fade .swiper-slide-active,
  1893. .swiper-container-fade .swiper-slide-active .swiper-slide-active {
  1894. pointer-events: auto;
  1895. }
  1896. /* Scrollbar */
  1897. .swiper-scrollbar {
  1898. border-radius: 10px;
  1899. position: relative;
  1900. -ms-touch-action: none;
  1901. background: rgba(0, 0, 0, 0.1);
  1902. }
  1903. .swiper-container-horizontal > .swiper-scrollbar {
  1904. position: absolute;
  1905. left: 1%;
  1906. bottom: 3px;
  1907. z-index: 50;
  1908. height: 5px;
  1909. width: 98%;
  1910. }
  1911. .swiper-container-vertical > .swiper-scrollbar {
  1912. position: absolute;
  1913. right: 3px;
  1914. top: 1%;
  1915. z-index: 50;
  1916. width: 5px;
  1917. height: 98%;
  1918. }
  1919. .swiper-scrollbar-drag {
  1920. height: 100%;
  1921. width: 100%;
  1922. position: relative;
  1923. background: rgba(0, 0, 0, 0.5);
  1924. border-radius: 10px;
  1925. left: 0;
  1926. top: 0;
  1927. }
  1928. .swiper-scrollbar-cursor-drag {
  1929. cursor: move;
  1930. }
  1931. /* Preloader */
  1932. .swiper-lazy-preloader {
  1933. width: 42px;
  1934. height: 42px;
  1935. position: absolute;
  1936. left: 50%;
  1937. top: 50%;
  1938. margin-left: -21px;
  1939. margin-top: -21px;
  1940. z-index: 10;
  1941. -webkit-transform-origin: 50%;
  1942. transform-origin: 50%;
  1943. -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  1944. animation: swiper-preloader-spin 1s steps(12, end) infinite;
  1945. }
  1946. .swiper-lazy-preloader:after {
  1947. display: block;
  1948. content: "";
  1949. width: 100%;
  1950. height: 100%;
  1951. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  1952. background-position: 50%;
  1953. background-size: 100%;
  1954. background-repeat: no-repeat;
  1955. }
  1956. .swiper-lazy-preloader-white:after {
  1957. background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  1958. }
  1959. @-webkit-keyframes swiper-preloader-spin {
  1960. 100% {
  1961. -webkit-transform: rotate(360deg);
  1962. }
  1963. }
  1964. @keyframes swiper-preloader-spin {
  1965. 100% {
  1966. -webkit-transform: rotate(360deg);
  1967. transform: rotate(360deg);
  1968. }
  1969. }
  1970. .weui-actionsheet {
  1971. z-index: 10000;
  1972. }
  1973. .weui-popup__overlay,
  1974. .weui-popup__container {
  1975. position: fixed;
  1976. bottom: 0;
  1977. left: 0;
  1978. right: 0;
  1979. height: 0;
  1980. width: 100%;
  1981. height: 100%;
  1982. z-index: 10;
  1983. }
  1984. .weui-popup__overlay {
  1985. background-color: rgba(0, 0, 0, 0.6);
  1986. opacity: 0;
  1987. -webkit-transition: opacity .3s;
  1988. transition: opacity .3s;
  1989. }
  1990. .weui-popup__container {
  1991. display: none;
  1992. }
  1993. .weui-popup__container.weui-popup__container--visible {
  1994. display: block;
  1995. }
  1996. .weui-popup__container .weui-cells {
  1997. margin: 0;
  1998. text-align: left;
  1999. }
  2000. .weui-popup__modal {
  2001. width: 100%;
  2002. position: absolute;
  2003. z-index: 100;
  2004. bottom: 0;
  2005. border-radius: 0;
  2006. opacity: 0.6;
  2007. color: #3d4145;
  2008. -webkit-transition-duration: .3s;
  2009. transition-duration: .3s;
  2010. height: 100%;
  2011. background: #EFEFF4;
  2012. -webkit-transform: translate3d(0, 100%, 0);
  2013. transform: translate3d(0, 100%, 0);
  2014. -webkit-transition-property: opacity, -webkit-transform;
  2015. transition-property: opacity, -webkit-transform;
  2016. transition-property: transform, opacity;
  2017. transition-property: transform, opacity, -webkit-transform;
  2018. overflow-x: hidden;
  2019. overflow-y: auto;
  2020. }
  2021. .popup-bottom .weui-popup__modal {
  2022. height: auto;
  2023. }
  2024. .weui-popup__modal .toolbar {
  2025. position: absolute;
  2026. left: 0;
  2027. top: 0;
  2028. right: 0;
  2029. z-index: 1;
  2030. }
  2031. .weui-popup__modal .modal-content {
  2032. height: 100%;
  2033. padding-top: 2.2rem;
  2034. overflow: auto;
  2035. box-sizing: border-box;
  2036. }
  2037. .weui-popup__container--visible .weui-popup__overlay {
  2038. opacity: 1;
  2039. }
  2040. .weui-popup__container--visible .weui-popup__modal {
  2041. opacity: 1;
  2042. -webkit-transform: translate3d(0, 0, 0);
  2043. transform: translate3d(0, 0, 0);
  2044. }
  2045. .weui-notification {
  2046. position: fixed;
  2047. width: 100%;
  2048. min-height: 3.4rem;
  2049. top: -2rem;
  2050. padding-top: 2rem;
  2051. left: 0;
  2052. right: 0;
  2053. z-index: 9999;
  2054. background-color: rgba(0, 0, 0, 0.85);
  2055. color: white;
  2056. font-size: .65rem;
  2057. -webkit-transform: translate3d(0, -100%, 0);
  2058. transform: translate3d(0, -100%, 0);
  2059. -webkit-transition: .4s;
  2060. transition: .4s;
  2061. }
  2062. .weui-notification.weui-notification--in {
  2063. -webkit-transform: translate3d(0, 0, 0);
  2064. transform: translate3d(0, 0, 0);
  2065. }
  2066. .weui-notification.weui-notification--touching {
  2067. -webkit-transition-duration: 0s;
  2068. transition-duration: 0s;
  2069. }
  2070. .weui-notification .weui-notification__inner {
  2071. padding: .4rem .6rem 1rem .6rem;
  2072. display: -webkit-box;
  2073. display: -ms-flexbox;
  2074. display: flex;
  2075. -webkit-box-align: start;
  2076. -ms-flex-align: start;
  2077. align-items: flex-start;
  2078. }
  2079. .weui-notification .weui-notification__content {
  2080. width: 100%;
  2081. margin: 0rem .4rem;
  2082. }
  2083. .weui-notification .weui-notification__title {
  2084. font-weight: bold;
  2085. }
  2086. .weui-notification .weui-notification__text {
  2087. line-height: 1;
  2088. }
  2089. .weui-notification .weui-notification__media {
  2090. height: 1rem;
  2091. width: 1rem;
  2092. }
  2093. .weui-notification .weui-notification__media img {
  2094. width: 100%;
  2095. }
  2096. .weui-notification .weui-notification__handle-bar {
  2097. position: absolute;
  2098. bottom: .2rem;
  2099. left: 50%;
  2100. -webkit-transform: translate3d(-50%, 0, 0);
  2101. transform: translate3d(-50%, 0, 0);
  2102. width: 2rem;
  2103. height: .3rem;
  2104. border-radius: .15rem;
  2105. background: white;
  2106. opacity: .5;
  2107. }
  2108. .weui-photo-browser-modal {
  2109. position: fixed;
  2110. top: 0;
  2111. left: 0;
  2112. right: 0;
  2113. bottom: 0;
  2114. background: black;
  2115. display: none;
  2116. opacity: 0;
  2117. -webkit-transition: opacity .3s;
  2118. transition: opacity .3s;
  2119. }
  2120. .weui-photo-browser-modal.weui-photo-browser-modal-visible {
  2121. opacity: 1;
  2122. }
  2123. .weui-photo-browser-modal .swiper-container {
  2124. height: 100%;
  2125. -webkit-transform: scale(0.2);
  2126. transform: scale(0.2);
  2127. -webkit-transition: -webkit-transform .5s;
  2128. transition: -webkit-transform .5s;
  2129. transition: transform .5s;
  2130. transition: transform .5s, -webkit-transform .5s;
  2131. }
  2132. .weui-photo-browser-modal .swiper-container .swiper-pagination-bullet {
  2133. background: white;
  2134. visibility: hidden;
  2135. }
  2136. .weui-photo-browser-modal .swiper-container.swiper-container-visible {
  2137. -webkit-transform: scale(1);
  2138. transform: scale(1);
  2139. }
  2140. .weui-photo-browser-modal .swiper-container.swiper-container-visible .swiper-pagination-bullet {
  2141. visibility: visible;
  2142. -webkit-transition-property: visibility;
  2143. transition-property: visibility;
  2144. -webkit-transition-delay: .5s;
  2145. transition-delay: .5s;
  2146. }
  2147. .weui-photo-browser-modal .swiper-container .swiper-pagination {
  2148. bottom: 10px;
  2149. left: 0;
  2150. width: 100%;
  2151. }
  2152. .weui-photo-browser-modal .photo-container {
  2153. height: 100%;
  2154. display: -webkit-box;
  2155. display: -ms-flexbox;
  2156. display: flex;
  2157. -webkit-box-align: center;
  2158. -ms-flex-align: center;
  2159. align-items: center;
  2160. -webkit-box-pack: center;
  2161. -ms-flex-pack: center;
  2162. justify-content: center;
  2163. overflow: hidden;
  2164. }
  2165. .weui-photo-browser-modal .photo-container img {
  2166. max-width: 100%;
  2167. margin-top: -30px;
  2168. }
  2169. .weui-photo-browser-modal .caption {
  2170. position: absolute;
  2171. bottom: 40px;
  2172. left: 0;
  2173. right: 0;
  2174. color: white;
  2175. text-align: center;
  2176. padding: 0 12px;
  2177. min-height: 3rem;
  2178. font-size: 14px;
  2179. z-index: 10;
  2180. -webkit-transition: opacity .3s;
  2181. transition: opacity .3s;
  2182. -webkit-transition-delay: .5s;
  2183. transition-delay: .5s;
  2184. opacity: 0;
  2185. }
  2186. .weui-photo-browser-modal .caption .caption-item {
  2187. display: none;
  2188. opacity: 0;
  2189. -webkit-transition: opacity .15s;
  2190. transition: opacity .15s;
  2191. }
  2192. .weui-photo-browser-modal .caption .caption-item.active {
  2193. display: block;
  2194. opacity: 1;
  2195. }
  2196. .weui-photo-browser-modal .swiper-container-visible .caption {
  2197. opacity: 1;
  2198. }
  2199. .color-primary {
  2200. color: #04BE02;
  2201. }
  2202. .color-danger,
  2203. .color-error {
  2204. color: #f6383a;
  2205. }
  2206. .color-warning {
  2207. color: #f60;
  2208. }
  2209. .color-success {
  2210. color: #4cd964;
  2211. }
  2212. .bg-primary,
  2213. .bg-success,
  2214. .bg-danger,
  2215. .bg-error,
  2216. .bg-warning {
  2217. color: white;
  2218. }
  2219. .bg-primary {
  2220. background-color: #04BE02;
  2221. }
  2222. .bg-danger,
  2223. .bg-error {
  2224. background-color: #f6383a;
  2225. }
  2226. .bg-warning {
  2227. background-color: #f60;
  2228. }
  2229. .bg-success {
  2230. background-color: #4cd964;
  2231. }
  2232. .weui-toptips {
  2233. z-index: 100;
  2234. opacity: 0;
  2235. -webkit-transition: opacity .3s;
  2236. transition: opacity .3s;
  2237. }
  2238. .weui-toptips.weui-toptips_visible {
  2239. opacity: 1;
  2240. }
  2241. .weui-icon_toast {
  2242. font-size: 55px;
  2243. color: white;
  2244. margin-bottom: 6px;
  2245. }
  2246. .weui-toast--forbidden .weui-icon_toast {
  2247. color: #f6383a;
  2248. }
  2249. .weui-toast--text {
  2250. min-height: initial;
  2251. font-size: 18px;
  2252. padding: 8px 16px;
  2253. width: auto;
  2254. top: 40%;
  2255. }
  2256. .weui-toast--text .weui-icon_toast {
  2257. display: none;
  2258. }
  2259. .weui-count {
  2260. display: inline-block;
  2261. height: 25px;
  2262. line-height: 25px;
  2263. }
  2264. .weui-count .weui-count__btn {
  2265. height: 21px;
  2266. width: 21px;
  2267. line-height: 21px;
  2268. display: inline-block;
  2269. position: relative;
  2270. border: 1px solid #04BE02;
  2271. border-radius: 50%;
  2272. vertical-align: -6px;
  2273. }
  2274. .weui-count .weui-count__btn:after,
  2275. .weui-count .weui-count__btn:before {
  2276. content: " ";
  2277. position: absolute;
  2278. height: 1px;
  2279. width: 11px;
  2280. background-color: #04BE02;
  2281. left: 50%;
  2282. top: 50%;
  2283. margin-left: -5.5px;
  2284. }
  2285. .weui-count .weui-count__btn:after {
  2286. height: 11px;
  2287. width: 1px;
  2288. margin-top: -5.5px;
  2289. margin-left: -1px;
  2290. }
  2291. .weui-count .weui-count__decrease:after {
  2292. display: none;
  2293. }
  2294. .weui-count .weui-count__increase {
  2295. background-color: #04BE02;
  2296. }
  2297. .weui-count .weui-count__increase:after,
  2298. .weui-count .weui-count__increase:before {
  2299. background-color: white;
  2300. }
  2301. .weui-count .weui-count__number {
  2302. background-color: transparent;
  2303. font-size: .8rem;
  2304. border: 0;
  2305. width: 1.3rem;
  2306. text-align: center;
  2307. color: #5f646e;
  2308. }
  2309. .weui-panel .weui-media-box__title-after {
  2310. color: #9b9b9b;
  2311. font-size: .65rem;
  2312. float: right;
  2313. }