foxui.min.css 85 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892389338943895389638973898389939003901390239033904390539063907390839093910391139123913391439153916391739183919392039213922392339243925392639273928392939303931393239333934393539363937393839393940394139423943394439453946394739483949395039513952395339543955395639573958395939603961396239633964396539663967396839693970397139723973397439753976397739783979398039813982398339843985398639873988398939903991399239933994399539963997399839994000400140024003400440054006400740084009401040114012401340144015401640174018401940204021402240234024402540264027402840294030403140324033403440354036403740384039404040414042404340444045404640474048404940504051405240534054405540564057405840594060406140624063406440654066406740684069407040714072407340744075407640774078407940804081408240834084408540864087408840894090409140924093409440954096409740984099410041014102410341044105410641074108410941104111411241134114411541164117411841194120412141224123412441254126412741284129413041314132413341344135413641374138413941404141414241434144414541464147414841494150415141524153415441554156415741584159416041614162416341644165416641674168416941704171417241734174417541764177417841794180418141824183418441854186418741884189419041914192419341944195419641974198419942004201420242034204420542064207420842094210421142124213421442154216421742184219422042214222422342244225422642274228422942304231423242334234423542364237423842394240424142424243424442454246424742484249425042514252425342544255425642574258425942604261426242634264426542664267426842694270427142724273427442754276427742784279428042814282428342844285428642874288428942904291429242934294429542964297429842994300430143024303430443054306430743084309431043114312431343144315431643174318431943204321432243234324432543264327432843294330433143324333433443354336433743384339434043414342434343444345434643474348434943504351
  1. html {
  2. font-size: 20px;
  3. -ms-text-size-adjust: 100%;
  4. -webkit-text-size-adjust: 100%;
  5. font-family: sans-serif;
  6. }
  7. @media only screen and (min-width: 400px) {
  8. html {
  9. font-size: 21.33333333px !important;
  10. }
  11. }
  12. @media only screen and (min-width: 414px) {
  13. html {
  14. font-size: 22.08px !important;
  15. }
  16. }
  17. @media only screen and (min-width: 480px) {
  18. html {
  19. font-size: 25.6px !important;
  20. }
  21. }
  22. /*文章*/
  23. * {
  24. box-sizing: border-box;
  25. -webkit-tap-highlight-color: transparent;
  26. -webkit-touch-callout: none;
  27. margin: 0;
  28. padding: 0
  29. }
  30. body {
  31. position: absolute;
  32. top: 0;
  33. right: 0;
  34. bottom: 0;
  35. left: 0;
  36. font-family: "Helvetica Neue", Helvetica, sans-serif;
  37. font-size: 0.7rem;
  38. line-height: 1.5;
  39. color: #333;
  40. background: #fafafa;
  41. overflow: hidden;
  42. }
  43. a,
  44. input,
  45. textarea,
  46. select,
  47. button {
  48. outline: 0 none;
  49. }
  50. a {
  51. background-color: transparent;
  52. text-decoration: none;
  53. -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  54. }
  55. .pull-right { float: right;}
  56. .pull-left { float:left;}
  57. .text-white {color: #fff;}
  58. .text-default { color: #666 }
  59. .text-cancel {color: #999}
  60. .text-success {color: #04ab02 }
  61. .text-primary {color:#0290be }
  62. .text-warning {color:#ff8000 }
  63. .text-danger { color:#ff5555 }
  64. .text-center { text-align: center;}
  65. .text-right { text-align: right;}
  66. .text-bold { font-weight:bold;}
  67. .btn {
  68. -moz-appearance: none;
  69. background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  70. border-radius: 0.25rem;
  71. box-sizing: border-box;
  72. cursor: pointer;
  73. display: block;
  74. font-family: inherit;
  75. font-size: 0.75rem;
  76. height: 2rem;
  77. line-height: 1.9rem;
  78. margin: 0;
  79. padding: 0 0.6rem;
  80. position: relative;
  81. text-align: center;
  82. text-decoration: none;
  83. text-overflow: ellipsis;
  84. white-space: nowrap;
  85. border: 1px solid #f90;
  86. margin: 0.6rem;
  87. -webkit-user-select: none;
  88. -moz-user-select: none;
  89. -moz-transition-duration: 300ms;
  90. -webkit-transition-duration: 300ms;
  91. transition-duration: 300ms;
  92. -webkit-transition-property: background-color;
  93. transition-property: background-color;
  94. display:inline-block;
  95. }
  96. .btn.fullbtn{
  97. margin: 0;
  98. -webkit-border-radius:0;
  99. -moz-border-radius:0;
  100. border-radius:0;
  101. height:2.25rem;
  102. line-height: 2.15rem;
  103. font-size: 0.75rem;
  104. }
  105. .btn.block{
  106. display:block;
  107. }
  108. .btn.mtop{
  109. margin-top:1rem
  110. }
  111. .btn.btn-sm {
  112. height: 1.4rem;
  113. line-height: 1.3rem;
  114. margin: 0;
  115. font-size: 0.65rem;
  116. }
  117. .btn.btn-default {
  118. background: #f7f7f7;
  119. color: #333;
  120. border: 1px solid #dfdfdf
  121. }
  122. .btn.btn-default:active {
  123. background: #dedede;
  124. color: #a1a1a1;
  125. border: 1px solid #c8c8c8;
  126. }
  127. .btn.btn-default.disabled {
  128. background: #f7f7f7;
  129. color: #b2b2b2;
  130. border: 1px solid #dfdfdf
  131. }
  132. .option-picker .option-picker-cell.option .btn.btn-default.disabled{
  133. color: #b2b2b2;
  134. }
  135. .btn.btn-default.disabled:active {
  136. background: #f7f7f7;
  137. color: #c9c9c9;
  138. border: 1px solid #dfdfdf
  139. }
  140. .btn.btn-success {
  141. background: #04be02;
  142. color: #fff;
  143. border: 1px solid #04ab02
  144. }
  145. .btn.btn-success:active,
  146. .btn.btn-success.disabled {
  147. background: #039702;
  148. color: #9be59a;
  149. border: 1px solid #038802;
  150. }
  151. .btn.btn-primary {
  152. background: #0290be;
  153. color: #fff;
  154. border: 1px solid #0281ab
  155. }
  156. .btn.btn-primary:active,
  157. .btn.btn-primary.disabled {
  158. background: #027297;
  159. color: #67abc1;
  160. border: 1px solid #026688;
  161. }
  162. .btn.btn-warning {
  163. background: #ff8000;
  164. color: #fff;
  165. border: 1px solid #ff8000;
  166. }
  167. .btn.btn-warning:active,
  168. .btn.btn-warning.disabled {
  169. background: #e67300;
  170. color: #f4a85a;
  171. border: 1px solid #ce6600;
  172. }
  173. .btn.btn-warning.disabled {
  174. background: #ccc;
  175. color: #fff;
  176. border: 1px solid #ccc;
  177. }
  178. .btn.btn-danger {
  179. background: #ff5555;
  180. color: #fff;
  181. border: 1px solid #ff5555;
  182. }
  183. .btn.btn-danger:active {
  184. background: #c13e3e;
  185. color: #d2848b;
  186. border: 1px solid #ae3838;
  187. }
  188. .btn.btn-danger.disabled {
  189. background: #ccc;
  190. color: #fff;
  191. border: 1px solid #ccc;
  192. }
  193. .btn.btn-default-o {
  194. background: transparent;
  195. color: #666;
  196. border: 1px solid #666
  197. }
  198. .btn.btn-default-o:active {
  199. background: transparent;
  200. color: #666;
  201. border: 1px solid #666
  202. }
  203. .btn.btn-default-o.disabled,
  204. .btn.btn-success-o.disabled,
  205. .btn.btn-primary-o.disabled,
  206. .btn.btn-warning-o.disabled,
  207. .btn.btn-danger-o.disabled {
  208. background: transparent;
  209. color: #999;
  210. border: 1px solid #999
  211. }
  212. .btn.btn-success-o {
  213. background: transparent;
  214. color: #04be02;
  215. border: 1px solid #04ab02
  216. }
  217. .btn.btn-primary-o {
  218. background: transparent;
  219. color: #0290be;
  220. border: 1px solid #0290be
  221. }
  222. .btn.btn-warning-o {
  223. background: transparent;
  224. color: #ff8000;
  225. border: 1px solid #ff8000;
  226. }
  227. .btn.btn-danger-o {
  228. background: transparent;
  229. color: #ff5555;
  230. border: 1px solid #ff5555;
  231. }
  232. /*页面*/
  233. .fui-page,
  234. .fui-page-group {
  235. position: absolute;
  236. left: 0;
  237. top: 0;
  238. width: 100%;
  239. height: 100%;
  240. background: #f3f3f3;
  241. box-sizing: border-box;
  242. display: none;
  243. }
  244. .fui-page.fui-page-current,
  245. .fui-page-group.fui-page-current,
  246. .fui-page.fui-page-visible,
  247. .fui-page-group.fui-page-visible,
  248. .fui-page.fui-page-from-center-to-left,
  249. .fui-page-group.fui-page-from-center-to-left,
  250. .fui-page.fui-page-from-center-to-right,
  251. .fui-page-group.fui-page-from-center-to-right,
  252. .fui-page.fui-page-from-right-to-center,
  253. .fui-page-group.fui-page-from-right-to-center,
  254. .fui-page.fui-page-from-left-to-center,
  255. .fui-page-group.fui-page-from-left-to-center {
  256. display: block;
  257. }
  258. .fui-page.fui-page-current,
  259. .fui-page-group.fui-page-current {
  260. overflow: hidden;
  261. }
  262. .fui-page-group {
  263. display: block;
  264. }
  265. .fui-page-transitioning,
  266. .fui-page-transitioning .swipeback-page-shadow {
  267. -webkit-transition: 400ms;
  268. transition: 400ms;
  269. }
  270. .fui-page-from-right-to-center {
  271. -webkit-animation: pageFromRightToCenter 400ms forwards;
  272. animation: pageFromRightToCenter 400ms forwards;
  273. z-index: 2002;
  274. }
  275. .fui-page-from-center-to-right {
  276. -webkit-animation: pageFromCenterToRight 400ms forwards;
  277. animation: pageFromCenterToRight 400ms forwards;
  278. z-index: 2002;
  279. }
  280. @-webkit-keyframes pageFromRightToCenter {
  281. from {
  282. -webkit-transform: translate3d(100%, 0, 0);
  283. transform: translate3d(100%, 0, 0);
  284. opacity: .9;
  285. }
  286. to {
  287. -webkit-transform: translate3d(0, 0, 0);
  288. transform: translate3d(0, 0, 0);
  289. opacity: 1;
  290. }
  291. }
  292. @keyframes pageFromRightToCenter {
  293. from {
  294. -webkit-transform: translate3d(100%, 0, 0);
  295. transform: translate3d(100%, 0, 0);
  296. opacity: .9;
  297. }
  298. to {
  299. -webkit-transform: translate3d(0, 0, 0);
  300. transform: translate3d(0, 0, 0);
  301. opacity: 1;
  302. }
  303. }
  304. @-webkit-keyframes pageFromCenterToRight {
  305. from {
  306. -webkit-transform: translate3d(0, 0, 0);
  307. transform: translate3d(0, 0, 0);
  308. opacity: 1;
  309. }
  310. to {
  311. -webkit-transform: translate3d(100%, 0, 0);
  312. transform: translate3d(100%, 0, 0);
  313. opacity: .9;
  314. }
  315. }
  316. @keyframes pageFromCenterToRight {
  317. from {
  318. -webkit-transform: translate3d(0, 0, 0);
  319. transform: translate3d(0, 0, 0);
  320. opacity: 1;
  321. }
  322. to {
  323. -webkit-transform: translate3d(100%, 0, 0);
  324. transform: translate3d(100%, 0, 0);
  325. opacity: .9;
  326. }
  327. }
  328. .fui-page-from-center-to-left {
  329. -webkit-animation: pageFromCenterToLeft 400ms forwards;
  330. animation: pageFromCenterToLeft 400ms forwards;
  331. }
  332. .fui-page-from-left-to-center {
  333. -webkit-animation: pageFromLeftToCenter 400ms forwards;
  334. animation: pageFromLeftToCenter 400ms forwards;
  335. }
  336. @-webkit-keyframes pageFromCenterToLeft {
  337. from {
  338. opacity: 1;
  339. -webkit-transform: translate3d(0, 0, 0);
  340. transform: translate3d(0, 0, 0);
  341. }
  342. to {
  343. opacity: 0.5;
  344. -webkit-transform: translate3d(-20%, 0, 0);
  345. transform: translate3d(-20%, 0, 0);
  346. }
  347. }
  348. @keyframes pageFromCenterToLeft {
  349. from {
  350. opacity: 1;
  351. -webkit-transform: translate3d(0, 0, 0);
  352. transform: translate3d(0, 0, 0);
  353. }
  354. to {
  355. opacity: 0.5;
  356. -webkit-transform: translate3d(-20%, 0, 0);
  357. transform: translate3d(-20%, 0, 0);
  358. }
  359. }
  360. @-webkit-keyframes pageFromLeftToCenter {
  361. from {
  362. opacity: .5;
  363. -webkit-transform: translate3d(-20%, 0, 0);
  364. transform: translate3d(-20%, 0, 0);
  365. }
  366. to {
  367. opacity: 1;
  368. -webkit-transform: translate3d(0, 0, 0);
  369. transform: translate3d(0, 0, 0);
  370. }
  371. }
  372. @keyframes pageFromLeftToCenter {
  373. from {
  374. opacity: .5;
  375. -webkit-transform: translate3d(-20%, 0, 0);
  376. transform: translate3d(-20%, 0, 0);
  377. }
  378. to {
  379. opacity: 1;
  380. -webkit-transform: translate3d(0, 0, 0);
  381. transform: translate3d(0, 0, 0);
  382. }
  383. }
  384. /* 标题栏 */
  385. .fui-header {
  386. height: 2.2rem;
  387. width: 100%;
  388. box-sizing: border-box;
  389. font-size: .8rem;
  390. position: absolute;
  391. top:0;
  392. margin: 0;
  393. z-index:1;
  394. -webkit-backface-visibility: hidden;
  395. backface-visibility: hidden;
  396. background:#f7f7f7;
  397. display: -webkit-box;
  398. display: -ms-flexbox;
  399. display: -webkit-flex;
  400. display: flex;
  401. -webkit-box-pack: justify;
  402. -ms-flex-pack: justify;
  403. -webkit-justify-content: space-between;
  404. justify-content: space-between;
  405. -webkit-box-align: center;
  406. -ms-flex-align: center;
  407. -webkit-align-items: center;
  408. }
  409. .fui-header:after {
  410. content: "";
  411. position: absolute;
  412. left: 0;
  413. bottom: 0;
  414. width: 100%;
  415. height: 1px;
  416. border-bottom: 1px solid #D9D9D9;
  417. -webkit-transform-origin: 0 100%;
  418. -ms-transform-origin: 0 100%;
  419. transform-origin: 0 100%;
  420. -webkit-transform: scaleY(0.5);
  421. -ms-transform: scaleY(0.5);
  422. transform: scaleY(0.5);
  423. }
  424. .fui-header .title {
  425. white-space: nowrap;
  426. text-overflow: ellipsis;
  427. overflow: hidden;
  428. height: 2.2rem;
  429. line-height: 2.2rem;
  430. color: #000;
  431. text-align: center;
  432. position: absolute;
  433. display: block;
  434. width: 100%;
  435. padding: 0;
  436. top: 0;
  437. left: 0;
  438. z-index: 1;
  439. }
  440. .fui-header .fui-header-left {
  441. position: absolute;left:0;
  442. padding-left:.3rem; height:2.2rem;
  443. line-height:2.2rem;
  444. z-index: 2;
  445. }
  446. .fui-header .fui-header-right {
  447. position: absolute;right:0;
  448. padding-right:.3rem;
  449. height:2.2rem;
  450. line-height:2.2rem;
  451. z-index: 2;
  452. font-size: .7rem
  453. }
  454. .fui-header a.back:before {
  455. content: " ";
  456. display: inline-block;
  457. -webkit-transform: rotate(45deg);
  458. -ms-transform: rotate(45deg);
  459. transform: rotate(45deg);
  460. height: 0.5rem;
  461. width: 0.5rem;
  462. border-width: 0 0 2px 2px;
  463. border-color: #666;
  464. border-style: solid;
  465. position: relative;
  466. top:0;
  467. }
  468. .fui-header a {
  469. height: 2.2rem;
  470. line-height: 2.2rem;
  471. padding: 0;
  472. margin: 0;
  473. top: 0;
  474. color: #999;
  475. display: block;
  476. padding:0 .5rem;
  477. font-size: .7rem;
  478. }
  479. .fui-header a i {
  480. font-size:1.3rem;
  481. }
  482. .fui-header.fui-header-success {
  483. background-color: #04ab02;border: none;
  484. }
  485. .fui-header.fui-header-primary {
  486. background-color: #0290be;border: none;
  487. }
  488. .fui-header.fui-header-warning {
  489. background-color: #ff8000;border: none;
  490. }
  491. .fui-header.fui-header-danger {
  492. background-color: #ef4f4f;border: none;
  493. }
  494. .fui-header.fui-header-success .title,
  495. .fui-header.fui-header-success .btn,
  496. .fui-header.fui-header-primary .title,
  497. .fui-header.fui-header-primary .btn,
  498. .fui-header.fui-header-warning .title,
  499. .fui-header.fui-header-warning .btn,
  500. .fui-header.fui-header-danger .title,
  501. .fui-header.fui-header-danger .btn {
  502. color: #fff;
  503. }
  504. /*内容*/
  505. .fui-content {
  506. position: absolute;
  507. top: 0;
  508. right: 0;
  509. bottom:0;
  510. left: 0;
  511. overflow: auto;
  512. -webkit-overflow-scrolling: touch;
  513. }
  514. .fui-content.scroll {
  515. overflow: hidden;
  516. }
  517. .fui-header ~ .fui-content {
  518. top:2.2rem;
  519. }
  520. .fui-header ~ .fui-content.margin {
  521. top:2.2rem;
  522. margin-top:5px;
  523. }
  524. .fui-tabbar~.fui-content{
  525. margin-top: 2rem;
  526. }
  527. .fui-header~.fui-tabbar{
  528. margin-top: 2.2rem;
  529. }
  530. .fui-navbar ~ .fui-content,
  531. .fui-content.navbar{
  532. bottom:2.5rem;
  533. padding-bottom:2.2rem;
  534. }
  535. .fui-content.pulldown{
  536. top:-2.2rem;
  537. }
  538. .fui-content-inner {
  539. box-sizing: border-box;
  540. border-top: 1px solid transparent;
  541. margin-top: -1px;
  542. padding-bottom: 0.5rem;
  543. }
  544. .fui-content.transitioning,
  545. .fui-content.refreshing,
  546. .fui-content.loading{
  547. -webkit-transition: -webkit-transform 400ms;
  548. transition: transform 400ms;
  549. }
  550. .fui-content.refreshing {
  551. -webkit-transform: translate3d(0, 2.2rem, 0);
  552. transform: translate3d(0, 2.2rem, 0);
  553. }
  554. .fui-content.loading {
  555. /* -webkit-transform: translate3d(0, -2.2rem, 0);
  556. transform: translate3d(0, -2.2rem, 0);*/
  557. }
  558. .fui-btn-group {
  559. -moz-appearance: none;
  560. background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
  561. border-radius: 0.25rem;
  562. box-sizing: border-box;
  563. cursor: pointer;
  564. display: block;
  565. font-family: inherit;
  566. font-size: 0.7rem;
  567. height: 1.8rem;
  568. line-height: 1.7rem;
  569. margin: 0;
  570. position: relative;
  571. text-align: center;
  572. text-decoration: none;
  573. text-overflow: ellipsis;
  574. white-space: nowrap;
  575. margin: 0.5em;
  576. -webkit-user-select: none;
  577. -moz-user-select: none;
  578. }
  579. .fui-btn-group.fui-btn-group-default {
  580. border: 1px solid #d9d9d9;
  581. }
  582. .fui-btn-group.fui-btn-group-success {
  583. border: 1px solid #04ab02;
  584. }
  585. .fui-btn-group.fui-btn-group-primary {
  586. border: 1px solid #0290be;
  587. }
  588. .fui-btn-group.fui-btn-group-warning {
  589. border: 1px solid #ff8000;
  590. }
  591. .fui-btn-group.fui-btn-group-danger {
  592. border: 1px solid #ef4f4f;
  593. }
  594. .fui-btn-group.fui-btn-group-default a {
  595. color: #aaa;
  596. }
  597. .fui-btn-group.fui-btn-group-success a {
  598. color: #04ab02;
  599. }
  600. .fui-btn-group.fui-btn-group-primary a {
  601. color: #0290be;
  602. }
  603. .fui-btn-group.fui-btn-group-warning a {
  604. color: #ff8000;
  605. }
  606. .fui-btn-group.fui-btn-group-danger a {
  607. color: #ef4f4f;
  608. }
  609. .fui-btn-group a {
  610. display: table-cell;
  611. width: 1%;
  612. color: #333;
  613. -moz-transition-duration: 300ms;
  614. -webkit-transition-duration: 300ms;
  615. transition-duration: 300ms;
  616. -webkit-transition-property: background-color;
  617. transition-property: background-color;
  618. }
  619. .fui-btn-group a.active,
  620. .fui-btn-group a:active {
  621. color: #fff;
  622. }
  623. .fui-btn-group.fui-btn-group-default a.active,
  624. .fui-btn-group.fui-btn-group-default a:active {
  625. background: #ccc;
  626. color: #fff;
  627. }
  628. .fui-btn-group.fui-btn-group-success a.active,
  629. .fui-btn-group.fui-btn-group-success a:active {
  630. background: #04ab02;
  631. }
  632. .fui-btn-group.fui-btn-group-primary a.active,
  633. .fui-btn-group.fui-btn-group-primary a:active {
  634. background: #0290be;
  635. }
  636. .fui-btn-group.fui-btn-group-warning a.active,
  637. .fui-btn-group.fui-btn-group-warning a:active {
  638. background: #ff8000;
  639. }
  640. .fui-btn-group.fui-btn-group-danger a.active,
  641. .fui-btn-group.fui-btn-group-danger a:active {
  642. background: #ef4f4f;
  643. }
  644. .badge {
  645. background-color: #ff5555;
  646. border-radius: 5rem;
  647. color: #fff;
  648. display: inline-block;
  649. font-size: 0.6rem;
  650. line-height: 1;
  651. padding: 0.15rem 0.45rem 0.15rem;
  652. }
  653. .badge.badge-success {
  654. background: #04ab02;
  655. color:#fff;
  656. }
  657. .badge.badge-primary {
  658. background: #0290be;
  659. color:#fff;
  660. }
  661. .badge.badge-danger {
  662. background: #ff5555;
  663. color:#fff;
  664. }
  665. .badge.badge-warning {
  666. background: #ff8000;
  667. color:#fff;
  668. }
  669. .fui-navbar,.fui-footer {
  670. position: fixed;
  671. width: 100%;
  672. bottom: 0;
  673. height: 2.45rem;
  674. background: #fff;
  675. box-shadow:0 0 4px rgba(0,0,0,0.1);
  676. -webkit-box-shadow:0 0 4px rgba(0,0,0,0.1);
  677. -moz-box-shadow:0 0 4px rgba(0,0,0,0.1);
  678. }
  679. .option-picker .fui-navbar{
  680. height:2.25rem;
  681. }
  682. .fui-navbar .nav-item.btn {
  683. color:#fff; border-radius: 0;
  684. }
  685. .fui-navbar .nav-item {
  686. position: relative;
  687. display: table-cell;
  688. height: 2.45rem;
  689. text-align: center;
  690. vertical-align: middle;
  691. width: 1%;
  692. color:#999;
  693. }
  694. .page-goods-detail .fui-navbar .nav-item{
  695. height:2.45rem;
  696. }
  697. .fui-navbar .nav-item.active,
  698. .fui-navbar .nav-item:active {
  699. color: red
  700. }
  701. .fui-navbar .nav-item .label {
  702. display: block;
  703. font-size: 0.55rem;
  704. position: relative;
  705. top: -0.1rem;
  706. }
  707. .fui-navbar .nav-item .icon {
  708. font-size: 1rem;
  709. padding: 0;
  710. }
  711. .fui-navbar .nav-item .badge {
  712. background: red none repeat scroll 0 0;
  713. border-radius: 0.5rem;
  714. color: white;
  715. font-size: 0.6rem;
  716. height: 0.8rem;
  717. left: 50%;
  718. line-height: 0.8rem;
  719. margin-left: 0.1rem;
  720. min-width: 0.8rem;
  721. padding: 0 0.2rem;
  722. position: absolute;
  723. top: 0.1rem;
  724. vertical-align: top;
  725. z-index: 100;
  726. }
  727. .fui-footer .btn {
  728. margin-left:0;
  729. margin-top:.3rem;
  730. }
  731. .fui-footer .btn.block {
  732. margin-left: .4rem;
  733. }
  734. .fui-title {
  735. color: #888;
  736. font-size: .7rem;
  737. margin: 0.5rem 0;
  738. padding: 0 0.7rem;
  739. }
  740. .fui-label {
  741. display: inline-block;
  742. padding:0 .2rem;
  743. background:#d9d9d9;
  744. color:#333;
  745. margin:0 .1rem;
  746. font-size:0.6rem;
  747. }
  748. .fui-label.fui-label-success {
  749. }
  750. .fui-label.fui-label-primary {
  751. }
  752. .fui-label.fui-label-warning {
  753. }
  754. .fui-label.fui-label-danger {
  755. }
  756. .fui-label.fui-label-safety {
  757. }
  758. .fui-label.fui-label-success {background: #04ab02;color:#fff; }
  759. .fui-label.fui-label-primary {background:#0290be;color:#fff; }
  760. .fui-label.fui-label-warning {background:#ff8000;color:#fff; }
  761. .fui-label.fui-label-danger { background:#ff5555;color:#fff; }
  762. .fui-label.fui-label-safety { background:#07B40A;color:#fff; }
  763. .fui-cell-group {
  764. margin-top: 0.5rem;
  765. background-color: #fff;
  766. line-height: 1.4;
  767. font-size: 0.8rem;
  768. overflow: hidden;
  769. position: relative;
  770. display: block;
  771. }
  772. .fui-cell-group.transparent{
  773. background: transparent;
  774. }
  775. .page-goods-detail .fui-sale-group.fui-cell-group:before{
  776. content: " ";
  777. position: absolute;
  778. left: 0.5rem;
  779. right:0.5rem;
  780. top: 0;
  781. height: 1px;
  782. border-top: 1px solid #ebebeb;
  783. color: #ebebeb;
  784. -webkit-transform-origin: 0 0;
  785. -ms-transform-origin: 0 0;
  786. transform-origin: 0 0;
  787. -webkit-transform: scaleY(0.5);
  788. -ms-transform: scaleY(0.5);
  789. transform: scaleY(0.5);
  790. }
  791. .fui-cell-group.notop{
  792. margin-top: 0;
  793. }
  794. .fui-cell-group.sm * {
  795. font-size:0.7rem;
  796. }
  797. .fui-cell-group.fui-cell-group-o {
  798. margin: 0 .5rem;
  799. margin-top: 0.5rem;
  800. border-radius: .5rem;
  801. }
  802. .fui-cell-group.fui-cell-group-o:active a:last-child {
  803. border-bottom-left-radius: 0.3rem;
  804. border-bottom-right-radius: 0.3rem;
  805. }
  806. .fui-cell-group.fui-cell-group-o:active a:first-child {
  807. border-top-left-radius: 0.3rem;
  808. border-top-right-radius: 0.3rem;
  809. }
  810. .fui-cell-group .fui-cell {
  811. position: relative;
  812. padding: 0.75rem 0.6rem 0.65rem;
  813. display: -webkit-box;
  814. display: -webkit-flex;
  815. display: -ms-flexbox;
  816. display: flex;
  817. -webkit-box-align: center;
  818. -webkit-align-items: center;
  819. -ms-flex-align: center;
  820. align-items: center;
  821. -moz-transition-duration: 300ms;
  822. -webkit-transition-duration: 300ms;
  823. transition-duration: 300ms;
  824. -webkit-transition-property: background-color;
  825. transition-property: background-color;
  826. line-height: 1.1;
  827. }
  828. .fui-cell-group .fui-cell.fui-sale-cell{
  829. padding:0.45rem 0.6rem 0.45rem;
  830. }
  831. .fui-cell-group .fui-cell.changepwd,.fui-cell-group .fui-cell.btn-logout{
  832. padding:0;
  833. }
  834. .fui-cell-group .fui-cell.changepwd .fui-cell-text{
  835. border:1px solid #ff5555;
  836. -webkit-border-radius:0.25rem;
  837. -moz-border-radius:0.25rem;
  838. border-radius:0.25rem;
  839. margin: 0.5rem 0.6rem;
  840. color: #ff5555;
  841. background: #fff;
  842. height:2rem;
  843. line-height: 2rem;
  844. }
  845. .fui-cell-group .fui-cell.btn-logout .fui-cell-text{
  846. -webkit-border-radius:0.25rem;
  847. -moz-border-radius:0.25rem;
  848. border-radius:0.25rem;
  849. margin: 0rem 0.6rem;
  850. color: #fff;
  851. background: #ff5555;
  852. height:2rem;
  853. line-height: 2rem;
  854. }
  855. .fui-cell-group .fui-cell.btn-logout .fui-cell-text{
  856. color: #ffffff;
  857. }
  858. .fui-cell-group .fui-cell:before {
  859. content: " ";
  860. position: absolute;
  861. left: 0.5rem;
  862. right: 0.5rem;
  863. bottom: -1px;
  864. height: 1px;
  865. border-top: 1px solid #ebebeb;
  866. color: #D9D9D9;
  867. -webkit-transform-origin: 0 0;
  868. -ms-transform-origin: 0 0;
  869. transform-origin: 0 0;
  870. -webkit-transform: scaleY(0.5);
  871. -ms-transform: scaleY(0.5);
  872. transform: scaleY(0.5);
  873. }
  874. .fui-cell-group .fui-cell.must .fui-cell-label:after {
  875. content:"*";
  876. position:absolute;
  877. right:0.2rem;
  878. top:0.2rem;
  879. color:#f30;
  880. font-size:0.8rem
  881. }
  882. .fui-cell-group-o:after,
  883. .fui-cell-group .fui-cell:last-child:before {
  884. display: none;
  885. }
  886. /*.fui-cell-group-o:after,*/
  887. /*.fui-cell-group .fui-cell:first-child:before {*/
  888. /*display: block;*/
  889. /*}*/
  890. /*.fui-icon-group:before{*/
  891. /*content: " ";*/
  892. /*position: absolute;*/
  893. /*left: 0.5rem;*/
  894. /*right: 0.5rem;*/
  895. /*top:0;*/
  896. /*height: 1px;*/
  897. /*border-top: 1px solid #D9D9D9;*/
  898. /*color: #D9D9D9;*/
  899. /*-webkit-transform-origin: 0 0;*/
  900. /*-ms-transform-origin: 0 0;*/
  901. /*transform-origin: 0 0;*/
  902. /*-webkit-transform: scaleY(0.5);*/
  903. /*-ms-transform: scaleY(0.5);*/
  904. /*transform: scaleY(0.5);*/
  905. /*}*/
  906. .fui-cell-group.fui-cell-click .fui-cell:active,
  907. .fui-cell-group .fui-cell.fui-cell-click:active {
  908. background: #ececec;
  909. }
  910. .fui-cell-title {
  911. color: #333;
  912. font-size: 0.75rem;
  913. padding: 0.5rem 0.7rem;
  914. }
  915. .fui-cell-tip {
  916. color: #999;
  917. font-size: 0.6rem;
  918. padding: 0.3rem 0.7rem 0;
  919. }
  920. .fui-cell-group .fui-cell .fui-cell-info {
  921. -webkit-box-flex: 1;
  922. -webkit-flex: 1;
  923. -ms-flex: 1;
  924. flex: 1;
  925. white-space: nowrap;
  926. text-overflow: ellipsis;
  927. overflow: hidden;
  928. font-size:.7rem;color:#000;
  929. }
  930. .fui-cell-group .fui-cell .fui-cell-info.md{
  931. font-size:0.65rem;
  932. }
  933. .fui-cell-group .fui-cell .fui-cell-info.overflow { word-break: break-all; overflow: auto; white-space:normal; height:auto; }
  934. .fui-cell-group .fui-cell .fui-cell-info .checkbox-inline,
  935. .fui-cell-group .fui-cell .fui-cell-info .radio-inline{
  936. float:left; margin-bottom:.2rem;
  937. }
  938. .fui-cell-group .fui-cell .fui-cell-label {
  939. position: relative;
  940. display: block;
  941. width: 3.85rem;
  942. /* padding: 0 0.2rem; */
  943. font-size: 0.7rem;
  944. color: #666;
  945. }
  946. .param-block .fui-cell-group .fui-cell .fui-cell-label{
  947. color: #999;
  948. }
  949. .fui-cell-group .fui-cell .fui-cell-label.md{
  950. font-size: 0.65rem;
  951. }
  952. .fui-cell-group .fui-cell .fui-cell-label.big {
  953. display: block;
  954. width: 4.5rem;
  955. padding: 0 0.2rem;
  956. font-size: 0.8rem;
  957. }
  958. .fui-cell-group .fui-cell .fui-input {
  959. width: 100%;
  960. border: 0;
  961. outline: 0;
  962. -webkit-appearance: none;
  963. background-color: transparent;
  964. font-size: inherit;
  965. color: inherit;
  966. height: 1.41176471em;
  967. line-height: 1.41176471;
  968. }
  969. .fui-cell-group .fui-cell .fui-cell-info ::-webkit-input-placeholder{
  970. color: #b2b2b2
  971. }
  972. .fui-cell-group .fui-cell .fui-input::-webkit-outer-spin-button,
  973. .fui-cell-group .fui-cell .fui-input::-webkit-inner-spin-button {
  974. -webkit-appearance: none;
  975. margin: 0;
  976. }
  977. .fui-cell-group .fui-cell .fui-cell-info select {
  978. -webkit-appearance: none;
  979. border: 0;
  980. outline: 0;
  981. background-color: transparent;
  982. width: 100%;
  983. font-size: inherit;
  984. height: 1.2rem;
  985. position: relative;
  986. z-index: 1;
  987. padding-left: 15px;
  988. }
  989. .fui-cell-group .fui-cell .fui-cell-info select {
  990. padding: 0;
  991. }
  992. .fui-cell-group .fui-cell .fui-cell-icon {
  993. color: #333;
  994. margin-right: 0.3rem;
  995. width:0.8rem;
  996. text-align: center;
  997. line-height: 0.7rem;
  998. }
  999. .fui-cell-group .fui-cell .fui-cell-icon i{
  1000. font-size:16px;
  1001. color: #666;
  1002. /*vertical-align: middle;*/
  1003. }
  1004. .fui-cell-group .fui-cell .fui-cell-icon.pull-left {
  1005. font-size: 0.85rem;
  1006. }
  1007. .fui-cell-group .fui-cell .fui-cell-text {
  1008. -webkit-box-flex: 1;
  1009. -webkit-flex: 1;
  1010. -ms-flex: 1;
  1011. flex: 1;
  1012. color: #000;
  1013. font-size: 0.7rem;
  1014. line-height: 0.7rem;
  1015. }
  1016. .fui-cell-group .fui-cell .fui-cell-text .coupon-mini{
  1017. font-size: 0.6rem;
  1018. line-height: 0.7rem;
  1019. }
  1020. .fui-cell-group .fui-cell .fui-cell-remark {
  1021. color: #999;
  1022. text-align: right;
  1023. font-size: 0.65rem;
  1024. margin-right: .2rem;
  1025. line-height: 0.65rem;
  1026. }
  1027. .fui-cell-group .fui-cell .fui-cell-remark:after {
  1028. content: " ";
  1029. display: inline-block;
  1030. -webkit-transform: rotate(45deg);
  1031. -ms-transform: rotate(45deg);
  1032. transform: rotate(45deg);
  1033. height: 0.4rem;
  1034. width: 0.4rem;
  1035. border-width: 1px 1px 0 0;
  1036. border-color: #C8C8CD;
  1037. border-style: solid;
  1038. position: relative;
  1039. top: 0px;
  1040. margin-left: 0;
  1041. }
  1042. .fui-cell-group .fui-cell .fui-cell-remark.noremark:after { display:none;margin-left:0;}
  1043. .fui-cell-group .fui-cell.fui-cell-textarea .fui-cell-label {
  1044. margin-top: -1.5rem;
  1045. }
  1046. .fui-cell-group .fui-cell textarea {
  1047. width: 100%;
  1048. background: transparent;
  1049. border: none;
  1050. resize: none;
  1051. font-size:0.7rem;
  1052. font-family: "Helvetica Neue", Helvetica, sans-serif;
  1053. }
  1054. .fui-cell-group .fui-cell .textarea_counter {
  1055. font-size: 0.7rem;
  1056. color: #666;
  1057. text-align: right;
  1058. }
  1059. .fui-cell-group .fui-cell.warning {
  1060. color: #e64340;
  1061. }
  1062. .fui-switch {
  1063. -webkit-appearance: none;
  1064. -moz-appearance: none;
  1065. appearance: none;
  1066. position: relative;
  1067. width: 47px;
  1068. height: 27px;
  1069. border: 1px solid #DFDFDF;
  1070. outline: 0;
  1071. border-radius: 16px;
  1072. box-sizing: border-box;
  1073. -webkit-box-sizing: border-box;
  1074. -moz-box-sizing: border-box;
  1075. background: #DFDFDF;
  1076. }
  1077. .fui-switch:before {
  1078. content: " ";
  1079. position: absolute;
  1080. top: 0;
  1081. left: 0;
  1082. width: 45px;
  1083. height: 25px;
  1084. border-radius: 15px;
  1085. background-color: #FDFDFD;
  1086. -webkit-transition: -webkit-transform .3s;
  1087. transition: transform .3s;
  1088. }
  1089. .fui-switch:after {
  1090. content: " ";
  1091. position: absolute;
  1092. top: 0;
  1093. left: 0;
  1094. width: 25px;
  1095. height: 25px;
  1096. border-radius: 15px;
  1097. background-color: #FFFFFF;
  1098. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  1099. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  1100. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
  1101. -moz-transition: transform .3s;
  1102. -webkit-transition: -webkit-transform .3s;
  1103. transition: transform .3s;
  1104. }
  1105. .fui-switch.fui-switch-small {
  1106. width: 40px;
  1107. height: 22px;
  1108. }
  1109. .fui-switch.fui-switch-small:before {
  1110. width: 38px;
  1111. height: 20px;
  1112. border-radius: 15px;
  1113. }
  1114. .fui-switch.fui-switch-small:after {
  1115. width: 20px;
  1116. height: 20px;
  1117. border-radius: 15px;
  1118. }
  1119. .fui-switch.fui-switch-small:checked:before {
  1120. }
  1121. .fui-switch.fui-switch-small:checked:after {
  1122. -webkit-transform: translateX(18px);
  1123. -ms-transform: translateX(18px);
  1124. transform: translateX(18px);
  1125. }
  1126. .fui-switch.fui-switch-small:checked:before {
  1127. }
  1128. .fui-switch.fui-switch-small:checked:after {
  1129. -webkit-transform: translateX(18px);
  1130. -ms-transform: translateX(18px);
  1131. transform: translateX(18px);
  1132. }
  1133. .fui-switch.fui-switch-default:checked {
  1134. border-color: #ccc;
  1135. background-color: #ccc;
  1136. }
  1137. .fui-switch.fui-switch-success:checked {
  1138. border-color: #04BE02;
  1139. background-color: #04BE02;
  1140. }
  1141. .fui-switch.fui-switch-primary:checked {
  1142. border-color: #0290be;
  1143. background-color: #0290be;
  1144. }
  1145. .fui-switch.fui-switch-warning:checked {
  1146. border-color: #ff8000;
  1147. background-color: #ff8000;
  1148. }
  1149. .fui-switch.fui-switch-danger:checked {
  1150. border-color: #ff5555;
  1151. background-color: #ff5555;
  1152. }
  1153. .fui-switch:checked:before {
  1154. -webkit-transform: scale(0);
  1155. -ms-transform: scale(0);
  1156. transform: scale(0);
  1157. }
  1158. .fui-switch:checked:after {
  1159. -webkit-transform: translateX(20px);
  1160. -ms-transform: translateX(20px);
  1161. transform: translateX(20px);
  1162. }
  1163. .fui-images {
  1164. list-style: none;
  1165. padding-top:.2rem;
  1166. }
  1167. .fui-images .image {
  1168. float: left;
  1169. margin-right: 0.3rem;
  1170. margin-bottom: 0.3rem;
  1171. width: 4rem;
  1172. height: 4rem;
  1173. background: no-repeat center center;
  1174. background-size: cover;
  1175. position: relative;
  1176. }
  1177. .fui-images .image.long {
  1178. width: 8rem;
  1179. }
  1180. .fui-images .image .image-remove {
  1181. position: absolute;
  1182. right: 0;
  1183. top: 0;
  1184. color: white;
  1185. background: rgba(0,0,0,0.5);/*firefox、chrome*/
  1186. background: #000\9;/*IE*/
  1187. filter: alpha(opacity=50);/*IE*/
  1188. width: .75rem;
  1189. height: .75rem;
  1190. text-align: center;
  1191. border-bottom-left-radius: 0.25rem;
  1192. z-index: 9999;
  1193. }
  1194. .fui-images .image .image-remove i {
  1195. font-size: .6rem;
  1196. }
  1197. .fui-images.fui-images-sm .image.image-sm {
  1198. width: 2rem;
  1199. height: 2rem;
  1200. }
  1201. .fui-images.fui-images-sm .image.image-sm.long {
  1202. width: 3rem;
  1203. }
  1204. .fui-uploader {
  1205. float: left;
  1206. position: relative;
  1207. margin-right: 0.3rem;
  1208. margin-bottom: 0.3rem;
  1209. width: 4rem;
  1210. height: 4rem;
  1211. background: #f5f5f5;
  1212. }
  1213. .fui-uploader.long {
  1214. width: 8rem;
  1215. }
  1216. .fui-uploader:before,
  1217. .fui-uploader:after {
  1218. content: " ";
  1219. position: absolute;
  1220. top: 50%;
  1221. left: 50%;
  1222. -webkit-transform: translate(-50%, -50%);
  1223. -ms-transform: translate(-50%, -50%);
  1224. transform: translate(-50%, -50%);
  1225. background-color: #D9D9D9;
  1226. }
  1227. .fui-uploader:before {
  1228. width: 2px;
  1229. height: 2rem;
  1230. }
  1231. .fui-uploader:after {
  1232. width: 2rem;
  1233. height: 2px;
  1234. }
  1235. .fui-uploader.fui-uploader-sm {
  1236. width: 2rem;
  1237. height: 2rem;
  1238. }
  1239. .fui-uploader.fui-uploader-sm:before {
  1240. height: 1rem;
  1241. }
  1242. .fui-uploader.fui-uploader-sm:after {
  1243. width: 1rem;
  1244. }
  1245. .fui-uploader:active {
  1246. border-color: #999999;
  1247. }
  1248. .fui-uploader:active:before,
  1249. .fui-uploader:active:after {
  1250. background-color: #999999;
  1251. }
  1252. .fui-uploader input {
  1253. position: absolute;
  1254. z-index: 1;
  1255. top: 0;
  1256. left: 0;
  1257. width: 100%;
  1258. height: 100%;
  1259. opacity: 0;
  1260. }
  1261. .fui-mask,
  1262. .fui-mask-m{
  1263. position: fixed;
  1264. background: rgba(0, 0, 0, 0.8) none repeat scroll 0 0;
  1265. width: 100%;
  1266. height: 100%;
  1267. left: 0;
  1268. opacity: 0;
  1269. top: 0;
  1270. z-index: 1000;
  1271. -moz-transition-duration: 400ms;
  1272. -webkit-transition-duration: 400ms;
  1273. transition-duration: 400ms;
  1274. }
  1275. .fui-mask-transparent .visible,
  1276. .fui-mask.visible,
  1277. .fui-mask-m.visible {
  1278. opacity: 1;
  1279. }
  1280. .fui-mask.fui-mask-transparent {
  1281. background: none;
  1282. opacity: 0;
  1283. }
  1284. .fui-preloader {
  1285. display: inline-block;
  1286. text-align: center;
  1287. width: 1rem;
  1288. height: 1rem;
  1289. -webkit-transform-origin: 50%;
  1290. transform-origin: 50%;
  1291. -webkit-animation: preloader-spin 1s steps(12, end) infinite;
  1292. animation: preloader-spin 1s steps(12, end) infinite;
  1293. }
  1294. .fui-preloader:after {
  1295. display: block;
  1296. content: "";
  1297. width: 100%;
  1298. height: 100%;
  1299. 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");
  1300. background-position: 50%;
  1301. background-size: 100%;
  1302. background-repeat: no-repeat;
  1303. }
  1304. .fui-preloader.fui-preloader-white:after {
  1305. 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");
  1306. }
  1307. @-webkit-keyframes preloader-spin {
  1308. 100% {
  1309. -webkit-transform: rotate(360deg);
  1310. }
  1311. }
  1312. @keyframes preloader-spin {
  1313. 100% {
  1314. -webkit-transform: rotate(360deg);
  1315. transform: rotate(360deg);
  1316. }
  1317. }
  1318. .fui-loader {
  1319. position: fixed;
  1320. left: 50%;
  1321. top: 50%;
  1322. padding: 0.4rem;
  1323. margin-left: -1.25rem;
  1324. margin-top: -1.25rem;
  1325. background: rgba(0, 0, 0, 0.7);
  1326. z-index: 11000;
  1327. border-radius: 0.25rem;
  1328. }
  1329. .fui-loader.fui-loader-tip {
  1330. width: 7rem;
  1331. height: 7rem;
  1332. margin-left: -3.5rem;
  1333. margin-top: -5rem;
  1334. text-align: center;
  1335. }
  1336. .fui-loader-tip .fui-preloader {
  1337. position: absolute;
  1338. left: 50%;
  1339. margin-left: -1rem;
  1340. margin-top: 1rem;
  1341. width: 2.2rem;
  1342. height: 2.2rem;
  1343. }
  1344. .fui-loader-tip .fui-loader-text {
  1345. color: #fafafa;
  1346. font-size: 0.7rem;
  1347. position: absolute;
  1348. text-align: center;
  1349. left: 0;
  1350. bottom: 1.5rem;
  1351. width: 100%;
  1352. }
  1353. .fui-loader-tip .fui-loader-icon {
  1354. color: #fff;
  1355. }
  1356. .fui-loader-tip .fui-loader-icon i {
  1357. font-size: 3rem;
  1358. margin-top: 0.5rem;
  1359. }
  1360. .fui-loader .fui-preloader {
  1361. display: block;
  1362. width: 1.8rem;
  1363. height: 1.8rem;
  1364. }
  1365. .fui-toast {
  1366. position: fixed;
  1367. left:0;
  1368. text-align: center;
  1369. width: 100%;
  1370. opacity: 0;
  1371. -webkit-transition-property: opacity;
  1372. transition-property: transform, opacity;
  1373. -webkit-transform: translate3d(0, 0, 0) scale(.9);
  1374. transform: translate3d(0, 0, 0) scale(.9);
  1375. -webkit-transition-property: -webkit-transform, opacity;
  1376. transition-property: transform, opacity;
  1377. z-index: 10001;
  1378. }
  1379. .fui-toast.in {
  1380. opacity: 1;
  1381. -moz-transition-duration: 300ms;
  1382. -webkit-transition-duration: 300ms;
  1383. transition-duration: 300ms;
  1384. -webkit-transform: translate3d(0, 0, 0) scale(1);
  1385. transform: translate3d(0, 0, 0) scale(1);
  1386. }
  1387. .fui-toast.out {
  1388. opacity: 0;
  1389. z-index: 10999;
  1390. -moz-transition-duration: 300ms;
  1391. -webkit-transition-duration: 300ms;
  1392. transition-duration: 300ms;
  1393. -webkit-transform: translate3d(0, 0, 0) scale(0.8);
  1394. transform: translate3d(0, 0, 0) scale(0.8);
  1395. }
  1396. .fui-toast .fui-toast-text {
  1397. display: inline-block;
  1398. color: #fff;
  1399. padding: 0.4rem 0.5rem;
  1400. border-radius: 0.2rem;
  1401. background: rgba(0, 0, 0, 0.75);
  1402. font-size: 0.75rem;
  1403. line-height: 1rem;
  1404. max-width: 60%;
  1405. }
  1406. .fui-notify {
  1407. width: 100%;
  1408. padding: 0.5rem;
  1409. overflow: hidden;
  1410. }
  1411. .fui-notify.fui-notify-default {
  1412. background: rgba(0, 0, 0, 0.7);
  1413. }
  1414. .fui-notify.fui-notify-success {
  1415. background: rgba(3, 151, 2, 0.9);
  1416. }
  1417. .fui-notify.fui-notify-warning {
  1418. background: rgba(230, 110, 0, 0.9);
  1419. }
  1420. .fui-notify.fui-notify-danger {
  1421. background: rgba(174, 56, 56, 0.9);
  1422. }
  1423. .fui-notify.fui-notify-primary {
  1424. background: rgba(2, 114, 151, 0.9);
  1425. }
  1426. .fui-notify .fui-notify-close {
  1427. position: absolute;
  1428. right: 0.3rem;
  1429. top: 0.3rem;
  1430. color: #fff;
  1431. }
  1432. .fui-notify .fui-notify-title,
  1433. .fui-notify .fui-notify-text {
  1434. color: #fff;
  1435. width: 100%;
  1436. float: left;
  1437. text-align: left;
  1438. font-size: 0.8rem;
  1439. font-weight: bold;
  1440. }
  1441. .fui-notify .fui-notify-text {
  1442. font-size: 0.65rem;
  1443. font-weight: normal;
  1444. }
  1445. .fui-modal.dialog-modal {
  1446. position: absolute;
  1447. z-index: 1001;
  1448. left: 50%;
  1449. margin-left: -6.75rem;
  1450. margin-top: 0;
  1451. top: 50%;
  1452. width: 13.5rem;
  1453. opacity: 0;
  1454. -webkit-transform: translate3d(0, 0, 0) scale(1.2);
  1455. transform: translate3d(0, 0, 0) scale(1.2);
  1456. -webkit-transition-property: -webkit-transform, opacity;
  1457. transition-property: transform, opacity;
  1458. height:auto;
  1459. }
  1460. .fui-modal.dialog-modal.in {
  1461. opacity: 1;
  1462. -moz-transition-duration: 300ms;
  1463. -webkit-transition-duration: 300ms;
  1464. transition-duration: 300ms;
  1465. -webkit-transform: translate3d(0, 0, 0) scale(1);
  1466. transform: translate3d(0, 0, 0) scale(1);
  1467. }
  1468. .fui-modal.dialog-modal.out {
  1469. opacity: 0;
  1470. z-index: 10999;
  1471. -moz-transition-duration: 300ms;
  1472. -webkit-transition-duration: 300ms;
  1473. transition-duration: 300ms;
  1474. -webkit-transform: translate3d(0, 0, 0) scale(0.8);
  1475. transform: translate3d(0, 0, 0) scale(0.8);
  1476. }
  1477. .fui-dialog {
  1478. background: #fff;
  1479. text-align: center;
  1480. border-radius: 0.35rem;
  1481. padding-top: 0.3rem;
  1482. overflow: hidden;
  1483. }
  1484. .fui-dialog .fui-dialog-title {
  1485. padding: .2rem .5rem;
  1486. font-weight: 400;
  1487. font-size: 0.8rem;
  1488. }
  1489. .fui-dialog .fui-dialog-text {
  1490. padding: .4rem .8rem;
  1491. font-size: 0.75rem;
  1492. color: #888;
  1493. }
  1494. .fui-dialog .fui-dialog-prompt {
  1495. width: 100%;
  1496. padding: .2rem .5rem;
  1497. }
  1498. .fui-dialog .fui-dialog-prompt input {
  1499. width: 100%;
  1500. height: 1.6rem;
  1501. padding: 0 0.5rem;
  1502. font-size: 0.7rem;
  1503. color: #333;
  1504. -webkit-appearance: none;
  1505. border: 1px solid #d9d9d9;
  1506. color: #333;
  1507. }
  1508. .fui-dialog .fui-dialog-btns {
  1509. position: relative;
  1510. line-height: 2rem;
  1511. margin-top: .3rem;
  1512. font-size: 0.8rem;
  1513. display: -webkit-box;
  1514. display: -webkit-flex;
  1515. display: -ms-flexbox;
  1516. display: flex;
  1517. }
  1518. .fui-dialog .fui-dialog-btns a {
  1519. display: block;
  1520. -webkit-box-flex: 1;
  1521. -webkit-flex: 1;
  1522. -ms-flex: 1;
  1523. flex: 1;
  1524. color: #666;
  1525. text-decoration: none;
  1526. }
  1527. .fui-dialog .fui-dialog-btns a:active {
  1528. background-color: #EEEEEE;
  1529. }
  1530. .fui-dialog .fui-dialog-btns:after {
  1531. content: " ";
  1532. position: absolute;
  1533. left: 0;
  1534. top: 0;
  1535. width: 100%;
  1536. height: 1px;
  1537. border-top: 1px solid #D5D5D6;
  1538. color: #D5D5D6;
  1539. -webkit-transform-origin: 0 0;
  1540. -ms-transform-origin: 0 0;
  1541. transform-origin: 0 0;
  1542. -webkit-transform: scaleY(0.5);
  1543. -ms-transform: scaleY(0.5);
  1544. transform: scaleY(0.5);
  1545. }
  1546. .fui-dialog-confirm .fui-dialog-text {
  1547. text-align: left;
  1548. }
  1549. .fui-dialog-confirm .fui-dialog-btns a {
  1550. position: relative;
  1551. }
  1552. .fui-dialog-confirm .fui-dialog-btns a:after {
  1553. content: " ";
  1554. position: absolute;
  1555. left: 0;
  1556. top: 0;
  1557. width: 1px;
  1558. height: 100%;
  1559. border-left: 1px solid #D5D5D6;
  1560. -webkit-transform-origin: 0 0;
  1561. -ms-transform-origin: 0 0;
  1562. transform-origin: 0 0;
  1563. -webkit-transform: scaleX(0.5);
  1564. -ms-transform: scaleX(0.5);
  1565. transform: scaleX(0.5);
  1566. }
  1567. .fui-dialog-confirm .fui-dialog-btns a:first-child:after {
  1568. display: none;
  1569. }
  1570. .fui-dialog-confirm .fui-dialog-btns a.cancel {
  1571. color: #666;
  1572. }
  1573. .fui-dialog-confirm .fui-dialog-btns a.confirm {
  1574. color: #000;
  1575. }
  1576. .fui-tab-o,
  1577. .fui-tab {
  1578. -webkit-align-self: center;
  1579. align-self: center;
  1580. display: -webkit-box;
  1581. display: -webkit-flex;
  1582. display: flex;
  1583. -webkit-box-lines: single;
  1584. -moz-box-lines: single;
  1585. -webkit-flex-wrap: nowrap;
  1586. flex-wrap: nowrap;
  1587. margin-bottom: .5rem;
  1588. }
  1589. .fui-tab-plus {
  1590. -webkit-align-self: center;
  1591. align-self: center;
  1592. display: -webkit-box;
  1593. display: -webkit-flex;
  1594. display: flex;
  1595. -webkit-box-lines: single;
  1596. -moz-box-lines: single;
  1597. -webkit-flex-wrap: nowrap;
  1598. flex-wrap: nowrap;
  1599. }
  1600. .fui-tab a,
  1601. .fui-tab-o a {
  1602. text-align: center;
  1603. -moz-transition-duration: 300ms;
  1604. -webkit-transition-duration: 300ms;
  1605. transition-duration:300ms;
  1606. -webkit-transition-property: color;
  1607. transition-property:color;
  1608. }
  1609. .fui-tab-plus a {
  1610. text-align: center;
  1611. -moz-transition-duration: 300ms;
  1612. -webkit-transition-duration: 300ms;
  1613. transition-duration:300ms;
  1614. position: relative;
  1615. -webkit-transition-property: color;
  1616. transition-property:color;
  1617. }
  1618. .fui-tab-o a {
  1619. border-radius: 0 0 0 0;
  1620. margin-left: -1px;
  1621. width: 100%;
  1622. -webkit-box-flex: 1;
  1623. -ms-flex: 1;
  1624. color: #666;
  1625. font-size: 0.75rem;
  1626. padding: 0.25rem;
  1627. }
  1628. .fui-tab a.active {
  1629. -moz-transition-duration: 300ms;
  1630. -webkit-transition-duration: 300ms;
  1631. transition-duration:300ms;
  1632. -webkit-transition-property: border-color;
  1633. transition-property:border-color;
  1634. }
  1635. .fui-tab-o a:first-child {
  1636. border-radius: 0.25rem 0 0 0.25rem;
  1637. margin-left: 0;
  1638. border-left-width: 1px;
  1639. border-left-style: solid;
  1640. }
  1641. .fui-tab-o a:last-child {
  1642. border-radius: 0 0.25rem 0.25rem 0;
  1643. }
  1644. .fui-tab {
  1645. background: white;
  1646. position: relative;
  1647. }
  1648. .fui-tab-plus {
  1649. background: white;
  1650. position: relative;
  1651. }
  1652. .fui-tab:after {
  1653. content: '';
  1654. position: absolute;
  1655. left: 0;
  1656. bottom: 0;
  1657. right: auto;
  1658. top: auto;
  1659. height: 1px;
  1660. width: 100%;
  1661. background-color: #d0d0d0;
  1662. display: block;
  1663. z-index: 15;
  1664. -webkit-transform-origin: 50% 100%;
  1665. transform-origin: 50% 100%;
  1666. }
  1667. .fui-tab-plus a:after {
  1668. content: '';
  1669. position: absolute;
  1670. left: 0;
  1671. bottom: 0;
  1672. right: auto;
  1673. top: auto;
  1674. height: 1px;
  1675. width: 100%;
  1676. background-color: #d0d0d0;
  1677. display: block;
  1678. z-index: 15;
  1679. -webkit-transform-origin: 50% 100%;
  1680. transform-origin: 50% 100%;
  1681. }
  1682. .fui-tab-plus a:before {
  1683. content: '';
  1684. position: absolute;
  1685. left: -1px;
  1686. bottom: 0;
  1687. right: auto;
  1688. top: auto;
  1689. height: 100%;
  1690. width: 1px;
  1691. background-color: #d0d0d0;
  1692. display: block;
  1693. z-index: 15;
  1694. -webkit-transform-origin: 50% 100%;
  1695. transform-origin: 50% 100%;
  1696. }
  1697. .fui-tab-plus a.active:after {
  1698. content: '';
  1699. position: absolute;
  1700. left: 0;
  1701. bottom: 0;
  1702. right: auto;
  1703. top: auto;
  1704. height: 1px;
  1705. width: 100%;
  1706. background-color: #fff;
  1707. display: block;
  1708. z-index: 20;
  1709. -webkit-transform-origin: 50% 100%;
  1710. transform-origin: 50% 100%;
  1711. }
  1712. .fui-tab-plus a:first-child:before{background: #fff;}
  1713. @media only screen and (-webkit-min-device-pixel-ratio: 2) {
  1714. .fui-tab:after {
  1715. -webkit-transform: scaleY(0.5);
  1716. transform: scaleY(0.5);
  1717. }
  1718. .fui-tab-plus:after {
  1719. -webkit-transform: scaleY(0.5);
  1720. transform: scaleY(0.5);
  1721. }
  1722. }
  1723. @media only screen and (-webkit-min-device-pixel-ratio: 3) {
  1724. .fui-tab:after {
  1725. -webkit-transform: scaleY(0.33);
  1726. transform: scaleY(0.33);
  1727. }
  1728. .fui-tab-plus:after {
  1729. -webkit-transform: scaleY(0.33);
  1730. transform: scaleY(0.33);
  1731. }
  1732. }
  1733. .fui-tab a {
  1734. color: #666;
  1735. font-size: 0.7rem;
  1736. width: 100%;
  1737. height: 2rem;
  1738. line-height: 2rem;
  1739. -webkit-box-flex: 1;
  1740. -ms-flex: 1;
  1741. border: 0;
  1742. border-bottom: 2px solid transparent;
  1743. border-radius: 0;
  1744. }
  1745. .fui-tab-plus a {
  1746. color: #666;
  1747. font-size: 0.8rem;
  1748. width: 100%;
  1749. height: 2rem;
  1750. line-height: 2rem;
  1751. -webkit-box-flex: 1;
  1752. -ms-flex: 1;
  1753. border: 0;
  1754. border-top: 2px solid transparent;
  1755. border-radius: 0;
  1756. }
  1757. .fui-tab-plus.fui-tab-plus-default a.active {
  1758. color: #666;
  1759. border-color: #666;
  1760. z-index: 15;
  1761. }
  1762. .fui-tab-plus.fui-tab-plus-success a.active {
  1763. color: #04be02;
  1764. border-color: #04ab02;
  1765. z-index: 15;
  1766. }
  1767. .fui-tab-plus.fui-tab-plus-primary a.active {
  1768. color: #0290be;
  1769. border-color: #0290be;
  1770. z-index: 100;
  1771. }
  1772. .fui-tab-plus.fui-tab-plus-warning a.active {
  1773. color: #ff8000;
  1774. border-color: #ff8000;
  1775. z-index: 100;
  1776. }
  1777. .fui-tab-plus.fui-tab-plus-danger a.active {
  1778. color: #ef4f4f;
  1779. border-color: #ef4f4f;
  1780. z-index: 100;
  1781. }
  1782. .fui-tab.fui-tab-default a.active {
  1783. color: #666;
  1784. border-color: #666;
  1785. z-index: 100;
  1786. }
  1787. .fui-tab.fui-tab-success a.active {
  1788. color: #04be02;
  1789. border-color: #04ab02;
  1790. z-index: 100;
  1791. }
  1792. .fui-tab.fui-tab-primary a.active {
  1793. color: #0290be;
  1794. border-color: #0290be;
  1795. z-index: 100;
  1796. }
  1797. .fui-tab.fui-tab-warning a.active {
  1798. color: #ff8000;
  1799. border-color: #ff8000;
  1800. z-index: 100;
  1801. }
  1802. .fui-tab.fui-tab-danger a.active {
  1803. color: #ff5555;
  1804. border-color: #ff5555;
  1805. z-index: 100;
  1806. }
  1807. .fui-tab-o.fui-tab-default a {
  1808. color: #333
  1809. }
  1810. .fui-tab-o.fui-tab-default a,
  1811. .fui-tab-o.fui-tab-default a.active {
  1812. border: 1px solid #999;
  1813. }
  1814. .fui-tab-o.fui-tab-default a.active {
  1815. background: #999;
  1816. }
  1817. .fui-tab-o.fui-tab-success a {
  1818. color: #04ab02;
  1819. }
  1820. .fui-tab-o.fui-tab-success a,
  1821. .fui-tab-o.fui-tab-success a.active {
  1822. border: 1px solid #04ab02;
  1823. }
  1824. .fui-tab-o.fui-tab-success a.active {
  1825. background: #04ab02;
  1826. }
  1827. .fui-tab-o.fui-tab-primary a {
  1828. color: #0290be
  1829. }
  1830. .fui-tab-o.fui-tab-primary a,
  1831. .fui-tab-o.fui-tab-primary a.active {
  1832. border: 1px solid #0290be;
  1833. }
  1834. .fui-tab-o.fui-tab-primary a.active {
  1835. background: #0290be;
  1836. }
  1837. .fui-tab-o.fui-tab-warning a {
  1838. color: #ff8000;
  1839. }
  1840. .fui-tab-o.fui-tab-warning a,
  1841. .fui-tab-o.fui-tab-warning a.active {
  1842. border: 1px solid #ff8000;
  1843. }
  1844. .fui-tab-o.fui-tab-warning a.active {
  1845. background: #ff8000;
  1846. }
  1847. .fui-tab-o.fui-tab-danger a {
  1848. color: #ef4f4f;
  1849. }
  1850. .fui-tab-o.fui-tab-danger a,
  1851. .fui-tab-o.fui-tab-danger a.active {
  1852. border: 1px solid #ef4f4f;
  1853. }
  1854. .fui-tab-o.fui-tab-danger a.active {
  1855. background: #ef4f4f;
  1856. }
  1857. .fui-tab-o a.active {
  1858. color: white;
  1859. z-index: 90;
  1860. }
  1861. .fui-tab-o {
  1862. margin-left: 1rem;
  1863. margin-right: 1rem;
  1864. }
  1865. .fui-tab-content{
  1866. background: #fff;
  1867. }
  1868. .row {
  1869. overflow: hidden;
  1870. }
  1871. .row > [class*="col-"] {
  1872. box-sizing: border-box;
  1873. float: left;
  1874. }
  1875. .row .col-100 {
  1876. width: 96%;
  1877. margin-left: 4%;
  1878. }
  1879. .row .col-90 {
  1880. width: 86%;
  1881. margin-left: 4%;
  1882. }
  1883. .row .col-95 {
  1884. width: 91%;
  1885. margin-left: 4%;
  1886. }
  1887. .row .col-80 {
  1888. width: 76%;
  1889. margin-left: 4%;
  1890. }
  1891. .row .col-85 {
  1892. width: 81%;
  1893. margin-left: 4%;
  1894. }
  1895. .row .col-70 {
  1896. width: 66%;
  1897. margin-left: 4%;
  1898. }
  1899. .row .col-75 {
  1900. width: 71%;
  1901. margin-left: 4%;
  1902. }
  1903. .row .col-60 {
  1904. width: 56%;
  1905. margin-left: 4%;
  1906. }
  1907. .row .col-65 {
  1908. width: 61%;
  1909. margin-left: 4%;
  1910. }
  1911. .row .col-55 {
  1912. width: 51%;
  1913. margin-left: 4%;
  1914. }
  1915. .row .col-50 {
  1916. width: 46%;
  1917. margin-left: 4%;
  1918. }
  1919. .row .col-45 {
  1920. width: 41%;
  1921. margin-left: 4%;
  1922. }
  1923. .row .col-40 {
  1924. width: 36%;
  1925. margin-left: 4%;
  1926. }
  1927. .row .col-30 {
  1928. width: 26%;
  1929. margin-left: 4%;
  1930. }
  1931. .row .col-35 {
  1932. width: 31%;
  1933. margin-left: 4%;
  1934. }
  1935. .row .col-20 {
  1936. width: 16%;
  1937. margin-left: 4%;
  1938. }
  1939. .row .col-25 {
  1940. width: 21%;
  1941. margin-left: 4%;
  1942. }
  1943. .row .col-15 {
  1944. width: 11%;
  1945. margin-left: 4%;
  1946. }
  1947. .row .col-10 {
  1948. width: 6%;
  1949. margin-left: 4%;
  1950. }
  1951. .row .col-5 {
  1952. width: 1%;
  1953. margin-left: 4%;
  1954. }
  1955. .fui-searchbar {
  1956. position: relative;
  1957. z-index: 10;
  1958. height: 2.2rem;
  1959. padding-right: 0.5rem;
  1960. padding-left: 0.5rem;
  1961. background-color: #f7f7f8;
  1962. -webkit-backface-visibility: hidden;
  1963. backface-visibility: hidden;
  1964. }
  1965. .fui-searchbar:after {
  1966. content: '';
  1967. position: absolute;
  1968. left: 0;
  1969. bottom: 0;
  1970. right: auto;
  1971. top: auto;
  1972. height: 1px;
  1973. width: 100%;
  1974. background-color: #e7e7e7;
  1975. display: block;
  1976. z-index: 15;
  1977. -webkit-transform-origin: 50% 100%;
  1978. transform-origin: 50% 100%;
  1979. }
  1980. @media only screen and (-webkit-min-device-pixel-ratio: 2) {
  1981. .fui-searchbar:after {
  1982. -webkit-transform: scaleY(0.5);
  1983. transform: scaleY(0.5);
  1984. }
  1985. }
  1986. @media only screen and (-webkit-min-device-pixel-ratio: 3) {
  1987. .fui-searchbar:after {
  1988. -webkit-transform: scaleY(0.33);
  1989. transform: scaleY(0.33);
  1990. }
  1991. }
  1992. .fui-searchbar .searchbar {
  1993. margin: 0 -0.5rem;
  1994. padding: 0.4rem 0.6rem;
  1995. background: #e8e8e8;
  1996. }
  1997. .fui-searchbar .searchbar .search-input input {
  1998. border: 0;
  1999. }
  2000. .fui-searchbar .searchbar .searchbar-cancel {
  2001. color: #5f646e;
  2002. }
  2003. .searchbar {
  2004. padding: 0.5rem 0;
  2005. overflow: hidden;
  2006. height: 2.2rem;
  2007. -webkit-box-align: center;
  2008. -webkit-align-items: center;
  2009. align-items: center;
  2010. position: relative;
  2011. }
  2012. .searchbar .searchbar-cancel {
  2013. position: absolute;
  2014. top: 0.4rem;
  2015. right: -2rem;
  2016. width: 1.8rem;
  2017. float: right;
  2018. height: 1.4rem;
  2019. line-height: 1.4rem;
  2020. text-align: center;
  2021. -webkit-transition: all .3s;
  2022. transition: all .3s;
  2023. opacity: 0;
  2024. -webkit-transform: translate3d(0, 50, 0);
  2025. transform: translate3d(0, 50, 0);
  2026. font-size: 0.7rem;
  2027. }
  2028. .searchbar .search-input {
  2029. -webkit-transform: translate3d(0, 50, 0);
  2030. transform: translate3d(0, 50, 0);
  2031. -webkit-transition: all .3s;
  2032. transition: all .3s;
  2033. margin-right: 0;
  2034. position: relative;
  2035. }
  2036. .searchbar .search-input input {
  2037. margin: 0;
  2038. height: 1.4rem;
  2039. }
  2040. .searchbar.searchbar-active .searchbar-cancel {
  2041. right: 0.5rem;
  2042. opacity: 1;
  2043. }
  2044. .searchbar.searchbar-active .searchbar-cancel + .search-input {
  2045. margin-right: 2.2rem;
  2046. }
  2047. .search-input {
  2048. position: relative;
  2049. }
  2050. .search-input input {
  2051. box-sizing: border-box;
  2052. width: 100%;
  2053. height: 1.4rem;
  2054. display: block;
  2055. border: none;
  2056. -webkit-appearance: none;
  2057. -moz-appearance: none;
  2058. appearance: none;
  2059. border-radius: 0.25rem;
  2060. font-family: inherit;
  2061. color: #3d4145;
  2062. font-size: 0.7rem;
  2063. font-weight: normal;
  2064. padding: 0 0.5rem;
  2065. background-color: #fff;
  2066. border: 1px solid #b4b4b4;
  2067. }
  2068. .search-input input::-webkit-input-placeholder {
  2069. color: #cccccc;
  2070. opacity: 1;
  2071. }
  2072. .search-input i {
  2073. position: absolute;
  2074. font-size: 0.9rem;
  2075. color: #b4b4b4;
  2076. top: 0;
  2077. left: 0.3rem;
  2078. line-height: 1.4rem;
  2079. }
  2080. .search-input i + input {
  2081. padding-left: 1.4rem;
  2082. }
  2083. .fui-card {
  2084. background: #fff;
  2085. box-shadow: 0 0.1rem 0.1rem rgba(204, 204, 204, 0.3);
  2086. border: 1px solid #ccc;
  2087. margin: 0.5rem;
  2088. position: relative;
  2089. border-radius: 0.1rem;
  2090. font-size: 0.7rem;
  2091. padding-top: .5rem;
  2092. -moz-transition-duration: 300ms;
  2093. -webkit-transition-duration: 300ms;
  2094. transition-duration: 300ms;
  2095. -webkit-transition-property: background-color;
  2096. transition-property: background-color;
  2097. }
  2098. .fui-card.fui-card-full {
  2099. margin: 0;
  2100. border: none;
  2101. border-radius: none;
  2102. box-shadow: none;
  2103. }
  2104. .fui-card:not(.fui-card-list):active {
  2105. background: #e5e5e5;
  2106. }
  2107. .fui-card .fui-card-title {
  2108. padding: 0rem .5rem 0 .5rem;
  2109. }
  2110. .fui-card .fui-card-title span {
  2111. width: 100%;
  2112. display: block;
  2113. }
  2114. .fui-card .fui-card-title .title {
  2115. line-height: 1rem;
  2116. font-size: .85rem;
  2117. }
  2118. .fui-card .fui-card-title .subtitle {
  2119. color: #666;
  2120. padding: .3rem 0;
  2121. }
  2122. .fui-card .fui-card-image {
  2123. padding: .3rem .3rem 0 .3rem;
  2124. }
  2125. .fui-card .fui-card-image img {
  2126. width: 100%;
  2127. }
  2128. .fui-card .fui-card-content {
  2129. padding: 0 .5rem .5rem .5rem;
  2130. line-height: 1rem;
  2131. font-size: 0.7rem;
  2132. color: #445;
  2133. }
  2134. .fui-card .fui-card-footer {
  2135. border-top: 1px solid #f5f5f5;
  2136. padding: .6rem .5rem;
  2137. display: -webkit-box;
  2138. display: -webkit-flex;
  2139. display: -ms-flexbox;
  2140. display: flex;
  2141. }
  2142. .fui-card .fui-card-footer .text {
  2143. -webkit-box-flex: 1;
  2144. -webkit-flex: 1;
  2145. -ms-flex: 1;
  2146. flex: 1;
  2147. }
  2148. .fui-card .fui-card-footer .remark:after {
  2149. content: " ";
  2150. display: inline-block;
  2151. -webkit-transform: rotate(45deg);
  2152. -ms-transform: rotate(45deg);
  2153. transform: rotate(45deg);
  2154. height: 0.3rem;
  2155. width: 0.3rem;
  2156. border-width: 2px 2px 0 0;
  2157. border-color: #C8C8CD;
  2158. border-style: solid;
  2159. position: relative;
  2160. top: -1px;
  2161. margin-left: .3em;
  2162. }
  2163. .fui-card-header {
  2164. text-align: center;
  2165. margin: 0.8rem .5rem .8rem .5rem;
  2166. font-size: 0.7rem;
  2167. color: #666;
  2168. }
  2169. .fui-card-header span {
  2170. display: inline-block;
  2171. background: #cecece;
  2172. padding: .2rem .5rem;
  2173. border-radius: 0.2rem;
  2174. color: #fff;
  2175. }
  2176. .fui-card.fui-card-list {
  2177. padding: .05rem;
  2178. padding-bottom: 0;
  2179. }
  2180. .fui-card .fui-card-first {
  2181. padding: .5rem .2rem;
  2182. -moz-transition-duration: 300ms;
  2183. -webkit-transition-duration: 300ms;
  2184. transition-duration: 300ms;
  2185. -webkit-transition-property: background-color;
  2186. transition-property: background-color;
  2187. }
  2188. .fui-card .fui-card-first .image {
  2189. position: relative;
  2190. }
  2191. .fui-card .fui-card-first img {
  2192. width: 100%;
  2193. display: block;
  2194. }
  2195. .fui-card .fui-card-first .text {
  2196. position: absolute;
  2197. background: rgba(0, 0, 0, 0.8);
  2198. bottom: 0;
  2199. width: 100%;
  2200. padding: .4rem .3rem;
  2201. color: #fff;
  2202. font-size: 0.8rem;
  2203. }
  2204. .fui-card .fui-card-item {
  2205. border-top: 1px solid #f5f5f5;
  2206. padding: .2rem .5rem .2rem .5rem;
  2207. display: -webkit-box;
  2208. display: -webkit-flex;
  2209. display: -ms-flexbox;
  2210. display: flex;
  2211. -moz-transition-duration: 300ms;
  2212. -webkit-transition-duration: 300ms;
  2213. transition-duration: 300ms;
  2214. -webkit-transition-property: background-color;
  2215. transition-property: background-color;
  2216. }
  2217. .fui-card .fui-card-item img {
  2218. width: 2rem;
  2219. height: 2rem;
  2220. display: table-cell
  2221. }
  2222. .fui-card .fui-card-item .text {
  2223. padding: 0 .5rem;
  2224. -webkit-box-flex: 1;
  2225. -webkit-flex: 1;
  2226. -ms-flex: 1;
  2227. flex: 1;
  2228. }
  2229. .fui-card .fui-card-item .text.left {
  2230. padding: 0;
  2231. }
  2232. .fui-card-first:active,
  2233. .fui-card-item:active {
  2234. background: #e5e5e5;
  2235. }
  2236. .fui-card .fui-card-info {
  2237. padding: 0 .5rem;
  2238. padding-top: .5rem;
  2239. display: -webkit-box;
  2240. display: -webkit-flex;
  2241. display: -ms-flexbox;
  2242. display: flex;
  2243. }
  2244. .fui-card .fui-card-info span {
  2245. display: block;
  2246. padding: 0 .5rem;
  2247. font-size: 0.7rem;
  2248. }
  2249. .fui-card .fui-card-info .subtitle {
  2250. padding-top: 0.2rem;
  2251. color: #666;
  2252. font-size: 0.65rem;
  2253. }
  2254. .fui-card .fui-card-info img {
  2255. width: 2rem;
  2256. height: 2rem;
  2257. }
  2258. .fui-card .fui-card-info .text {
  2259. -webkit-box-flex: 1;
  2260. -webkit-flex: 1;
  2261. -ms-flex: 1;
  2262. flex: 1;
  2263. }
  2264. .fui-card .fui-card-btns {
  2265. padding: .6rem .5rem;
  2266. border-top: 1px solid #f5f5f5;
  2267. }
  2268. .fui-card .fui-card-btns a {
  2269. display: table-cell;
  2270. width: 1%;
  2271. text-align: center;
  2272. text-decoration: none;
  2273. color: #666;
  2274. }
  2275. .fui-card .fui-card-btns a:first-child {
  2276. text-align: left;
  2277. }
  2278. .fui-card .fui-card-btns a:last-child {
  2279. text-align: right;
  2280. }
  2281. .fui-card .fui-card-btns a:active {
  2282. color: #999;
  2283. }
  2284. /** List **/
  2285. .fui-list-group {
  2286. background-color: #fff;
  2287. position: relative;
  2288. margin-top:.5rem;
  2289. position: relative;
  2290. }
  2291. .fui-list-group.fui-list-group-o {
  2292. margin: 0 .5rem;
  2293. border-radius: .5rem;
  2294. margin-top: 0.5rem;
  2295. }
  2296. .fui-list-group-title {
  2297. padding:0 .6rem;
  2298. font-size:.7rem;
  2299. color:#333;
  2300. height:1.8rem;
  2301. line-height:1.8rem;
  2302. }
  2303. /*.fui-list-group:not(.fui-list-group-o):before {*/
  2304. /*content: " ";*/
  2305. /*position: absolute;*/
  2306. /*left: 0;*/
  2307. /*top: 0;*/
  2308. /*width: 100%;*/
  2309. /*height: 1px;*/
  2310. /*border-top: 1px solid #d9d9d9;*/
  2311. /*color: #D9D9D9;*/
  2312. /*-webkit-transform-origin: 0 0;*/
  2313. /*-ms-transform-origin: 0 0;*/
  2314. /*transform-origin: 0 0;*/
  2315. /*-webkit-transform: scaleY(0.5);*/
  2316. /*-ms-transform: scaleY(0.5);*/
  2317. /*transform: scaleY(0.5);*/
  2318. /*}*/
  2319. /*.fui-list-group:not(.fui-list-group-o):after {*/
  2320. /*content: " ";*/
  2321. /*position: absolute;*/
  2322. /*left: 0;*/
  2323. /*bottom: 0;*/
  2324. /*width: 100%;*/
  2325. /*height: 1px;*/
  2326. /*border-top: 1px solid #ebebeb;*/
  2327. /*color: #ebebeb;*/
  2328. /*-webkit-transform-origin: 0 100%;*/
  2329. /*-ms-transform-origin: 0 100%;*/
  2330. /*transform-origin: 0 100%;*/
  2331. /*-webkit-transform: scaleY(0.5);*/
  2332. /*-ms-transform: scaleY(0.5);*/
  2333. /*transform: scaleY(0.5);*/
  2334. /*}*/
  2335. .fui-list {
  2336. position: relative;
  2337. display: -webkit-box;
  2338. display: -webkit-flex;
  2339. display: -ms-flexbox;
  2340. display: flex;
  2341. padding: .4rem .6rem;
  2342. -moz-transition-duration: 300ms;
  2343. -webkit-transition-duration: 300ms;
  2344. transition-duration: 300ms;
  2345. -webkit-box-align: center;
  2346. -webkit-align-items: center;
  2347. -ms-flex-align: center;
  2348. align-items: center;
  2349. overflow: hidden;
  2350. }
  2351. .fui-list.align-start {
  2352. -webkit-box-align: start;
  2353. -webkit-align-items: start;
  2354. -ms-flex-align: start;
  2355. align-items: start
  2356. }
  2357. .fui-list:before {
  2358. content: " ";
  2359. position: absolute;
  2360. left: 0;
  2361. top: 0;
  2362. right: .5rem;
  2363. height: 1px;
  2364. border-top: 1px solid #ebebeb;
  2365. color: #ebebeb;
  2366. -webkit-transform-origin: 0 0;
  2367. -ms-transform-origin: 0 0;
  2368. transform-origin: 0 0;
  2369. -webkit-transform: scaleY(0.5);
  2370. -ms-transform: scaleY(0.5);
  2371. transform: scaleY(0.5);
  2372. left: .5rem;
  2373. }
  2374. .fui-list:first-child:before {
  2375. display: none;
  2376. }
  2377. .fui-list:active {
  2378. background: #ececec;
  2379. }
  2380. .fui-list.noclick:active {
  2381. background: #fff;
  2382. }
  2383. .fui-list a {
  2384. color:#666;
  2385. }
  2386. .fui-list-media {
  2387. display: -webkit-box;
  2388. display: -webkit-flex;
  2389. display: flex;
  2390. -webkit-flex-shrink: 0;
  2391. -ms-flex: 0 0 auto;
  2392. -webkit-flex-shrink: 0;
  2393. flex-shrink: 0;
  2394. -webkit-box-lines: single;
  2395. -moz-box-lines: single;
  2396. -webkit-flex-wrap: nowrap;
  2397. flex-wrap: nowrap;
  2398. box-sizing: border-box;
  2399. -webkit-box-align: center;
  2400. -webkit-align-items: center;
  2401. align-items: center;
  2402. margin-right:.6rem;
  2403. color:#aaa;
  2404. position: relative;
  2405. }
  2406. .fui-list-media .title {
  2407. background: rgba(0,0,0,0.8);
  2408. color: white;
  2409. font-size: 0.7rem;
  2410. height: 1rem;
  2411. right: 0;
  2412. left: 0;
  2413. line-height: 1rem;
  2414. font-size: 0.6rem;
  2415. padding: 0 0.15rem;
  2416. position: absolute;
  2417. bottom: 0;
  2418. text-align: center;
  2419. vertical-align: top;
  2420. z-index: 100;
  2421. }
  2422. .fui-list-media img {
  2423. width:2.5rem;
  2424. height:2.5rem;
  2425. }
  2426. /*.fui-list-media img.round {*/
  2427. /*border-radius: 50%;*/
  2428. /*}*/
  2429. .fui-list-media .badge {
  2430. background: red none repeat scroll 0 0;
  2431. border-radius: 0.5rem;
  2432. color: white;
  2433. font-size: 0.7rem;
  2434. height: 0.9rem;
  2435. right: -.35rem;
  2436. line-height: 0.9rem;
  2437. min-width: 0.9rem;
  2438. padding: 0 0.15rem;
  2439. position: absolute;
  2440. top: -.3rem;
  2441. text-align: center;
  2442. vertical-align: top;
  2443. z-index: 100;
  2444. }
  2445. .fui-list-inner {
  2446. position: relative;
  2447. width: 100%;
  2448. overflow: hidden;
  2449. box-sizing: border-box;
  2450. display: -webkit-box;
  2451. display: -webkit-flex;
  2452. display: flex;
  2453. -webkit-box-flex: 1;
  2454. -webkit-flex: 1;
  2455. -ms-flex: 1;
  2456. flex: 1;
  2457. display: block;
  2458. }
  2459. .fui-list-inner .subtitle {
  2460. position: relative;
  2461. font-size: 0.65rem;
  2462. color: #666;
  2463. display: -webkit-box;
  2464. display: -webkit-flex;
  2465. display: -ms-flexbox;
  2466. display: flex;
  2467. -ms-flex-align: center;
  2468. -webkit-align-items: center;
  2469. align-items: center;
  2470. overflow : hidden;
  2471. text-overflow: ellipsis;
  2472. display: -webkit-box;
  2473. -webkit-line-clamp: 1;
  2474. -webkit-box-orient: vertical;
  2475. }
  2476. .fui-list-inner .text {
  2477. position: relative;
  2478. font-size: 0.65rem;
  2479. color: #666;
  2480. }
  2481. .fui-list-inner .bar {
  2482. position: relative;
  2483. font-size: 0.65rem;
  2484. color: #666;
  2485. margin-top:.3rem;
  2486. padding-top:0.2rem;
  2487. height:1.4rem;line-height:1.4rem;
  2488. }
  2489. .fui-list-inner .bar:before {
  2490. content: " ";
  2491. position: absolute;
  2492. left: 0;
  2493. top: 0;
  2494. width: 100%;
  2495. height: 1px;
  2496. border-top: 1px solid #ebebeb;
  2497. color: #ebebeb;
  2498. -webkit-transform-origin: 0 0;
  2499. -ms-transform-origin: 0 0;
  2500. transform-origin: 0 0;
  2501. -webkit-transform: scaleY(0.5);
  2502. -ms-transform: scaleY(0.5);
  2503. transform: scaleY(0.5);
  2504. }
  2505. .fui-list-inner .title {
  2506. position: relative;
  2507. font-size: 0.7rem;
  2508. color: #000;
  2509. white-space: nowrap;
  2510. text-overflow: ellipsis;
  2511. overflow: hidden;
  2512. height:1rem;
  2513. line-height:1rem;
  2514. }
  2515. .fui-list-inner .row {
  2516. position: relative;
  2517. display: -webkit-box;
  2518. display: -webkit-flex;
  2519. display: -ms-flexbox;
  2520. display: flex;
  2521. margin: 0;
  2522. height:1rem;
  2523. line-height:1rem;
  2524. }
  2525. .fui-list-inner .row .row-text {
  2526. font-size: 0.85rem;
  2527. color: #333;
  2528. white-space: nowrap;
  2529. text-overflow: ellipsis;
  2530. overflow: hidden;
  2531. -webkit-box-flex: 1;
  2532. -webkit-flex: 1;
  2533. -ms-flex: 1;
  2534. flex: 1;
  2535. }
  2536. .fui-list-inner .row .row-remark {
  2537. font-size: 0.75rem;
  2538. color: #666;
  2539. text-align: right;
  2540. }
  2541. .fui-list .angle:after {
  2542. content: " ";
  2543. display: inline-block;
  2544. -webkit-transform: rotate(45deg);
  2545. -ms-transform: rotate(45deg);
  2546. transform: rotate(45deg);
  2547. height: 0.4rem;
  2548. width: 0.4rem;
  2549. border-width: 1px 1px 0 0;
  2550. border-color: #b2b2b2;
  2551. border-style: solid;
  2552. position: relative;
  2553. top: 0px;
  2554. margin-left: .1em;
  2555. }
  2556. .fui-list-angle {
  2557. position: relative;
  2558. vertical-align: middle;
  2559. margin-right: .6rem;
  2560. margin-left: .5rem;
  2561. }
  2562. .fui-list-angle .angle:after {
  2563. position: absolute;
  2564. top: 50%;
  2565. margin-top:-.3rem;
  2566. }
  2567. .fui-list-inner .subtitle.overflow,
  2568. .fui-list-inner .title.overflow {
  2569. word-break: break-all; overflow: auto; white-space:normal; height:auto;
  2570. }
  2571. .checkbox-inline,.radio-inline{
  2572. position: relative;
  2573. font-size:.7rem; color:#666;
  2574. padding-left:1.2rem;
  2575. vertical-align: middle;
  2576. }
  2577. .checkbox-inline input[type=checkbox] ,
  2578. .radio-inline input[type=radio] {
  2579. position:absolute;
  2580. margin-left:-1.2rem;
  2581. /*top:50%; margin-top:-.4rem;*/
  2582. }
  2583. .fui-radio,.fui-checkbox {
  2584. -webkit-appearance: none;
  2585. -moz-appearance: none;
  2586. appearance: none;
  2587. position: relative;
  2588. width: .95rem;
  2589. height: .95rem;
  2590. border: 1px solid #DFDFDF;
  2591. outline: 0;
  2592. border-radius: 16px;
  2593. box-sizing: border-box;
  2594. -webkit-box-sizing: border-box;
  2595. -moz-box-sizing: border-box;
  2596. border:1px solid #DFDFDF;
  2597. background:#fff;
  2598. vertical-align:middle;
  2599. -moz-transition-duration: 300ms;
  2600. -webkit-transition-duration: 300ms;
  2601. transition-duration: 300ms;
  2602. }
  2603. .fui-checkbox{
  2604. border-radius: 0;
  2605. width: .9rem;
  2606. height: .9rem;
  2607. }
  2608. .fui-checkbox:checked:before {
  2609. content: " ";
  2610. display: inline-block;
  2611. -webkit-transform: rotate(135deg);
  2612. -ms-transform: rotate(135deg);
  2613. transform: rotate(135deg);
  2614. height: 0.3rem;
  2615. width: 0.5rem;
  2616. border-width: 1px 1px 0 0;
  2617. border-color: #d9d9d9;
  2618. border-style: solid;
  2619. position: relative;
  2620. top: -.1rem;
  2621. margin-left:.15rem;
  2622. }
  2623. .fui-radio:checked:before {
  2624. content: " ";
  2625. display: inline-block;
  2626. -webkit-transform: rotate(135deg);
  2627. -ms-transform: rotate(135deg);
  2628. transform: rotate(135deg);
  2629. height: 0.25rem;
  2630. width: 0.45rem;
  2631. border-width: 1px 1px 0 0;
  2632. border-color: #d9d9d9;
  2633. border-style: solid;
  2634. position: relative;
  2635. top: -.05rem;
  2636. margin-left:.2rem;
  2637. }
  2638. .fui-checkbox.fui-checkbox:checked {
  2639. border:1px solid #d9d9d9;
  2640. }
  2641. .fui-checkbox.fui-checkbox-default:checked,
  2642. .fui-radio.fui-radio-default:checked {
  2643. border-color: #d9d9d9;
  2644. background-color: #fff;
  2645. }
  2646. .fui-checkbox.fui-checkbox-success:checked,
  2647. .fui-radio.fui-radio-success:checked {
  2648. background-color: #04BE02;
  2649. border:1px solid #04BE02;
  2650. }
  2651. .fui-checkbox.fui-checkbox-primary:checked,
  2652. .fui-radio.fui-radio-primary:checked {
  2653. background-color: #0290be;
  2654. }
  2655. .fui-checkbox.fui-checkbox-warning:checked,
  2656. .fui-radio.fui-radio-warning:checked{
  2657. background-color: #ff8000;
  2658. }
  2659. .fui-checkbox.fui-checkbox-danger:checked,
  2660. .fui-radio.fui-radio-danger:checked {
  2661. background-color: #ff5555;
  2662. border:1px solid #ff5555;
  2663. }
  2664. .fui-checkbox.fui-checkbox-success:checked:before,
  2665. .fui-checkbox.fui-checkbox-primary:checked:before,
  2666. .fui-checkbox.fui-checkbox-warning:checked:before,
  2667. .fui-checkbox.fui-checkbox-danger:checked:before,
  2668. .fui-radio.fui-radio-success:checked:before,
  2669. .fui-radio.fui-radio-primary:checked:before,
  2670. .fui-radio.fui-radio-warning:checked:before,
  2671. .fui-radio.fui-radio-danger:checked:before
  2672. {
  2673. border-color:#fff;
  2674. }
  2675. .fui-message {
  2676. position:relative;
  2677. padding-top:2rem;
  2678. background:rgba(0,0,0,0);
  2679. width:100%;
  2680. }
  2681. .fui-message.fui-message-popup {
  2682. height:100%;
  2683. width:100%;
  2684. background:#fff;
  2685. }
  2686. .fui-message .icon {
  2687. margin:auto;
  2688. text-align: center;
  2689. }
  2690. .fui-message .icon i {
  2691. font-size:4rem;
  2692. color:#999;
  2693. }
  2694. .fui-message .title {
  2695. font-size:1.2rem;
  2696. text-align: center;
  2697. padding:.5rem;
  2698. font-weight: bold;
  2699. color:#555
  2700. }
  2701. .fui-message .content {
  2702. font-size:.85rem;
  2703. text-align: center;
  2704. margin:.5rem 1rem;
  2705. color:#666;
  2706. margin-bottom:1rem;
  2707. }
  2708. .fui-message .btn {
  2709. margin:.5rem 1rem;
  2710. }
  2711. .fui-message .button {
  2712. text-align: center;
  2713. }
  2714. /* 图标组 */
  2715. .fui-icon-group {
  2716. position:relative;
  2717. overflow:hidden;
  2718. /*border-top: 1px solid #ebebeb;*/
  2719. background: #fff;
  2720. }
  2721. .fui-icon-group:brfore{
  2722. }
  2723. .fui-icon-group .fui-icon-col {
  2724. width: 25%;
  2725. height: auto;
  2726. position: relative;
  2727. padding: 0.5rem 0;
  2728. text-align: center;
  2729. transition:background-color 300ms;
  2730. -webkit-transition: background-color 300ms;
  2731. float:left;
  2732. border:none !important;
  2733. }
  2734. .fui-icon-group .fui-icon-col:active {background: #ececec;}
  2735. /*.fui-icon-group .fui-icon-col:before {content: " "; position: absolute; right: -1px; top: 0.4rem; width: 1px; bottom: 0.4rem; border-left: 1px solid #ebebeb;}*/
  2736. .fui-icon-group .fui-icon-col:last-child:before { display:none }
  2737. .fui-icon-group .fui-icon-col .icon {height:2.2rem;margin: auto; text-align: center; line-height:2.2rem;}
  2738. .member-page .fui-icon-group .fui-icon-col .icon{
  2739. height:1.8rem;
  2740. line-height: 2.1rem;
  2741. }
  2742. .fui-icon-group.col-3 .fui-icon-col {
  2743. width:33.3%;
  2744. }
  2745. .fui-icon-group.col-5 .fui-icon-col {
  2746. width:20%;
  2747. }
  2748. .fui-icon-group .fui-icon-col .icon img {
  2749. height:2.2rem;width:2.2rem;
  2750. }
  2751. .fui-icon-group.radius .fui-icon-col img{
  2752. border-radius: .5rem;
  2753. }
  2754. .fui-icon-group.circle .fui-icon-col img{
  2755. border-radius: 2.2rem;
  2756. }
  2757. .fui-icon-group.col-3 .fui-icon-col.radius img {
  2758. border-radius: 33.3%;
  2759. }
  2760. .fui-icon-group.col-5 .fui-icon-col.radius img {
  2761. border-radius:20%;
  2762. }
  2763. .fui-icon-group .fui-icon-col .text {
  2764. font-size: 0.6rem;
  2765. text-align: center;
  2766. overflow: hidden;
  2767. text-overflow: ellipsis;
  2768. white-space: nowrap;
  2769. padding:0.2rem;
  2770. color:#000;
  2771. }
  2772. .fui-icon-group.noborder {border-top: 0;}
  2773. .fui-icon-group.noborder .fui-icon-col:before {border: 0;}
  2774. .fui-icon-group .fui-icon-col .icon i { color:#aaa; font-size:1.2rem; margin-top:.35rem; }
  2775. .fui-icon-group .fui-icon-col .badge {
  2776. background: red none repeat scroll 0 0;
  2777. border-radius: 0.5rem;
  2778. color: white;
  2779. font-size: 0.6rem;
  2780. height: 0.8rem;
  2781. left: 50%;
  2782. line-height: 0.8rem;
  2783. margin-left: 0.35rem;
  2784. min-width: 0.8rem;
  2785. padding: 0 0.2rem;
  2786. position: absolute;
  2787. top: 0.5rem;
  2788. vertical-align: top;
  2789. text-align: center;
  2790. z-index: 100;
  2791. }
  2792. /* 方块组 */
  2793. .fui-block-group {background: #fff; border-bottom: 1px solid #ececec; position: relative; margin-top:.5rem}
  2794. .fui-block-group .fui-block-child {
  2795. height: auto;
  2796. float:left;
  2797. padding: 0.4rem 0 ;
  2798. background: #fff;
  2799. transition:background-color 300ms;
  2800. -webkit-transition: background-color 300ms;
  2801. position: relative;
  2802. }
  2803. .fui-block-group .fui-block-child:before {
  2804. content: "";
  2805. width: 0px;
  2806. border-right: 1px solid #ececec;
  2807. position: absolute;
  2808. right: 0;
  2809. top: 0;
  2810. bottom: 0;
  2811. }
  2812. .fui-block-group .fui-block-child:after {
  2813. content: "";
  2814. height: 0px;
  2815. border-bottom: 1px solid #ececec;
  2816. position: absolute;
  2817. right: 0;
  2818. left: 0;
  2819. bottom: 0;
  2820. }
  2821. .fui-block-group.col-2 .fui-block-child {
  2822. width:50%
  2823. }
  2824. .fui-block-group.col-3 .fui-block-child {
  2825. width:33.3%
  2826. }
  2827. .fui-block-group.col-4 .fui-block-child {
  2828. width:25%
  2829. }
  2830. .fui-block-group.col-5 .fui-block-child {
  2831. width:20%
  2832. }
  2833. .fui-block-group .fui-block-child:active {background: #ececec;}
  2834. .fui-block-group .fui-block-child .icon {height: 2.7rem; padding-top: 1rem; text-align: center; font-size: 1.4rem; line-height: 1.5rem;}
  2835. .fui-block-group .fui-block-child .icon i { font-size:1.8rem;}
  2836. .fui-block-group .fui-block-child .title {height: 1rem; font-size: 0.6rem; line-height: 1.5rem; text-align: center; color: #666;}
  2837. .fui-block-group .fui-block-child .title.bigsize {font-size: 0.7rem;}
  2838. .fui-block-group .fui-block-child .text {height: 1.2rem; font-size: 0.5rem; text-align: center; color: #666; line-height: 1rem;}
  2839. .fui-block-group .fui-block-child .text span {color: #feb312;}
  2840. .fui-block-group .fui-block-child .text.remark {color: #a9a9a9; font-size: 0.6rem; line-height: 1.2rem;}
  2841. .fui-block-group .fui-block-child .num {height: 0.9rem; text-align: center; font-size: 0.8rem; color: #fb6665; line-height: 1.4rem;}
  2842. .fui-block-group .fui-block-dots {height: 0.9rem; text-align: center; line-height: 0.6rem;}
  2843. .fui-block-group .fui-block-dots a {height: 0.3rem; width: 0.3rem; background: #e6e6e6; border-radius: 0.4rem; display: inline-block;}
  2844. .fui-block-group .fui-block-dots a.on {background: #fa5453;}
  2845. /* 数量选择器 */
  2846. .fui-number {
  2847. backface-visibility: hidden;
  2848. box-sizing: border-box;
  2849. position: relative;
  2850. display: -webkit-box;
  2851. display: -ms-flexbox;
  2852. display: -webkit-flex;
  2853. display: flex;
  2854. font-size: 0.8rem;
  2855. -webkit-box-pack: justify;
  2856. -ms-flex-pack: justify;
  2857. -webkit-justify-content: space-between;
  2858. justify-content: space-between;
  2859. margin: 0;
  2860. height: 1.5rem;
  2861. width: 5rem;
  2862. }
  2863. .fui-number:before {
  2864. content: " ";
  2865. position: absolute;
  2866. z-index:2;
  2867. top: 0;
  2868. left: 0;
  2869. right: 0;
  2870. border-top: 1px solid #d9d9d9;
  2871. }
  2872. .fui-number:after {content: " "; position: absolute; z-index:2; bottom: 0; left: 0; right: 0; border-top: 1px solid #d9d9d9;}
  2873. .fui-number .num {
  2874. -webkit-box-flex: 1;
  2875. -webkit-flex: 1;
  2876. -ms-flex: 1;
  2877. flex: 1;
  2878. overflow: hidden;
  2879. line-height: inherit; color:#666; text-align: center; border: 0;
  2880. font-size: .7rem;
  2881. }
  2882. .fui-number .minus, .fui-number .plus {
  2883. height: inherit; width: 1.5rem; font-size: 1rem; font-weight: bold; color: #999;
  2884. position: relative; text-align: center; line-height: 1.5rem;
  2885. background: #fff; z-index:1;
  2886. }
  2887. .fui-number .minus:before, .fui-number .plus:before {
  2888. content: " "; position: absolute; top: 0; left: 0; bottom: 0; border-left: 1px solid #d9d9d9;}
  2889. .fui-number .minus:after, .fui-number .plus:after {
  2890. content: " "; position: absolute; top: 0; right: 0; bottom: 0; border-right: 1px solid #d9d9d9;}
  2891. .fui-number .minus.disabled , .fui-number .plus.disabled {
  2892. background:#fff;
  2893. color:#ebebeb;
  2894. }
  2895. .fui-number.small {
  2896. height: 1.1rem;
  2897. width: 3.6rem;
  2898. line-height: 1.2rem;
  2899. }
  2900. .fui-number.small .minus, .fui-number.small .plus {
  2901. width: 1.1rem;
  2902. line-height: 1.1rem;
  2903. /*display: flex;*/
  2904. /*align-items: center;*/
  2905. /*justify-content: center;*/
  2906. font-size: .65rem;
  2907. color: #666;
  2908. background: #fff;
  2909. }
  2910. /* 分割线 */
  2911. .fui-line {height: auto; display: block; position: relative; background: inherit;}
  2912. .fui-line:before {content: " "; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background: #d5d5d5;}
  2913. .fui-line .text {height: 100%; width: auto; margin: auto; background: inherit; font-size: 0.7rem; display: table; position: relative; padding: 0.4rem 0.3rem; }
  2914. .fui-line .text.big { font-size:0.8rem}
  2915. .fui-line .text.large { font-size:1rem}
  2916. /* 搜索框居中 */
  2917. .fui-searchbar .searchbar.center {background: none;}
  2918. .fui-searchbar .searchbar.center .search {text-align: center;}
  2919. .fui-searchbar.bar:after {height: 0;}
  2920. .fui-searchbar .searchbar.center .search::-webkit-input-placeholder {height: auto; width: 100px; color:#979797; text-align: center; position: relative;}
  2921. .fui-searchbar .searchbar.center .search::-webkit-input-placeholder:before {content: " "; height: 1rem; width: 1rem; top: 0; left: 50%; margin-left: -3rem; position: absolute;background-size: 0.8rem;}
  2922. .fui-article {
  2923. position: relative;
  2924. height:auto;
  2925. padding:1rem .5rem;background: #fff;
  2926. }
  2927. .fui-article .title {
  2928. width:100%;
  2929. font-size: 0.9rem;
  2930. word-break: break-all;
  2931. color:#333;
  2932. }
  2933. .fui-article .subtitle{
  2934. padding-top:0.2rem;
  2935. width:100%;
  2936. font-size: 0.7rem;
  2937. word-break: break-all;
  2938. color:#aaa;
  2939. }
  2940. .fui-article .content {
  2941. padding:0;
  2942. font-size:0.75rem;
  2943. line-height:1rem;
  2944. height:auto;
  2945. }
  2946. .fui-loading-text {
  2947. position:relative;
  2948. text-align:center;
  2949. background:inherit;
  2950. }
  2951. .fui-loading-text .fui-preloader {
  2952. margin-top:.5rem;
  2953. }
  2954. .fui-loading-text .text {
  2955. position: relative;
  2956. color:inherit;
  2957. font-size:0.75rem;
  2958. padding-bottom:.5rem;
  2959. }
  2960. /**modal **/
  2961. .fui-modal {
  2962. position:absolute;
  2963. width: 100%;
  2964. z-index: 1001;
  2965. }
  2966. .fui-modal.picker-modal {
  2967. left:0;
  2968. bottom: 0;
  2969. -webkit-transform: translate3d(0, 100%, 0);
  2970. transform: translate3d(0, 100%, 0);
  2971. -webkit-transition-property: -webkit-transform;
  2972. transition-property: transform;
  2973. }
  2974. .fui-modal.picker-modal.in {
  2975. -moz-transition-duration: 300ms;
  2976. -webkit-transition-duration: 300ms;
  2977. transition-duration: 300ms;
  2978. -webkit-transform: translate3d(0, 0, 0);
  2979. transform: translate3d(0, 0, 0);
  2980. }
  2981. .fui-modal.picker-modal.out{
  2982. -moz-transition-duration: 300ms;
  2983. -webkit-transition-duration: 300ms;
  2984. transition-duration: 300ms;
  2985. -webkit-transform: translate3d(0, 100%, 0);
  2986. transform: translate3d(0, 100%, 0);
  2987. }
  2988. .fui-modal.popup-modal {
  2989. left:0;
  2990. bottom: 0;
  2991. top:0;
  2992. -webkit-transform: translate3d(0, 100%, 0);
  2993. transform: translate3d(0, 100%, 0);
  2994. -webkit-transition-property: -webkit-transform;
  2995. transition-property: transform;
  2996. }
  2997. .fui-modal.popup-modal.in {
  2998. -moz-transition-duration: 300ms;
  2999. -webkit-transition-duration: 300ms;
  3000. transition-duration: 300ms;
  3001. -webkit-transform: translate3d(0, 0, 0);
  3002. transform: translate3d(0, 0, 0);
  3003. }
  3004. .fui-modal.popup-modal.out {
  3005. -moz-transition-duration: 300ms;
  3006. -webkit-transition-duration: 300ms;
  3007. transition-duration: 300ms;
  3008. -webkit-transform: translate3d(0, 100%, 0);
  3009. transform: translate3d(0, 100%, 0);
  3010. }
  3011. .fui-modal.notify-modal {
  3012. position: absolute;
  3013. top: 0;
  3014. text-align: center;
  3015. width: 100%;
  3016. height:auto;
  3017. -webkit-transform: translate3d(0, -100%, 0);
  3018. transform: translate3d(0, -100%, 0);
  3019. z-index: 1001;
  3020. }
  3021. .fui-modal.notify-modal.in {
  3022. -moz-transition-duration: 300ms;
  3023. -webkit-transition-duration: 300ms;
  3024. transition-duration: 300ms;
  3025. -webkit-transform: translate3d(0, 0, 0);
  3026. transform: translate3d(0, 0, 0);
  3027. }
  3028. .fui-modal.notify-modal.out {
  3029. -moz-transition-duration: 300ms;
  3030. -webkit-transition-duration: 300ms;
  3031. transition-duration: 300ms;
  3032. -webkit-transform: translate3d(0, -100%, 0);
  3033. transform: translate3d(0, -100%, 0);
  3034. }
  3035. /** ActionSheet */
  3036. .fui-actionsheet {
  3037. position: relative;
  3038. width: 100%;
  3039. }
  3040. .fui-actionsheet-title {
  3041. background:#ececec;
  3042. height:2.2rem;
  3043. line-height:2.2rem;
  3044. font-size:0.75rem;
  3045. text-align: center;
  3046. position: relative;
  3047. }
  3048. .fui-actionsheet a {
  3049. width: 100%;
  3050. display: inline-block;
  3051. text-align: center;
  3052. background: #fff;
  3053. padding: 0.5rem 0;
  3054. border-top: 1px solid #d9d9d9;
  3055. color: #666;
  3056. font-size: 0.8rem;
  3057. }
  3058. .fui-actionsheet a:first-child {
  3059. border: none;
  3060. }
  3061. .fui-actionsheet a.cancel {
  3062. border: none;
  3063. background: #ef4f4f;
  3064. color: #fff;
  3065. }
  3066. .fui-actionsheet a:not(.cancel):active {
  3067. background: #e5e5e5;
  3068. }
  3069. .fui-actionsheet.fui-actionsheet-o {
  3070. padding: .3rem;
  3071. }
  3072. .fui-actionsheet.fui-actionsheet-o a {
  3073. border-radius: 0.2rem;
  3074. margin-bottom: 0.2rem;
  3075. border: none;
  3076. }
  3077. /** According **/
  3078. .fui-according-group {
  3079. margin-top: 0.5rem;
  3080. background-color: #fff;
  3081. line-height: 1.4;
  3082. font-size: 0.8rem;
  3083. overflow: hidden;
  3084. position: relative;
  3085. }
  3086. .fui-according-group.fui-according-group-o {
  3087. margin: 0 .5rem;
  3088. border-radius: .5rem;
  3089. margin-top: 0.5rem;
  3090. }
  3091. /*.fui-according-group:not(.fui-according-group-o):before {*/
  3092. /*content: " ";*/
  3093. /*position: absolute;*/
  3094. /*left: 0;*/
  3095. /*top: 0;*/
  3096. /*width: 100%;*/
  3097. /*height: 1px;*/
  3098. /*border-top: 1px solid #D9D9D9;*/
  3099. /*color: #D9D9D9;*/
  3100. /*-webkit-transform-origin: 0 0;*/
  3101. /*-ms-transform-origin: 0 0;*/
  3102. /*transform-origin: 0 0;*/
  3103. /*-webkit-transform: scaleY(0.5);*/
  3104. /*-ms-transform: scaleY(0.5);*/
  3105. /*transform: scaleY(0.5);*/
  3106. /*}*/
  3107. /*.fui-according-group:after {*/
  3108. /*content: "";*/
  3109. /*position: absolute;*/
  3110. /*left: 0;*/
  3111. /*bottom: 0;*/
  3112. /*width: 100%;*/
  3113. /*height: 1px;*/
  3114. /*border-bottom: 1px solid #D9D9D9;*/
  3115. /*color: #D9D9D9;*/
  3116. /*-webkit-transform-origin: 0 100%;*/
  3117. /*-ms-transform-origin: 0 100%;*/
  3118. /*transform-origin: 0 100%;*/
  3119. /*-webkit-transform: scaleY(0.5);*/
  3120. /*-ms-transform: scaleY(0.5);*/
  3121. /*transform: scaleY(0.5);*/
  3122. /*}*/
  3123. .fui-according {
  3124. position: relative;
  3125. }
  3126. .fui-according:before {
  3127. content: " ";
  3128. position: absolute;
  3129. left: 0;
  3130. top: 0;
  3131. width: 100%;
  3132. height: 1px;
  3133. border-top: 1px solid #D9D9D9;
  3134. color: #D9D9D9;
  3135. -webkit-transform-origin: 0 0;
  3136. -ms-transform-origin: 0 0;
  3137. transform-origin: 0 0;
  3138. -webkit-transform: scaleY(0.5);
  3139. -ms-transform: scaleY(0.5);
  3140. transform: scaleY(0.5);
  3141. left: .5rem;
  3142. }
  3143. .fui-according:first-child:before {
  3144. display: none;
  3145. }
  3146. .fui-according-header {
  3147. position: relative;
  3148. display: -webkit-box;
  3149. display: -webkit-flex;
  3150. display: -ms-flexbox;
  3151. display: flex;
  3152. width: 100%;
  3153. padding: 0.6rem 0.6rem 0.5rem;
  3154. -moz-transition-duration: 300ms;
  3155. -webkit-transition-duration: 300ms;
  3156. transition-duration: 300ms;
  3157. -webkit-transition-property: background-color;
  3158. transition-property: background-color;
  3159. }
  3160. .fui-according-header:active {
  3161. background: #d9d9d9;
  3162. }
  3163. .fui-according-header .text {
  3164. -webkit-box-flex: 1;
  3165. -webkit-flex: 1;
  3166. -ms-flex: 1;
  3167. flex: 1;
  3168. color: #000;
  3169. font-size: 0.7rem;text-overflow: ellipsis;
  3170. white-space: nowrap;
  3171. overflow: hidden;
  3172. }
  3173. .fui-according-header .remark {
  3174. color: #888;
  3175. text-align: right;
  3176. font-size: 0.65rem;
  3177. margin-right: 0.2rem;
  3178. }
  3179. .fui-according-header .remark:after {
  3180. content: " ";
  3181. display: inline-block;
  3182. -webkit-transform: rotate(45deg);
  3183. -ms-transform: rotate(45deg);
  3184. transform: rotate(45deg);
  3185. height: 0.4rem;
  3186. width: 0.4rem;
  3187. border-width: 1px 1px 0 0;
  3188. border-color: #C8C8CD;
  3189. border-style: solid;
  3190. position: relative;
  3191. top: 0px;
  3192. margin-left: .3em;
  3193. }
  3194. .fui-according.expanded .remark:after,
  3195. .fui-according-header:active .remark:after {
  3196. content: " ";
  3197. display: inline-block;
  3198. -webkit-transform: rotate(135deg);
  3199. -ms-transform: rotate(135deg);
  3200. transform: rotate(135deg);
  3201. height: 0.4rem;
  3202. width: 0.4rem;
  3203. border-width: 1px 1px 0 0;
  3204. border-color: #C8C8CD;
  3205. border-style: solid;
  3206. position: relative;
  3207. top: -1px;
  3208. margin-left: .3em;
  3209. }
  3210. .fui-according-content .content-block {
  3211. padding: .5rem .5rem;
  3212. color: #666;
  3213. box-sizing: border-box;
  3214. }
  3215. .content-images { overflow-x:hidden;}
  3216. .content-images table,
  3217. .content-images div{
  3218. width:100%; display:block; max-width:100%;
  3219. }
  3220. .content-images img {
  3221. display: inline-block;
  3222. vertical-align: middle;
  3223. max-width:100%;
  3224. }
  3225. .fui-according-content {
  3226. position: relative;
  3227. width: 100%;
  3228. height: auto;
  3229. display: none;
  3230. overflow: hidden;
  3231. -moz-transition-duration: 200ms;
  3232. -webkit-transition-duration: 200ms;
  3233. transition-duration: 200ms;
  3234. -webkit-transform: translate3d(0, 0, 0);
  3235. transform: translate3d(0, 0, 0);
  3236. }
  3237. .fui-according.expanded .fui-according-content {
  3238. display: block;
  3239. height:auto;
  3240. margin-top: 0rem;
  3241. }
  3242. .fui-picker {
  3243. position: relative;
  3244. width: 100%;
  3245. background: #fff;
  3246. height: 13rem;
  3247. }
  3248. .fui-picker-header {
  3249. height: 2rem;
  3250. width: 100%;
  3251. box-sizing: border-box;
  3252. font-size: .8rem;
  3253. position: relative;
  3254. margin: 0;
  3255. z-index: 500;
  3256. -webkit-backface-visibility: hidden;
  3257. backface-visibility: hidden;
  3258. background:#fff;
  3259. display: -webkit-box;
  3260. display: -ms-flexbox;
  3261. display: -webkit-flex;
  3262. display: flex;
  3263. -webkit-box-align: center;
  3264. -ms-flex-align: center;
  3265. -webkit-align-items: center;
  3266. }
  3267. .fui-picker-header:before {
  3268. content: "";
  3269. position: absolute;
  3270. left: 0;
  3271. top: -1px;;
  3272. width: 100%;
  3273. height: 1px;
  3274. border-bottom: 1px solid #D9D9D9;
  3275. -webkit-transform-origin: 0 100%;
  3276. -ms-transform-origin: 0 100%;
  3277. transform-origin: 0 100%;
  3278. -webkit-transform: scaleY(0.5);
  3279. -ms-transform: scaleY(0.5);
  3280. transform: scaleY(0.5);
  3281. }
  3282. .fui-picker-header .center {
  3283. -webkit-box-flex: 1;
  3284. -webkit-flex: 1;
  3285. -ms-flex: 1;
  3286. flex: 1;
  3287. margin:0 .5rem;
  3288. white-space: nowrap;
  3289. text-overflow: ellipsis;
  3290. overflow: hidden;
  3291. line-height: 2rem;
  3292. color:#333;
  3293. text-align: center;
  3294. }
  3295. .fui-picker-header .left {
  3296. padding-left:.3rem;line-height: 2rem;
  3297. }
  3298. .fui-picker-header .right {
  3299. padding-right:.3rem;line-height: 2rem;
  3300. }
  3301. .fui-picker-header a {
  3302. font-size: 0.75rem;
  3303. padding: 0;
  3304. margin: 0;
  3305. top: 0;
  3306. display: block;
  3307. padding:0 .2rem;
  3308. }
  3309. .fui-picker-content{
  3310. height: 100%;
  3311. position: relative;
  3312. display: -webkit-box;
  3313. display: -webkit-flex;
  3314. display: flex;
  3315. -webkit-box-pack: center;
  3316. -webkit-justify-content: center;
  3317. justify-content: center;
  3318. padding: 0;
  3319. text-align: right;
  3320. font-size: 1rem;
  3321. -webkit-mask-box-image: -webkit-linear-gradient(bottom, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent);
  3322. -webkit-mask-box-image: linear-gradient(to top, transparent, transparent 5%, white 20%, white 80%, transparent 95%, transparent);
  3323. }
  3324. .fui-picker-col {
  3325. overflow: hidden;
  3326. position: relative;
  3327. max-height: 100%;
  3328. }
  3329. .fui-picker-col.fui-picker-col-left {
  3330. text-align: left;
  3331. }
  3332. .fui-picker-col.fui-picker-col-center {
  3333. text-align: center;
  3334. }
  3335. .fui-picker-col.fui-picker-col-right {
  3336. text-align: right;
  3337. }
  3338. .fui-picker-col.fui-picker-col-divider {
  3339. color: #3d4145;
  3340. display: -webkit-box;
  3341. display: -webkit-flex;
  3342. display: flex;
  3343. -webkit-box-align: center;
  3344. -webkit-align-items: center;
  3345. align-items: center;
  3346. }
  3347. .fui-picker-col-normal {
  3348. width: 100%;
  3349. }
  3350. .fui-picker-wrapper {
  3351. -webkit-transition: 300ms;
  3352. transition: 300ms;
  3353. -webkit-transition-timing-function: ease-out;
  3354. transition-timing-function: ease-out;
  3355. }
  3356. .fui-picker-item {
  3357. /*height: 1.5rem;*/
  3358. height: auto;
  3359. line-height: 1.5rem;
  3360. padding: 0 10px;
  3361. white-space: nowrap;
  3362. position: relative;
  3363. overflow: hidden;
  3364. text-overflow: ellipsis;
  3365. color: #aaa;
  3366. left: 0;
  3367. top: 0;
  3368. box-sizing: border-box;
  3369. -webkit-transition: 300ms;
  3370. transition: 300ms;
  3371. }
  3372. .fui-picker-item.selected {
  3373. color: #333;
  3374. -webkit-transform: translate3d(0, 0, 0);
  3375. transform: translate3d(0, 0, 0);
  3376. -webkit-transform: rotateX(0deg);
  3377. transform: rotateX(0deg);
  3378. }
  3379. .fui-picker-highlight {
  3380. height: 1.5rem;
  3381. box-sizing: border-box;
  3382. position: absolute;
  3383. left: 0;
  3384. width: 100%;
  3385. top: 50%;
  3386. margin-top: -.75rem;
  3387. pointer-events: none;
  3388. background: rgba(255,255,255,0.05);
  3389. }
  3390. .fui-picker-highlight:before {
  3391. content: '';
  3392. position: absolute;
  3393. left: 0;
  3394. top: 0;
  3395. bottom: auto;
  3396. right: auto;
  3397. height: 1px;
  3398. width: 100%;
  3399. background-color: #d9d9d9;
  3400. display: block;
  3401. z-index: 15;
  3402. -webkit-transform-origin: 50% 0%;
  3403. transform-origin: 50% 0%;
  3404. }
  3405. .fui-picker-highlight:after {
  3406. content: ' ';
  3407. position: absolute;
  3408. left: 0;
  3409. bottom: 0;
  3410. right: auto;
  3411. top: auto;
  3412. height: 1px;
  3413. width: 100%;
  3414. background-color: #d9d9d9;
  3415. display: block;
  3416. z-index: 15;
  3417. -webkit-transform-origin: 50% 100%;
  3418. transform-origin: 50% 100%;
  3419. }
  3420. @media only screen and (-webkit-min-device-pixel-ratio: 2) {
  3421. .fui-picker-highlight:before {
  3422. -webkit-transform: scaleY(0.5);
  3423. transform: scaleY(0.5);
  3424. }
  3425. }
  3426. @media only screen and (-webkit-min-device-pixel-ratio: 3) {
  3427. .fui-picker-highlight:before {
  3428. -webkit-transform: scaleY(0.33);
  3429. transform: scaleY(0.33);
  3430. }
  3431. }
  3432. .fui-picker .col-province {
  3433. width: 5rem;
  3434. }
  3435. .fui-picker .col-city {
  3436. width: 6rem;
  3437. }
  3438. .fui-picker .col-area {
  3439. width: 5rem;
  3440. }
  3441. .fui-swipe {
  3442. margin: 0 auto;
  3443. position: relative;
  3444. overflow: hidden;
  3445. z-index: 1;
  3446. }
  3447. .fui-swipe-wrapper {
  3448. box-sizing: content-box;
  3449. display: flex;
  3450. height: 100%;
  3451. position: relative;
  3452. transform-style: preserve-3d;
  3453. transition-property: transform;
  3454. width: 100%;
  3455. z-index: 1;
  3456. }
  3457. .fui-swipe-item {
  3458. -webkit-flex-shrink: 0;
  3459. -ms-flex: 0 0 auto;
  3460. -webkit-flex-shrink: 0;
  3461. flex-shrink: 0;
  3462. width: 100%;
  3463. height: 100%;
  3464. position: relative;
  3465. float: left;
  3466. }
  3467. .fui-swipe-item,
  3468. .fui-swipe-wrapper {
  3469. -webkit-transform: translate3d(0px, 0, 0);
  3470. transform: translate3d(0px, 0, 0);
  3471. display: -webkit-box;
  3472. display: -ms-flexbox;
  3473. display: -webkit-flex;
  3474. display: flex;
  3475. -webkit-box-pack: justify;
  3476. -ms-flex-pack: justify;
  3477. -webkit-justify-content: space-between;
  3478. justify-content: space-between;
  3479. -webkit-box-align: center;
  3480. -ms-flex-align: center;
  3481. -webkit-align-items: center;
  3482. }
  3483. .fui-swipe-wrapper .fui-swipe-item img {
  3484. width:100%;
  3485. display: block;
  3486. }
  3487. .fui-swipe-page {
  3488. position: absolute;
  3489. text-align: center;
  3490. -webkit-transition: 300ms;
  3491. transition: 300ms;
  3492. -webkit-transform: translate3d(0, 0, 0);
  3493. transform: translate3d(0, 0, 0);
  3494. z-index: 10;
  3495. bottom:10px;
  3496. width:100%;
  3497. }
  3498. .fui-swipe-bullet {
  3499. background: #fff none repeat scroll 0 0;
  3500. border-radius: 100%;
  3501. display: inline-block;
  3502. height: 8px;
  3503. opacity: 0.5;
  3504. width: 8px;
  3505. margin:0 1px;
  3506. }
  3507. .fui-swipe-bullet.active {
  3508. background: #ff5555 none repeat scroll 0 0;
  3509. opacity: 1;
  3510. }
  3511. .fui-swipe-button {
  3512. position: absolute;
  3513. top:50%;
  3514. z-index:10;
  3515. background:rgba(0,0,0,.2);
  3516. text-align: center;
  3517. width:2rem;
  3518. height:2rem;
  3519. border-radius: .2rem;
  3520. -webkit-transition: 300ms;
  3521. transition: 300ms;
  3522. margin-top:-1rem;
  3523. }
  3524. .fui-swipe-button:active{
  3525. background:rgba(0,0,0,.5);
  3526. }
  3527. .fui-swipe-button.left {
  3528. left:-10px;
  3529. }
  3530. .fui-swipe-button.right {
  3531. right:-10px;
  3532. }
  3533. .fui-swipe-button.left:after,
  3534. .fui-swipe-button.right:after {
  3535. content: " ";
  3536. display: inline-block;
  3537. -webkit-transform: rotate(45deg);
  3538. -ms-transform: rotate(45deg);
  3539. transform: rotate(45deg);
  3540. height: .6rem;
  3541. width: .6rem;
  3542. border-color: #fff;
  3543. border-style: solid;
  3544. position: relative;
  3545. top: .4rem;
  3546. opacity: 0.5;
  3547. }
  3548. .fui-swipe-button.left:after {
  3549. margin-left:.8rem;
  3550. border-width: 0 0 2px 2px;
  3551. }
  3552. .fui-swipe-button.right:after {
  3553. margin-right:.6rem;
  3554. border-width: 2px 2px 0 0;
  3555. }
  3556. .fui-swipe-button:active:after{
  3557. opacity: 0.8;
  3558. }
  3559. /* 评分 */
  3560. .fui-stars i {
  3561. color:#999; font-size:.8rem; margin-right:.1rem;
  3562. -moz-transition-duration: 300ms;
  3563. -webkit-transition-duration: 300ms;
  3564. transition-duration: 300ms;
  3565. -webkit-transition-property: color;
  3566. transition-property: color;
  3567. font-size: 1rem;
  3568. }
  3569. .fui-stars i.selected {
  3570. color:#f90
  3571. }
  3572. .fui-stars.success i.selected {color: #04ab02 }
  3573. .fui-stars.primary i.selected {color:#0290be }
  3574. .fui-stars.warning i.selected {color:#ff8000 }
  3575. .fui-stars.danger i.selected{ color:#ef4f4f }
  3576. .fui-labeltext {
  3577. position: relative;
  3578. border:1px solid #d9d9d9;
  3579. display: table-cell;
  3580. border-radius: .2rem;
  3581. height:1.5rem;
  3582. -webkit-box-flex: 1;
  3583. -webkit-flex: 1;
  3584. -ms-flex: 1;
  3585. flex: 1;
  3586. overflow: hidden;
  3587. }
  3588. .fui-labeltext.fui-labeltext-success {border:1px solid #04ab02 }
  3589. .fui-labeltext.fui-labeltext-primary{border:1px solid #0290be }
  3590. .fui-labeltext.fui-labeltext-warning {border:1px solid #ff8000 }
  3591. .fui-labeltext.fui-labeltext-danger { border:1px solid #ef4f4f }
  3592. .fui-labeltext .label {
  3593. background:#d9d9d9;
  3594. font-size:0.7rem;
  3595. float:left;
  3596. height:1.5rem;
  3597. line-height:1.5rem;
  3598. padding:0 0.3rem;
  3599. }
  3600. .fui-labeltext.fui-labeltext-success .label {background: #04ab02;color:#fff; }
  3601. .fui-labeltext.fui-labeltext-primary .label{background:#0290be;color:#fff; }
  3602. .fui-labeltext.fui-labeltext-warning .label {background:#ff8000;color:#fff; }
  3603. .fui-labeltext.fui-labeltext-danger .label { background:#ef4f4f;color:#fff; }
  3604. .fui-labeltext .text {
  3605. float:left;
  3606. height:1.5rem;
  3607. line-height:1.5rem;
  3608. padding:0 .2rem 0 0.7rem;
  3609. }
  3610. .pulldown-loading,.pullup-loading {
  3611. position:relative;
  3612. width:100%;
  3613. text-align: center;
  3614. color:#999;
  3615. height:2.2rem;
  3616. display: -webkit-box;
  3617. display: -webkit-flex;
  3618. display: -ms-flexbox;
  3619. display: flex;
  3620. -webkit-box-align: center;
  3621. -webkit-align-items: center;
  3622. -ms-flex-align: center;
  3623. align-items: center;
  3624. text-align: center;
  3625. -webkit-box-pack: center;
  3626. -webkit-justify-content: center;
  3627. justify-content: center;
  3628. }
  3629. .pulldown-loading .fui-preloader,
  3630. .pullup-loading .fui-preloader {
  3631. visibility: hidden;
  3632. }
  3633. .refreshing .pulldown-loading .fui-preloader {
  3634. visibility: visible;
  3635. }
  3636. .refreshing .pulldown-loading .arrow {
  3637. display:none;
  3638. }
  3639. .loading .pullup-loading .fui-preloader {
  3640. visibility: visible;
  3641. }
  3642. .loading .pullup-loading .arrow {
  3643. display:none;
  3644. }
  3645. .pulldown-loading .arrow,
  3646. .pullup-loading .arrow {
  3647. width: 0.65rem;
  3648. height: 1rem;
  3649. position: absolute;
  3650. top: 50%;
  3651. margin-left: -.85rem;
  3652. margin-top: -0.5rem;
  3653. background: no-repeat center;
  3654. 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");
  3655. background-size: 0.65rem 1rem;
  3656. z-index: 10;
  3657. -webkit-transform: rotate(0deg) translate3d(0, 0, 0) scale(0.7);
  3658. transform: rotate(0deg) translate3d(0, 0, 0) scale(0.7);
  3659. display:inline-block;
  3660. }
  3661. .pulldown-loading .text,
  3662. .pullup-loading .text {
  3663. display: inline-block;
  3664. font-size:0.75rem;
  3665. padding-left:.1rem;
  3666. height:2.2rem;
  3667. line-height:2.2rem;
  3668. }
  3669. .pullup-loading .arrow {
  3670. -webkit-transform: rotate(180deg) scale(0.7) ;
  3671. transform: rotate(180deg) scale(0.7);
  3672. }
  3673. .pulldown-loading .arrow.reverse,
  3674. .pullup-loading .arrow.reverse {
  3675. -moz-transition-duration: 300ms;
  3676. -webkit-transition-duration: 300ms;
  3677. transition-duration: 300ms;
  3678. }
  3679. .pulldown-loading .arrow.reverse{
  3680. -webkit-transform: rotate(-180deg) scale(0.7) ;
  3681. transform: rotate(-180deg) scale(0.7) ;
  3682. }
  3683. .pullup-loading .arrow.reverse {
  3684. -webkit-transform: rotate(0deg) scale(0.7) ;
  3685. transform: rotate(0deg) scale(0.7) ;
  3686. }
  3687. .infinite-loading {
  3688. position: relative;
  3689. text-align: center;
  3690. height:2.2rem;
  3691. line-height:2.2rem;
  3692. }
  3693. .infinite-loading .text {position: relative;display:inline-block;padding-left:1.1rem;}
  3694. .infinite-loading .fui-preloader { position: absolute;top:50%; margin-top:-.45rem; }
  3695. .fui-menu-group {
  3696. height: auto;
  3697. background: #fff;
  3698. margin-top: 0.5rem;
  3699. }
  3700. .fui-menu-group .fui-menu-item {
  3701. padding: 0.5rem;
  3702. text-align: center;
  3703. position: relative;
  3704. color: #666;
  3705. font-size: 0.75rem;
  3706. width: 1%;
  3707. display: table-cell;
  3708. -webkit-user-select: none;
  3709. -moz-user-select: none;
  3710. transition:background-color 300ms;
  3711. -webkit-transition: background-color 300ms;
  3712. }
  3713. .fui-menu-group .fui-menu-item:active {
  3714. background: #ececec;
  3715. }
  3716. .fui-menu-group .fui-menu-item:before {
  3717. content: '';
  3718. position: absolute;
  3719. left: 0;
  3720. top: 0.5rem;
  3721. bottom: 0.5rem;
  3722. border-left: 1px solid #eee;
  3723. }
  3724. .fui-menu-group .fui-menu-item:first-child:before {
  3725. border: 0;
  3726. }
  3727. .fui-menu-group .fui-menu-item i {
  3728. vertical-align: middle;
  3729. }
  3730. .fui-tag{display: inline-block;}
  3731. .fui-tag-danger{background: #ff8000;color:#fff;font-size:0.6rem;line-height:0.6rem;-webkit-border-radius: 0.2rem;border-radius: 0.2rem;font-style: normal;
  3732. padding: 0.2rem;}
  3733. /*-----------------------------------------------------------------------------*/
  3734. .bigprice {
  3735. font-size: .75rem;
  3736. }
  3737. ..c666{
  3738. color:#666;
  3739. }
  3740. .c999{
  3741. color:#999;
  3742. }
  3743. .c000{
  3744. color:#000;
  3745. }
  3746. .c333{
  3747. color:#333;
  3748. }
  3749. .fui-cell-group .fui-cell .fui-cell-label.c000{
  3750. color:#000;
  3751. }
  3752. .fui-cell-group .fui-cell .fui-cell-info.c000{
  3753. color:#000;
  3754. }
  3755. .fui-cell-group .fui-cell .fui-cell-text.c666{
  3756. color: #666
  3757. }
  3758. .fui-list-angle.c000{
  3759. color:#000;
  3760. }
  3761. .fui-list-media.c000{
  3762. color:#000;
  3763. }
  3764. .fui-list-angle.f26{
  3765. font-size: .65rem
  3766. }
  3767. .fui-list .fui-list-angle.c000 .angle:after {
  3768. border-color: #000;
  3769. }
  3770. .fui-list-inner .subtitle.c999{
  3771. color:#999;
  3772. }
  3773. .fui-list-inner .subtitle.f24{
  3774. font-size: .65rem
  3775. }
  3776. .fui-cell-group .fui-cell.fui-cell-textarea {
  3777. height: 3rem;
  3778. -webkit-box-align: start;
  3779. -webkit-align-items: flex-start;
  3780. -ms-flex-align: flex-start;
  3781. align-items: flex-start;
  3782. }
  3783. .flex-start{
  3784. align-self:flex-start;
  3785. -webkit-align-self:flex-start;
  3786. }
  3787. .fui-btn-confirm {
  3788. height: 2.25rem;
  3789. display: block;
  3790. text-align: center;
  3791. color: #fff;
  3792. line-height: 2.25rem;
  3793. background: #ff5555;
  3794. font-size: .75rem;
  3795. position: fixed;
  3796. bottom: 0;
  3797. left: 0;
  3798. right: 0
  3799. }
  3800. .disable{
  3801. background: #ccc;
  3802. border-color: #ccc;
  3803. color: #fff
  3804. }
  3805. .fui-cell-group .fui-cell .fui-cell-remark.noremark {
  3806. font-size: .65rem;
  3807. color: #000;
  3808. }
  3809. .fui-cell-group .fui-cell.no-border:before{
  3810. display: none;
  3811. }
  3812. .fui-list-group .fui-list.no-border:before{
  3813. display: none;
  3814. }
  3815. /*选项卡*/
  3816. .fui-topmenu{
  3817. }
  3818. .fui-tabbar{
  3819. background: white;
  3820. border-bottom: 1px solid #ededed;
  3821. }
  3822. .fui-tabbar.style1 {
  3823. white-space: nowrap;
  3824. overflow: auto;
  3825. }
  3826. .fui-tabbar.style2 {
  3827. -webkit-align-self: center;
  3828. align-self: center;
  3829. display: -webkit-box;
  3830. display: -webkit-flex;
  3831. display: flex;
  3832. -webkit-box-lines: single;
  3833. -moz-box-lines: single;
  3834. -webkit-flex-wrap: wrap;
  3835. flex-wrap: wrap;
  3836. margin-bottom: .5rem;
  3837. }
  3838. .fui-tabbar a{
  3839. display: inline-block;
  3840. color: #666;
  3841. font-size: 0.7rem;
  3842. width: 4.25rem;
  3843. height: 1.95rem;
  3844. line-height: 1.95rem;
  3845. border: 0;
  3846. border-bottom: 2px solid transparent;
  3847. border-radius: 0;
  3848. text-align: center;
  3849. -moz-transition-duration: 300ms;
  3850. -webkit-transition-duration: 300ms;
  3851. transition-duration:300ms;
  3852. -webkit-transition-property: color;
  3853. transition-property:color;
  3854. }
  3855. .fui-tabbar.style2 a{
  3856. border-radius: 0 0 0 0;
  3857. margin-left: -1px;
  3858. width: 25%;
  3859. color: #666;
  3860. }
  3861. .fui-tabbar.style1 a{
  3862. width: 4.25rem;
  3863. }
  3864. .fui-tabbar a.active {
  3865. -moz-transition-duration: 300ms;
  3866. -webkit-transition-duration: 300ms;
  3867. transition-duration:300ms;
  3868. -webkit-transition-property: border-color;
  3869. transition-property:border-color;
  3870. }
  3871. .getmore:active{
  3872. background: #ededed;
  3873. }