uin.css 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446
  1. @font-face {
  2. font-family: uniicons;
  3. font-weight: normal;
  4. font-style: normal;
  5. src: url('https://img-cdn-qiniu.dcloud.net.cn/fonts/uni.ttf') format('truetype');
  6. }
  7. /*通用 */
  8. view{
  9. font-size:28upx;
  10. }
  11. progress, checkbox-group{
  12. width: 100%;
  13. }
  14. form {
  15. width: 100%;
  16. }
  17. .uni-flex {
  18. display: flex;
  19. flex-direction: row;
  20. }
  21. .uni-flex-item {
  22. flex: 1;
  23. }
  24. .uni-row {
  25. flex-direction: row;
  26. }
  27. .uni-column {
  28. flex-direction: column;
  29. }
  30. .uni-link{
  31. color:#576B95;
  32. font-size:26upx;
  33. }
  34. .uni-center{
  35. text-align:center;
  36. }
  37. .uni-inline-item{
  38. display: flex;
  39. flex-direction: row;
  40. align-items:center;
  41. }
  42. .uni-inline-item text{
  43. margin-right: 20upx;
  44. }
  45. .uni-inline-item text:last-child{
  46. margin-right: 0upx;
  47. margin-left: 20upx;
  48. }
  49. /* page */
  50. .uni-page-head{
  51. padding:35upx;
  52. text-align: center;
  53. }
  54. .uni-page-head-title {
  55. display: inline-block;
  56. padding: 0 40upx;
  57. font-size: 30upx;
  58. height: 88upx;
  59. line-height: 88upx;
  60. color: #BEBEBE;
  61. box-sizing: border-box;
  62. border-bottom: 2upx solid #D8D8D8;
  63. }
  64. .uni-page-body {
  65. width: 100%;
  66. flex-grow: 1;
  67. overflow-x: hidden;
  68. }
  69. .uni-padding-wrap{
  70. width:690upx;
  71. padding:0 30upx;
  72. }
  73. .uni-word {
  74. text-align: center;
  75. padding:200upx 100upx;
  76. }
  77. .uni-title {
  78. font-size:30upx;
  79. font-weight:500;
  80. padding:20upx 0;
  81. line-height:1.5;
  82. }
  83. .uni-text{
  84. font-size:28upx;
  85. }
  86. .uni-title text{
  87. font-size:24upx;
  88. color:#888;
  89. }
  90. .uni-text-gray{
  91. color: #ccc;
  92. }
  93. .uni-text-small {
  94. font-size:24upx;
  95. }
  96. .uni-common-mb{
  97. margin-bottom:30upx;
  98. }
  99. .uni-common-pb{
  100. padding-bottom:30upx;
  101. }
  102. .uni-common-pl{
  103. padding-left:30upx;
  104. }
  105. .uni-common-mt{
  106. margin-top:30upx;
  107. }
  108. /* 背景色 */
  109. .uni-bg-red{
  110. background:#F76260; color:#FFF;
  111. }
  112. .uni-bg-green{
  113. background:#09BB07; color:#FFF;
  114. }
  115. .uni-bg-blue{
  116. background:#007AFF; color:#FFF;
  117. }
  118. /* 标题 */
  119. .uni-h1 {font-size: 80upx; font-weight:700;}
  120. .uni-h2 {font-size: 60upx; font-weight:700;}
  121. .uni-h3 {font-size: 48upx; font-weight:700;}
  122. .uni-h4 {font-size: 36upx; font-weight:700;}
  123. .uni-h5 {font-size: 28upx; color: #8f8f94;}
  124. .uni-h6 {font-size: 24upx; color: #8f8f94;}
  125. .uni-bold{font-weight:bold;}
  126. /* 文本溢出隐藏 */
  127. .uni-ellipsis {overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
  128. /* 竖向百分百按钮 */
  129. .uni-btn-v{
  130. padding:10upx 0;
  131. }
  132. .uni-btn-v button{margin:20upx 0;}
  133. /* 表单 */
  134. .uni-form-item{
  135. display:flex;
  136. width:100%;
  137. padding:10upx 0;
  138. }
  139. .uni-form-item .title{
  140. padding:10upx 25upx;
  141. }
  142. .uni-label {
  143. width: 210upx;
  144. word-wrap: break-word;
  145. word-break: break-all;
  146. text-indent:20upx;
  147. }
  148. .uni-input {
  149. height: 50upx;
  150. padding: 15upx 25upx;
  151. line-height:50upx;
  152. font-size:28upx;
  153. background:#FFF;
  154. flex: 1;
  155. }
  156. radio-group, checkbox-group{
  157. width:100%;
  158. }
  159. radio-group label, checkbox-group label{
  160. padding-right:20upx;
  161. }
  162. .uni-form-item .with-fun{
  163. display:flex;
  164. flex-wrap:nowrap;
  165. background:#FFFFFF;
  166. }
  167. .uni-form-item .with-fun .uni-icon{
  168. width:40px;
  169. height:80upx;
  170. line-height:80upx;
  171. flex-shrink:0;
  172. }
  173. /* loadmore */
  174. .uni-loadmore{
  175. height:80upx;
  176. line-height:80upx;
  177. text-align:center;
  178. padding-bottom:30upx;
  179. }
  180. /*数字角标*/
  181. .uni-badge,
  182. .uni-badge-default {
  183. font-family: 'Helvetica Neue', Helvetica, sans-serif;
  184. font-size: 12px;
  185. line-height: 1;
  186. display: inline-block;
  187. padding: 3px 6px;
  188. color: #333;
  189. border-radius: 100px;
  190. background-color: rgba(0, 0, 0, .15);
  191. }
  192. .uni-badge.uni-badge-inverted {
  193. padding: 0 5px 0 0;
  194. color: #929292;
  195. background-color: transparent
  196. }
  197. .uni-badge-primary {
  198. color: #fff;
  199. background-color: #007aff
  200. }
  201. .uni-badge-blue.uni-badge-inverted,
  202. .uni-badge-primary.uni-badge-inverted {
  203. color: #007aff;
  204. background-color: transparent
  205. }
  206. .uni-badge-green,
  207. .uni-badge-success {
  208. color: #fff;
  209. background-color: #4cd964;
  210. }
  211. .uni-badge-green.uni-badge-inverted,
  212. .uni-badge-success.uni-badge-inverted {
  213. color: #4cd964;
  214. background-color: transparent
  215. }
  216. .uni-badge-warning,
  217. .uni-badge-yellow {
  218. color: #fff;
  219. background-color: #f0ad4e
  220. }
  221. .uni-badge-warning.uni-badge-inverted,
  222. .uni-badge-yellow.uni-badge-inverted {
  223. color: #f0ad4e;
  224. background-color: transparent
  225. }
  226. .uni-badge-danger,
  227. .uni-badge-red {
  228. color: #fff;
  229. background-color: #dd524d
  230. }
  231. .uni-badge-danger.uni-badge-inverted,
  232. .uni-badge-red.uni-badge-inverted {
  233. color: #dd524d;
  234. background-color: transparent
  235. }
  236. .uni-badge-purple,
  237. .uni-badge-royal {
  238. color: #fff;
  239. background-color: #8a6de9
  240. }
  241. .uni-badge-purple.uni-badge-inverted,
  242. .uni-badge-royal.uni-badge-inverted {
  243. color: #8a6de9;
  244. background-color: transparent
  245. }
  246. /*折叠面板 */
  247. .uni-collapse-content {
  248. height: 0;
  249. width: 100%;
  250. overflow: hidden;
  251. }
  252. .uni-collapse-content.uni-active {
  253. height: auto;
  254. }
  255. /*卡片视图 */
  256. .uni-card {
  257. background: #fff;
  258. border-radius: 8upx;
  259. margin:20upx 0;
  260. position: relative;
  261. box-shadow: 0 2upx 4upx rgba(0, 0, 0, .3);
  262. }
  263. .uni-card-content {
  264. font-size: 30upx;
  265. }
  266. .uni-card-content.image-view{
  267. width: 100%;
  268. margin: 0;
  269. }
  270. .uni-card-content-inner {
  271. position: relative;
  272. padding: 30upx;
  273. }
  274. .uni-card-footer,
  275. .uni-card-header {
  276. position: relative;
  277. display: flex;
  278. min-height: 50upx;
  279. padding: 20upx 30upx;
  280. justify-content: space-between;
  281. align-items: center;
  282. }
  283. .uni-card-header {
  284. font-size: 36upx;
  285. }
  286. .uni-card-footer {
  287. color: #6d6d72;
  288. }
  289. .uni-card-footer:before,
  290. .uni-card-header:after {
  291. position: absolute;
  292. top: 0;
  293. right: 0;
  294. left: 0;
  295. height: 2upx;
  296. content: '';
  297. -webkit-transform: scaleY(.5);
  298. transform: scaleY(.5);
  299. background-color: #c8c7cc;
  300. }
  301. .uni-card-header:after {
  302. top: auto;
  303. bottom: 0;
  304. }
  305. .uni-card-media {
  306. justify-content: flex-start;
  307. }
  308. .uni-card-media-logo {
  309. height: 84upx;
  310. width: 84upx;
  311. margin-right: 20upx;
  312. }
  313. .uni-card-media-body {
  314. height: 84upx;
  315. display: flex;
  316. flex-direction: column;
  317. justify-content: space-between;
  318. align-items: flex-start;
  319. }
  320. .uni-card-media-text-top {
  321. line-height: 36upx;
  322. font-size: 34upx;
  323. }
  324. .uni-card-media-text-bottom {
  325. line-height: 30upx;
  326. font-size: 28upx;
  327. color: #8f8f94;
  328. }
  329. .uni-card-link {
  330. color: #007AFF;
  331. }
  332. /* 列表 */
  333. .uni-list {
  334. background-color: #FFFFFF;
  335. position: relative;
  336. width: 100%;
  337. display: flex;
  338. flex-direction: column;
  339. }
  340. .uni-list:after {
  341. position: absolute;
  342. z-index: 10;
  343. right: 0;
  344. bottom: 0;
  345. left: 0;
  346. height: 1px;
  347. content: '';
  348. -webkit-transform: scaleY(.5);
  349. transform: scaleY(.5);
  350. background-color: #c8c7cc;
  351. }
  352. .uni-list::before {
  353. position: absolute;
  354. z-index: 10;
  355. right: 0;
  356. top: 0;
  357. left: 0;
  358. height: 1px;
  359. content: '';
  360. -webkit-transform: scaleY(.5);
  361. transform: scaleY(.5);
  362. background-color: #c8c7cc;
  363. }
  364. .uni-list-cell {
  365. position: relative;
  366. display: flex;
  367. flex-direction: row;
  368. justify-content: space-between;
  369. align-items: center;
  370. }
  371. .uni-list-cell-hover {
  372. background-color: #eee;
  373. }
  374. .uni-list-cell-pd {
  375. padding: 22upx 30upx;
  376. }
  377. .uni-list-cell-left {
  378. font-size:28upx;
  379. padding: 0 30upx;
  380. }
  381. .uni-list-cell-db,
  382. .uni-list-cell-right {
  383. flex: 1;
  384. }
  385. .uni-list-cell::after {
  386. position: absolute;
  387. z-index: 3;
  388. right: 0;
  389. bottom: 0;
  390. left: 30upx;
  391. height: 1px;
  392. content: '';
  393. -webkit-transform: scaleY(.5);
  394. transform: scaleY(.5);
  395. background-color: #c8c7cc;
  396. }
  397. .uni-list .uni-list-cell:last-child::after {
  398. height: 0upx;
  399. }
  400. .uni-list-cell-last.uni-list-cell::after {
  401. height: 0upx;
  402. }
  403. .uni-list-cell-divider {
  404. position: relative;
  405. display: flex;
  406. color: #999;
  407. background-color: #f7f7f7;
  408. padding:15upx 20upx;
  409. }
  410. .uni-list-cell-divider::before {
  411. position: absolute;
  412. right: 0;
  413. top: 0;
  414. left: 0;
  415. height: 1px;
  416. content: '';
  417. -webkit-transform: scaleY(.5);
  418. transform: scaleY(.5);
  419. background-color: #c8c7cc;
  420. }
  421. .uni-list-cell-divider::after {
  422. position: absolute;
  423. right: 0;
  424. bottom: 0;
  425. left: 0upx;
  426. height: 1px;
  427. content: '';
  428. -webkit-transform: scaleY(.5);
  429. transform: scaleY(.5);
  430. background-color: #c8c7cc;
  431. }
  432. .uni-list-cell-navigate {
  433. font-size:30upx;
  434. padding: 22upx 30upx;
  435. line-height: 48upx;
  436. position: relative;
  437. display: flex;
  438. box-sizing: border-box;
  439. width: 100%;
  440. flex: 1;
  441. justify-content: space-between;
  442. align-items: center;
  443. }
  444. .uni-list-cell-navigate {
  445. padding-right: 36upx;
  446. }
  447. .uni-navigate-badge {
  448. padding-right: 50upx;
  449. }
  450. .uni-list-cell-navigate.uni-navigate-right:after {
  451. font-family: uniicons;
  452. content: '\e583';
  453. position: absolute;
  454. right: 24upx;
  455. top: 50%;
  456. color: #bbb;
  457. -webkit-transform: translateY(-50%);
  458. transform: translateY(-50%);
  459. }
  460. .uni-list-cell-navigate.uni-navigate-bottom:after {
  461. font-family: uniicons;
  462. content: '\e581';
  463. position: absolute;
  464. right: 24upx;
  465. top: 50%;
  466. color: #bbb;
  467. -webkit-transform: translateY(-50%);
  468. transform: translateY(-50%);
  469. }
  470. .uni-list-cell-navigate.uni-navigate-bottom.uni-active::after {
  471. font-family: uniicons;
  472. content: '\e580';
  473. position: absolute;
  474. right: 24upx;
  475. top: 50%;
  476. color: #bbb;
  477. -webkit-transform: translateY(-50%);
  478. transform: translateY(-50%);
  479. }
  480. .uni-collapse.uni-list-cell {
  481. flex-direction: column;
  482. }
  483. .uni-list-cell-navigate.uni-active {
  484. background: #eee;
  485. }
  486. .uni-list.uni-collapse {
  487. box-sizing: border-box;
  488. height: 0;
  489. overflow: hidden;
  490. }
  491. .uni-collapse .uni-list-cell {
  492. padding-left: 20upx;
  493. }
  494. .uni-collapse .uni-list-cell::after {
  495. left: 52upx;
  496. }
  497. .uni-list.uni-active {
  498. height: auto;
  499. }
  500. /* 三行列表 */
  501. .uni-triplex-row {
  502. display: flex;
  503. flex: 1;
  504. width: 100%;
  505. box-sizing: border-box;
  506. flex-direction: row;
  507. padding: 22upx 30upx;
  508. }
  509. .uni-triplex-right,
  510. .uni-triplex-left {
  511. display: flex;
  512. flex-direction: column;
  513. }
  514. .uni-triplex-left {
  515. width: 84%;
  516. }
  517. .uni-triplex-left .uni-title{
  518. padding:8upx 0;
  519. }
  520. .uni-triplex-left .uni-text, .uni-triplex-left .uni-text-small{color:#999999;}
  521. .uni-triplex-right {
  522. width: 16%;
  523. text-align: right;
  524. }
  525. /* 图文列表 */
  526. .uni-media-list {
  527. padding: 22upx 30upx;
  528. box-sizing: border-box;
  529. display: flex;
  530. width: 100%;
  531. flex-direction: row;
  532. }
  533. .uni-navigate-right.uni-media-list {
  534. padding-right: 74upx;
  535. }
  536. .uni-pull-right {
  537. flex-direction: row-reverse;
  538. }
  539. .uni-pull-right>.uni-media-list-logo {
  540. margin-right: 0upx;
  541. margin-left: 20upx;
  542. }
  543. .uni-media-list-logo {
  544. height: 84upx;
  545. width: 84upx;
  546. margin-right: 20upx;
  547. }
  548. .uni-media-list-logo image {
  549. height: 100%;
  550. width: 100%;
  551. }
  552. .uni-media-list-body {
  553. height: 84upx;
  554. display: flex;
  555. flex: 1;
  556. flex-direction: column;
  557. justify-content: space-between;
  558. align-items: flex-start;
  559. overflow: hidden;
  560. }
  561. .uni-media-list-text-top {
  562. width: 100%;
  563. line-height: 36upx;
  564. font-size: 30upx;
  565. }
  566. .uni-media-list-text-bottom {
  567. width: 100%;
  568. line-height: 30upx;
  569. font-size: 26upx;
  570. color: #8f8f94;
  571. }
  572. /* 九宫格 */
  573. .uni-grid-9 {
  574. background: #f2f2f2;
  575. width: 750upx;
  576. display: flex;
  577. flex-direction: row;
  578. flex-wrap: wrap;
  579. border-top: 2upx solid #eee;
  580. }
  581. .uni-grid-9-item {
  582. width: 250upx;
  583. height: 200upx;
  584. display: flex;
  585. flex-direction: column;
  586. align-items: center;
  587. justify-content: center;
  588. border-bottom: 2upx solid;
  589. border-right: 2upx solid;
  590. border-color: #eee;
  591. box-sizing: border-box;
  592. }
  593. .no-border-right {
  594. border-right: none;
  595. }
  596. .uni-grid-9-image {
  597. width: 100upx;
  598. height: 100upx;
  599. }
  600. .uni-grid-9-text {
  601. width: 250upx;
  602. line-height: 4upx;
  603. height: 40upx;
  604. text-align: center;
  605. font-size: 30upx;
  606. }
  607. .uni-grid-9-item-hover {
  608. background: rgba(0, 0, 0, 0.1);
  609. }
  610. /* 上传 */
  611. .uni-uploader {
  612. flex: 1;
  613. flex-direction: column;
  614. }
  615. .uni-uploader-head {
  616. display: flex;
  617. flex-direction: row;
  618. justify-content: space-between;
  619. }
  620. .uni-uploader-info {
  621. color: #B2B2B2;
  622. }
  623. .uni-uploader-body {
  624. margin-top: 16upx;
  625. }
  626. .uni-uploader__files {
  627. display: flex;
  628. flex-direction: row;
  629. flex-wrap: wrap;
  630. }
  631. .uni-uploader__file {
  632. margin: 10upx;
  633. width: 210upx;
  634. height: 210upx;
  635. }
  636. .uni-uploader__img {
  637. display: block;
  638. width: 210upx;
  639. height: 210upx;
  640. }
  641. .uni-uploader__input-box {
  642. position: relative;
  643. margin:10upx;
  644. width: 208upx;
  645. height: 208upx;
  646. border: 2upx solid #D9D9D9;
  647. }
  648. .uni-uploader__input-box:before,
  649. .uni-uploader__input-box:after {
  650. content: " ";
  651. position: absolute;
  652. top: 50%;
  653. left: 50%;
  654. -webkit-transform: translate(-50%, -50%);
  655. transform: translate(-50%, -50%);
  656. background-color: #D9D9D9;
  657. }
  658. .uni-uploader__input-box:before {
  659. width: 4upx;
  660. height: 79upx;
  661. }
  662. .uni-uploader__input-box:after {
  663. width: 79upx;
  664. height: 4upx;
  665. }
  666. .uni-uploader__input-box:active {
  667. border-color: #999999;
  668. }
  669. .uni-uploader__input-box:active:before,
  670. .uni-uploader__input-box:active:after {
  671. background-color: #999999;
  672. }
  673. .uni-uploader__input {
  674. position: absolute;
  675. z-index: 1;
  676. top: 0;
  677. left: 0;
  678. width: 100%;
  679. height: 100%;
  680. opacity: 0;
  681. }
  682. /*问题反馈*/
  683. .feedback-title {
  684. display: flex;
  685. flex-direction: row;
  686. justify-content: space-between;
  687. align-items: center;
  688. padding: 20upx;
  689. color: #8f8f94;
  690. font-size: 28upx;
  691. }
  692. .feedback-star-view.feedback-title {
  693. justify-content: flex-start;
  694. margin: 0;
  695. }
  696. .feedback-quick {
  697. position: relative;
  698. padding-right: 40upx;
  699. }
  700. .feedback-quick:after {
  701. font-family: uniicons;
  702. font-size: 40upx;
  703. content: '\e581';
  704. position: absolute;
  705. right: 0;
  706. top: 50%;
  707. color: #bbb;
  708. -webkit-transform: translateY(-50%);
  709. transform: translateY(-50%);
  710. }
  711. .feedback-body {
  712. background: #fff;
  713. }
  714. .feedback-textare {
  715. height: 200upx;
  716. font-size: 34upx;
  717. line-height: 50upx;
  718. width: 100%;
  719. box-sizing: border-box;
  720. padding: 20upx 30upx 0;
  721. }
  722. .feedback-input {
  723. font-size: 34upx;
  724. height: 50upx;
  725. min-height: 50upx;
  726. padding: 15upx 20upx;
  727. line-height: 50upx;
  728. }
  729. .feedback-uploader {
  730. padding: 22upx 20upx;
  731. }
  732. .feedback-star {
  733. font-family: uniicons;
  734. font-size: 40upx;
  735. margin-left: 6upx;
  736. }
  737. .feedback-star-view {
  738. margin-left: 20upx;
  739. }
  740. .feedback-star:after {
  741. content: '\e408';
  742. }
  743. .feedback-star.active {
  744. color: #FFB400;
  745. }
  746. .feedback-star.active:after {
  747. content: '\e438';
  748. }
  749. .feedback-submit {
  750. background: #007AFF;
  751. color: #FFFFFF;
  752. margin: 20upx;
  753. }
  754. /* input group */
  755. .uni-input-group {
  756. position: relative;
  757. padding: 0;
  758. border: 0;
  759. background-color: #fff;
  760. }
  761. .uni-input-group:before {
  762. position: absolute;
  763. top: 0;
  764. right: 0;
  765. left: 0;
  766. height: 2upx;
  767. content: '';
  768. transform: scaleY(.5);
  769. background-color: #c8c7cc;
  770. }
  771. .uni-input-group:after {
  772. position: absolute;
  773. right: 0;
  774. bottom: 0;
  775. left: 0;
  776. height: 2upx;
  777. content: '';
  778. transform: scaleY(.5);
  779. background-color: #c8c7cc;
  780. }
  781. .uni-input-row {
  782. position: relative;
  783. display: flex;
  784. flex-direction: row;
  785. font-size:28upx;
  786. padding: 22upx 30upx;
  787. justify-content: space-between;
  788. }
  789. .uni-input-group .uni-input-row:after {
  790. position: absolute;
  791. right: 0;
  792. bottom: 0;
  793. left: 30upx;
  794. height: 2upx;
  795. content: '';
  796. transform: scaleY(.5);
  797. background-color: #c8c7cc;
  798. }
  799. .uni-input-row label {
  800. line-height: 70upx;
  801. }
  802. /* textarea */
  803. .uni-textarea{
  804. width:100%;
  805. background:#FFF;
  806. }
  807. .uni-textarea textarea{
  808. width:96%;
  809. padding:18upx 2%;
  810. line-height:1.6;
  811. font-size:28upx;
  812. height:150upx;
  813. }
  814. /* tab bar */
  815. .uni-tab-bar {
  816. display: flex;
  817. flex: 1;
  818. flex-direction: column;
  819. overflow: hidden;
  820. height: 100%;
  821. }
  822. .uni-tab-bar .list {
  823. width: 750upx;
  824. height: 100%;
  825. }
  826. .uni-swiper-tab {
  827. width: 100%;
  828. white-space: nowrap;
  829. line-height: 100upx;
  830. height: 100upx;
  831. border-bottom: 1px solid #c8c7cc;
  832. }
  833. .swiper-tab-list {
  834. font-size: 30upx;
  835. width: 150upx;
  836. display: inline-block;
  837. text-align: center;
  838. color: #555;
  839. }
  840. .uni-tab-bar .active {
  841. color: #007AFF;
  842. }
  843. .uni-tab-bar .swiper-box {
  844. flex: 1;
  845. width: 100%;
  846. height: calc(100% - 100upx);
  847. }
  848. .uni-tab-bar-loading{
  849. padding:20upx 0;
  850. }
  851. /* comment */
  852. .uni-comment{padding:5rpx 0; display: flex; flex-grow:1; flex-direction: column;}
  853. .uni-comment-list{flex-wrap:nowrap; padding:10rpx 0; margin:10rpx 0; width:100%; display: flex;}
  854. .uni-comment-face{width:70upx; height:70upx; border-radius:100%; margin-right:20upx; flex-shrink:0; overflow:hidden;}
  855. .uni-comment-face image{width:100%; border-radius:100%;}
  856. .uni-comment-body{width:100%;}
  857. .uni-comment-top{line-height:1.5em; justify-content:space-between;}
  858. .uni-comment-top text{color:#0A98D5; font-size:24upx;}
  859. .uni-comment-date{line-height:38upx; flex-direction:row; justify-content:space-between; display:flex !important; flex-grow:1;}
  860. .uni-comment-date view{color:#666666; font-size:24upx; line-height:38upx;}
  861. .uni-comment-content{line-height:1.6em; font-size:28upx; padding:8rpx 0;}
  862. .uni-comment-replay-btn{background:#FFF; font-size:24upx; line-height:28upx; padding:5rpx 20upx; border-radius:30upx; color:#333 !important; margin:0 10upx;}
  863. /* swiper msg */
  864. .uni-swiper-msg{width:100%; padding:12rpx 0; flex-wrap:nowrap; display:flex;}
  865. .uni-swiper-msg-icon{width:50upx; margin-right:20upx;}
  866. .uni-swiper-msg-icon image{width:100%; flex-shrink:0;}
  867. .uni-swiper-msg swiper{width:100%; height:50upx;}
  868. .uni-swiper-msg swiper-item{line-height:50upx;}
  869. /* product */
  870. .uni-product-list {
  871. display: flex;
  872. width: 100%;
  873. flex-wrap: wrap;
  874. flex-direction: row;
  875. }
  876. .uni-product {
  877. padding: 20upx;
  878. display: flex;
  879. flex-direction: column;
  880. }
  881. .image-view {
  882. height: 330upx;
  883. width: 330upx;
  884. margin:12upx 0;
  885. }
  886. .uni-product-image {
  887. height: 330upx;
  888. width: 330upx;
  889. }
  890. .uni-product-title {
  891. width: 300upx;
  892. word-break: break-all;
  893. display: -webkit-box;
  894. overflow: hidden;
  895. line-height:1.5;
  896. text-overflow: ellipsis;
  897. -webkit-box-orient: vertical;
  898. -webkit-line-clamp: 2;
  899. }
  900. .uni-product-price {
  901. margin-top:10upx;
  902. font-size: 28upx;
  903. line-height:1.5;
  904. position: relative;
  905. }
  906. .uni-product-price-original {
  907. color: #e80080;
  908. }
  909. .uni-product-price-favour {
  910. color: #888888;
  911. text-decoration: line-through;
  912. margin-left: 10upx;
  913. }
  914. .uni-product-tip {
  915. position: absolute;
  916. right: 10upx;
  917. background-color: #ff3333;
  918. color: #ffffff;
  919. padding: 0 10upx;
  920. border-radius: 5upx;
  921. }
  922. /* timeline */
  923. .uni-timeline {
  924. margin: 35upx 0;
  925. display: flex;
  926. flex-direction: column;
  927. position: relative;
  928. }
  929. .uni-timeline-item {
  930. display: flex;
  931. flex-direction: row;
  932. position: relative;
  933. padding-bottom: 20upx;
  934. box-sizing: border-box;
  935. overflow: hidden;
  936. }
  937. .uni-timeline-item .uni-timeline-item-keynode {
  938. width: 160upx;
  939. flex-shrink: 0;
  940. box-sizing: border-box;
  941. padding-right: 20upx;
  942. text-align: right;
  943. line-height: 65upx;
  944. }
  945. .uni-timeline-item .uni-timeline-item-divider {
  946. flex-shrink: 0;
  947. position: relative;
  948. width: 30upx;
  949. height: 30upx;
  950. top: 15upx;
  951. border-radius: 50%;
  952. background-color: #bbb;
  953. }
  954. .uni-timeline-item-divider::before,
  955. .uni-timeline-item-divider::after {
  956. position: absolute;
  957. left: 15upx;
  958. width: 1upx;
  959. height: 100vh;
  960. content: '';
  961. background: inherit;
  962. }
  963. .uni-timeline-item-divider::before {
  964. bottom: 100%;
  965. }
  966. .uni-timeline-item-divider::after {
  967. top: 100%;
  968. }
  969. .uni-timeline-last-item .uni-timeline-item-divider:after {
  970. display: none;
  971. }
  972. .uni-timeline-first-item .uni-timeline-item-divider:before {
  973. display: none;
  974. }
  975. .uni-timeline-item .uni-timeline-item-content {
  976. padding-left: 20upx;
  977. }
  978. .uni-timeline-last-item .bottom-border::after{
  979. display: none;
  980. }
  981. .uni-timeline-item-content .datetime{
  982. color: #CCCCCC;
  983. }
  984. /* 自定义节点颜色 */
  985. .uni-timeline-last-item .uni-timeline-item-divider{
  986. background-color: #1AAD19;
  987. }
  988. /* uni-icon */
  989. .uni-icon {
  990. font-family: uniicons;
  991. font-size: 24px;
  992. font-weight: normal;
  993. font-style: normal;
  994. line-height: 1;
  995. display: inline-block;
  996. text-decoration: none;
  997. -webkit-font-smoothing: antialiased;
  998. }
  999. .uni-icon.uni-active {
  1000. color: #007aff;
  1001. }
  1002. .uni-icon-contact:before {
  1003. content: '\e100';
  1004. }
  1005. .uni-icon-person:before {
  1006. content: '\e101';
  1007. }
  1008. .uni-icon-personadd:before {
  1009. content: '\e102';
  1010. }
  1011. .uni-icon-contact-filled:before {
  1012. content: '\e130';
  1013. }
  1014. .uni-icon-person-filled:before {
  1015. content: '\e131';
  1016. }
  1017. .uni-icon-personadd-filled:before {
  1018. content: '\e132';
  1019. }
  1020. .uni-icon-phone:before {
  1021. content: '\e200';
  1022. }
  1023. .uni-icon-email:before {
  1024. content: '\e201';
  1025. }
  1026. .uni-icon-chatbubble:before {
  1027. content: '\e202';
  1028. }
  1029. .uni-icon-chatboxes:before {
  1030. content: '\e203';
  1031. }
  1032. .uni-icon-phone-filled:before {
  1033. content: '\e230';
  1034. }
  1035. .uni-icon-email-filled:before {
  1036. content: '\e231';
  1037. }
  1038. .uni-icon-chatbubble-filled:before {
  1039. content: '\e232';
  1040. }
  1041. .uni-icon-chatboxes-filled:before {
  1042. content: '\e233';
  1043. }
  1044. .uni-icon-weibo:before {
  1045. content: '\e260';
  1046. }
  1047. .uni-icon-weixin:before {
  1048. content: '\e261';
  1049. }
  1050. .uni-icon-pengyouquan:before {
  1051. content: '\e262';
  1052. }
  1053. .uni-icon-chat:before {
  1054. content: '\e263';
  1055. }
  1056. .uni-icon-qq:before {
  1057. content: '\e264';
  1058. }
  1059. .uni-icon-videocam:before {
  1060. content: '\e300';
  1061. }
  1062. .uni-icon-camera:before {
  1063. content: '\e301';
  1064. }
  1065. .uni-icon-mic:before {
  1066. content: '\e302';
  1067. }
  1068. .uni-icon-location:before {
  1069. content: '\e303';
  1070. }
  1071. .uni-icon-mic-filled:before,
  1072. .uni-icon-speech:before {
  1073. content: '\e332';
  1074. }
  1075. .uni-icon-location-filled:before {
  1076. content: '\e333';
  1077. }
  1078. .uni-icon-micoff:before {
  1079. content: '\e360';
  1080. }
  1081. .uni-icon-image:before {
  1082. content: '\e363';
  1083. }
  1084. .uni-icon-map:before {
  1085. content: '\e364';
  1086. }
  1087. .uni-icon-compose:before {
  1088. content: '\e400';
  1089. }
  1090. .uni-icon-trash:before {
  1091. content: '\e401';
  1092. }
  1093. .uni-icon-upload:before {
  1094. content: '\e402';
  1095. }
  1096. .uni-icon-download:before {
  1097. content: '\e403';
  1098. }
  1099. .uni-icon-close:before {
  1100. content: '\e404';
  1101. }
  1102. .uni-icon-redo:before {
  1103. content: '\e405';
  1104. }
  1105. .uni-icon-undo:before {
  1106. content: '\e406';
  1107. }
  1108. .uni-icon-refresh:before {
  1109. content: '\e407';
  1110. }
  1111. .uni-icon-star:before {
  1112. content: '\e408';
  1113. }
  1114. .uni-icon-plus:before {
  1115. content: '\e409';
  1116. }
  1117. .uni-icon-minus:before {
  1118. content: '\e410';
  1119. }
  1120. .uni-icon-circle:before,
  1121. .uni-icon-checkbox:before {
  1122. content: '\e411';
  1123. }
  1124. .uni-icon-close-filled:before,
  1125. .uni-icon-clear:before {
  1126. content: '\e434';
  1127. }
  1128. .uni-icon-refresh-filled:before {
  1129. content: '\e437';
  1130. }
  1131. .uni-icon-star-filled:before {
  1132. content: '\e438';
  1133. }
  1134. .uni-icon-plus-filled:before {
  1135. content: '\e439';
  1136. }
  1137. .uni-icon-minus-filled:before {
  1138. content: '\e440';
  1139. }
  1140. .uni-icon-circle-filled:before {
  1141. content: '\e441';
  1142. }
  1143. .uni-icon-checkbox-filled:before {
  1144. content: '\e442';
  1145. }
  1146. .uni-icon-closeempty:before {
  1147. content: '\e460';
  1148. }
  1149. .uni-icon-refreshempty:before {
  1150. content: '\e461';
  1151. }
  1152. .uni-icon-reload:before {
  1153. content: '\e462';
  1154. }
  1155. .uni-icon-starhalf:before {
  1156. content: '\e463';
  1157. }
  1158. .uni-icon-spinner:before {
  1159. content: '\e464';
  1160. }
  1161. .uni-icon-spinner-cycle:before {
  1162. content: '\e465';
  1163. }
  1164. .uni-icon-search:before {
  1165. content: '\e466';
  1166. }
  1167. .uni-icon-plusempty:before {
  1168. content: '\e468';
  1169. }
  1170. .uni-icon-forward:before {
  1171. content: '\e470';
  1172. }
  1173. .uni-icon-back:before,
  1174. .uni-icon-left-nav:before {
  1175. content: '\e471';
  1176. }
  1177. .uni-icon-checkmarkempty:before {
  1178. content: '\e472';
  1179. }
  1180. .uni-icon-home:before {
  1181. content: '\e500';
  1182. }
  1183. .uni-icon-navigate:before {
  1184. content: '\e501';
  1185. }
  1186. .uni-icon-gear:before {
  1187. content: '\e502';
  1188. }
  1189. .uni-icon-paperplane:before {
  1190. content: '\e503';
  1191. }
  1192. .uni-icon-info:before {
  1193. content: '\e504';
  1194. }
  1195. .uni-icon-help:before {
  1196. content: '\e505';
  1197. }
  1198. .uni-icon-locked:before {
  1199. content: '\e506';
  1200. }
  1201. .uni-icon-more:before {
  1202. content: '\e507';
  1203. }
  1204. .uni-icon-flag:before {
  1205. content: '\e508';
  1206. }
  1207. .uni-icon-home-filled:before {
  1208. content: '\e530';
  1209. }
  1210. .uni-icon-gear-filled:before {
  1211. content: '\e532';
  1212. }
  1213. .uni-icon-info-filled:before {
  1214. content: '\e534';
  1215. }
  1216. .uni-icon-help-filled:before {
  1217. content: '\e535';
  1218. }
  1219. .uni-icon-more-filled:before {
  1220. content: '\e537';
  1221. }
  1222. .uni-icon-settings:before {
  1223. content: '\e560';
  1224. }
  1225. .uni-icon-list:before {
  1226. content: '\e562';
  1227. }
  1228. .uni-icon-bars:before {
  1229. content: '\e563';
  1230. }
  1231. .uni-icon-loop:before {
  1232. content: '\e565';
  1233. }
  1234. .uni-icon-paperclip:before {
  1235. content: '\e567';
  1236. }
  1237. .uni-icon-eye:before {
  1238. content: '\e568';
  1239. }
  1240. .uni-icon-arrowup:before {
  1241. content: '\e580';
  1242. }
  1243. .uni-icon-arrowdown:before {
  1244. content: '\e581';
  1245. }
  1246. .uni-icon-arrowleft:before {
  1247. content: '\e582';
  1248. }
  1249. .uni-icon-arrowright:before {
  1250. content: '\e583';
  1251. }
  1252. .uni-icon-arrowthinup:before {
  1253. content: '\e584';
  1254. }
  1255. .uni-icon-arrowthindown:before {
  1256. content: '\e585';
  1257. }
  1258. .uni-icon-arrowthinleft:before {
  1259. content: '\e586';
  1260. }
  1261. .uni-icon-arrowthinright:before {
  1262. content: '\e587';
  1263. }
  1264. .uni-icon-pulldown:before {
  1265. content: '\e588';
  1266. }
  1267. .uni-icon-scan:before {
  1268. content: "\e612";
  1269. }
  1270. /* 分界线 */
  1271. .uni-divider{
  1272. height: 110upx;
  1273. display: flex;
  1274. align-items:center;
  1275. justify-content: center;
  1276. position: relative;
  1277. }
  1278. .uni-divider__content{
  1279. font-size: 28upx;
  1280. color: #999;
  1281. padding: 0 20upx;
  1282. position: relative;
  1283. z-index: 101;
  1284. background: #F4F5F6;
  1285. }
  1286. .uni-divider__line{
  1287. background-color: #CCCCCC;
  1288. height: 1px;
  1289. width: 100%;
  1290. position: absolute;
  1291. z-index: 100;
  1292. top: 50%;
  1293. left: 0;
  1294. transform: translateY(50%);
  1295. }