page.css 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847
  1. /* #ifdef H5 */
  2. body {
  3. background: #333 !important;
  4. }
  5. page {
  6. min-height: 100%;
  7. }
  8. a {
  9. text-decoration: none;
  10. }
  11. /**
  12. * 页面宽度最大800px、并居中
  13. */
  14. page,
  15. iframe,
  16. .uni-page-head,
  17. .uni-tabbar,
  18. .open-location,
  19. .home-top-nav-content,
  20. .search-content-fixed,
  21. .trn-nav-top,
  22. .goods-buy-nav,
  23. .popup-bottom,
  24. .popup-top,
  25. .quick-movable-container,
  26. .online-service-movable-container,
  27. .bottom-fixed,
  28. .buy-nav,
  29. .plugins-popupscreen .content,
  30. .cart-buy-nav {
  31. max-width: 800px !important;
  32. margin: 0 auto !important;
  33. }
  34. .trn-nav-top,
  35. .goods-buy-nav,
  36. .nav-more-view,
  37. .quick-movable-container,
  38. .online-service-movable-container,
  39. .buy-nav,
  40. .cart-buy-nav {
  41. left: auto !important;
  42. }
  43. iframe,
  44. .bottom-fixed {
  45. right: 0 !important;
  46. }
  47. .web-html-content iframe {
  48. width: 100% !important;
  49. max-height: 500rpx !important;
  50. }
  51. /**
  52. * 隐藏导航栏内容、仅展示返回按钮
  53. */
  54. uni-page-head {
  55. position: absolute;
  56. margin-top: -999999px;
  57. z-index: 99;
  58. }
  59. .uni-page-head-bd {
  60. display: none !important;
  61. }
  62. .uni-page-head-btn {
  63. position: fixed;
  64. left: auto;
  65. bottom: 70px;
  66. background: rgba(0, 0, 0, 0.6);
  67. box-shadow: 0 0 10px rgb(0 0 0 / 30%);
  68. margin: 0 0 0 10px;
  69. border-radius: 50px;
  70. width: 31px;
  71. height: 31px;
  72. text-align: center;
  73. padding: 2px 3px 0 0;
  74. }
  75. .uni-page-head-btn .uni-btn-icon {
  76. color: #fff !important;
  77. }
  78. .uni-app--showtabbar uni-page-wrapper,
  79. uni-page-head[uni-page-head-type=default]~uni-page-wrapper {
  80. height: calc(100% - var(--window-bottom)) !important;
  81. }
  82. /* #endif */
  83. /**
  84. * 公共样式、框架样式覆盖
  85. */
  86. page {
  87. background: #f5f5f5;
  88. color: #4a4a4a;
  89. }
  90. input[type="text"],
  91. input[type="number"],
  92. input[type="idcard"],
  93. input[type="digit"],
  94. textarea {
  95. -webkit-appearance: none;
  96. border-radius: 5px;
  97. box-sizing: border-box;
  98. }
  99. page,
  100. textarea,
  101. .a-textarea-control textarea {
  102. font-size: 28rpx;
  103. }
  104. button:after,
  105. button:before {
  106. border: 0;
  107. border-radius: 0;
  108. }
  109. /**
  110. * 模块分割间距
  111. */
  112. .spacing {
  113. padding-top: 20rpx;
  114. }
  115. .spacing-10 {
  116. padding-top: 10rpx;
  117. }
  118. .spacing-mb {
  119. margin-bottom: 20rpx;
  120. }
  121. .spacing-mt {
  122. margin-top: 20rpx;
  123. }
  124. /**
  125. * 常用样式
  126. */
  127. .max-w {
  128. max-width: 100%;
  129. }
  130. .max-h {
  131. max-height: 100%;
  132. }
  133. .min-w {
  134. min-width: 100%;
  135. }
  136. .min-h {
  137. min-height: 100%;
  138. }
  139. .fl {
  140. float: left;
  141. }
  142. .fr {
  143. float: right;
  144. }
  145. .wh-auto {
  146. width: 100% !important;
  147. }
  148. .ht-auto {
  149. height: 100% !important;
  150. }
  151. .tc {
  152. text-align: center;
  153. }
  154. .tl {
  155. text-align: left;
  156. }
  157. .tr {
  158. text-align: right;
  159. }
  160. .oh {
  161. overflow: hidden;
  162. }
  163. .dis-none {
  164. display: none !important;
  165. }
  166. .dis-block {
  167. display: block !important;
  168. }
  169. .dis-inline {
  170. display: inline !important;
  171. }
  172. .dis-inline-block {
  173. display: inline-block !important;
  174. }
  175. .va-m {
  176. vertical-align: middle;
  177. }
  178. .pf {
  179. position: fixed;
  180. }
  181. .pa {
  182. position: absolute;
  183. }
  184. .pr {
  185. position: relative;
  186. }
  187. .bs-bb {
  188. box-sizing: border-box;
  189. }
  190. .radius-0 {
  191. border-radius: 0 !important;
  192. }
  193. .radius {
  194. border-radius: 10rpx !important;
  195. }
  196. .round {
  197. border-radius: 50rpx !important;
  198. }
  199. .circle {
  200. border-radius: 50% !important;
  201. }
  202. .fw-b {
  203. font-weight: bold;
  204. }
  205. .auto {
  206. margin: 0 auto;
  207. }
  208. .lh-0 {
  209. line-height: 0 !important;
  210. }
  211. .cp {
  212. /* #ifdef H5 */
  213. cursor: pointer;
  214. /* #endif */
  215. }
  216. /**
  217. * 透明度
  218. */
  219. .opacity-min {
  220. opacity: 0.3;
  221. }
  222. .opacity {
  223. opacity: 0.5;
  224. }
  225. .opacity-max {
  226. opacity: 0.8;
  227. }
  228. /**
  229. * 底部浮动
  230. */
  231. .bottom-fixed {
  232. position: fixed;
  233. left: 0;
  234. bottom: 0;
  235. border: none;
  236. width: 100%;
  237. box-sizing: border-box;
  238. z-index: 2;
  239. }
  240. /**
  241. * 页面底部浮动、增加底部边距
  242. */
  243. .page-bottom-fixed {
  244. padding-bottom: 120rpx !important;
  245. }
  246. /**
  247. * 主要类样式
  248. */
  249. .margin-main {
  250. margin: 20rpx;
  251. }
  252. .margin-top-main {
  253. margin-top: 20rpx;
  254. }
  255. .margin-right-main {
  256. margin-right: 20rpx;
  257. }
  258. .margin-bottom-main {
  259. margin-bottom: 20rpx;
  260. }
  261. .margin-left-main {
  262. margin-left: 20rpx;
  263. }
  264. .margin-horizontal-main {
  265. margin-left: 20rpx;
  266. margin-right: 20rpx;
  267. }
  268. .margin-vertical-main {
  269. margin-top: 20rpx;
  270. margin-bottom: 20rpx;
  271. }
  272. .padding-main {
  273. padding: 20rpx;
  274. }
  275. .padding-top-main {
  276. padding-top: 20rpx;
  277. }
  278. .padding-right-main {
  279. padding-right: 20rpx;
  280. }
  281. .padding-bottom-main {
  282. padding-bottom: 20rpx;
  283. }
  284. .padding-left-main {
  285. padding-left: 20rpx;
  286. }
  287. .padding-horizontal-main {
  288. padding-left: 20rpx;
  289. padding-right: 20rpx;
  290. }
  291. .padding-vertical-main {
  292. padding-top: 20rpx;
  293. padding-bottom: 20rpx;
  294. }
  295. .border-radius-main {
  296. border-radius: 20rpx;
  297. }
  298. .border-radius-left-main {
  299. border-top-left-radius: 20rpx;
  300. border-bottom-left-radius: 20rpx;
  301. }
  302. .border-radius-right-main {
  303. border-top-right-radius: 20rpx;
  304. border-bottom-right-radius: 20rpx;
  305. }
  306. /**
  307. * 价格
  308. */
  309. .sales-price {
  310. color: #f40;
  311. font-weight: bold;
  312. font-size: 28rpx;
  313. }
  314. .original-price {
  315. color: #999;
  316. font-size: 24rpx;
  317. text-decoration: line-through;
  318. }
  319. /**
  320. * 边框 灰色(四边)、红色、黄色、绿色、灰色、无边线
  321. */
  322. .br {
  323. border: 1px solid #f7f7f7 !important;
  324. }
  325. .br-b {
  326. border-bottom: 1px solid #f7f7f7 !important;
  327. }
  328. .br-t {
  329. border-top: 1px solid #f7f7f7 !important;
  330. }
  331. .br-l {
  332. border-left: 1px solid #f7f7f7 !important;
  333. }
  334. .br-r {
  335. border-right: 1px solid #f7f7f7 !important;
  336. }
  337. .br-red {
  338. border:1px solid #f00 !important;
  339. }
  340. .br-yellow {
  341. border: 1px solid #f6c133 !important;
  342. }
  343. .br-green {
  344. border: 1px solid #1AAD19 !important;
  345. }
  346. .br-gray {
  347. border: solid 1px #d6d6d6 !important;
  348. }
  349. .br-blue {
  350. border: solid 1px #2196F3 !important;
  351. }
  352. .br-0 {
  353. border: 0 !important;
  354. box-shadow: none;
  355. }
  356. /**
  357. * 虚线边框、灰色(四边)、红色、黄色、绿色、灰色
  358. */
  359. .br-dashed {
  360. border: dashed 1px #f7f7f7 !important;
  361. }
  362. .br-b-dashed {
  363. border-bottom: dashed 1px #f7f7f7 !important;
  364. }
  365. .br-t-dashed {
  366. border-top: dashed 1px #f7f7f7 !important;
  367. }
  368. .br-l-dashed {
  369. border-left: dashed 1px #f7f7f7 !important;
  370. }
  371. .br-r-dashed {
  372. border-right: dashed 1px #f7f7f7 !important;
  373. }
  374. .br-dashed-red {
  375. border: dashed 1px #f00 !important;
  376. }
  377. .br-dashed-yellow {
  378. border: dashed 1px #f6c133 !important;
  379. }
  380. .br-dashed-green {
  381. border: dashed 1px #1AAD19 !important;
  382. }
  383. .br-dashed-gray {
  384. border: dashed 1px #d6d6d6 !important;
  385. }
  386. /**
  387. * 统一颜色
  388. * 文本基础色、白色、黑色、灰色、浅灰色、红色、黄色、绿色、蓝色
  389. */
  390. .cr-base {
  391. color: #666 !important;
  392. }
  393. .cr-white {
  394. color: #fff !important;
  395. }
  396. .cr-black {
  397. color: #000 !important;
  398. }
  399. .cr-gray {
  400. color: #888 !important;
  401. }
  402. .cr-grey {
  403. color: #9A9A9A !important;
  404. }
  405. .cr-grey-white {
  406. color: #e7e7e7 !important;
  407. }
  408. .cr-red {
  409. color: #f00 !important;
  410. }
  411. .cr-yellow {
  412. color: #f6c133 !important;
  413. }
  414. .cr-green {
  415. color: #1AAD19 !important;
  416. }
  417. .cr-blue {
  418. color: #2196F3 !important;
  419. }
  420. /**
  421. * 统一背景色
  422. * 白色、绿色、红色、黄色、灰色
  423. */
  424. .bg-white {
  425. background-color: #fff !important;
  426. }
  427. .bg-green {
  428. background-color: #1AAD19 !important;
  429. }
  430. .bg-red {
  431. background-color: #E64340 !important;
  432. }
  433. .bg-yellow {
  434. background-color: #f6c133 !important;
  435. }
  436. .bg-gray {
  437. background-color: #d6d6d6 !important;
  438. }
  439. .bg-base {
  440. background-color: #f5f5f5 !important;
  441. }
  442. .bg-blue {
  443. background-color: #2196F3 !important;
  444. }
  445. button[disabled].bg-white {
  446. background-color: #fdfdfd !important;
  447. color: #ccc !important;
  448. }
  449. button[disabled].bg-green {
  450. background-color: #94de94 !important;
  451. color: #d5f5d5 !important;
  452. }
  453. button[disabled].bg-red {
  454. background-color: #ffbaba !important;
  455. color: #ffdfdf !important;
  456. }
  457. button[disabled].bg-yellow {
  458. background-color: #fff1cb !important;
  459. color: #fbd777 !important;
  460. }
  461. button[disabled].bg-gray {
  462. background-color: #ececec !important;
  463. color: #ababab !important;
  464. }
  465. /**
  466. * 兼容底部横线底部内边距
  467. */
  468. .bottom-line-exclude {
  469. padding-bottom: calc(env(safe-area-inset-bottom) - 40rpx);
  470. }
  471. /**
  472. * 表单
  473. */
  474. .form-container .form-gorup {
  475. padding: 20rpx;
  476. margin-bottom: 20rpx;
  477. border-radius: 20rpx;
  478. }
  479. .form-container .form-gorup .form-gorup-item-left {
  480. float: left;
  481. padding-right: 20rpx;
  482. }
  483. .form-container .form-gorup .form-gorup-item-right {
  484. float: right;
  485. padding-left: 20rpx;
  486. border-left: 1px solid #f7f7f7;
  487. }
  488. .form-container .form-gorup .form-gorup-item-left,
  489. .form-container .form-gorup .form-gorup-item-right {
  490. width: calc(50% - 20rpx - 1px);
  491. }
  492. .form-container .form-gorup-submit {
  493. padding: 20rpx 0;
  494. }
  495. .form-container .form-gorup:not(.form-gorup-submit) {
  496. background: #fff;
  497. }
  498. .form-container .form-gorup-title {
  499. margin-bottom: 5rpx;
  500. font-weight: 500;
  501. }
  502. .form-container .form-group-tips,
  503. .form-container .form-group-tips-must {
  504. margin-left: 20rpx;
  505. font-size: 24rpx;
  506. color: #ccc;
  507. }
  508. .form-container .form-group-tips-must {
  509. color: #f00;
  510. }
  511. .form-container .form-gorup input,
  512. .form-container .form-gorup textarea,
  513. .form-container .form-gorup .picker {
  514. border-radius: 0;
  515. width: 100%;
  516. box-sizing: border-box;
  517. font-size: 28rpx;
  518. }
  519. .form-container .form-gorup input,
  520. .form-container .form-gorup .picker,
  521. .form-container .form-gorup .radio-gorup {
  522. height: 70rpx;
  523. line-height: 70rpx;
  524. }
  525. .form-container .form-gorup textarea {
  526. padding: 0;
  527. height: 150rpx !important;
  528. margin-top: 20rpx;
  529. }
  530. .form-container .form-gorup-text {
  531. padding: 20rpx 10rpx;
  532. }
  533. .form-container .form-gorup .switch {
  534. margin: 30rpx 0 20rpx 0;
  535. }
  536. .form-container .form-gorup .radio-gorup .radio radio {
  537. transform: scale(0.7);
  538. }
  539. .form-container .form-gorup .radio-gorup .radio:not(:last-child) {
  540. margin-right: 50rpx;
  541. }
  542. /**
  543. * 表单图片上传
  544. */
  545. .form-container-upload .form-gorup-title {
  546. margin-bottom: 20rpx;
  547. }
  548. .form-container-upload .form-upload-data .item {
  549. margin: 10rpx 10rpx 0 0;
  550. position: relative;
  551. }
  552. .form-container-upload .form-upload-data .delete-icon {
  553. position: absolute;
  554. top: 0;
  555. right: 0;
  556. color: #e5e5e5;
  557. background-color: #d9534f;
  558. padding: 5rpx 18rpx;
  559. font-size: 36rpx;
  560. border: 1px solid #eee;
  561. border-radius: 50rpx;
  562. line-height: 44rpx;
  563. z-index: 1;
  564. }
  565. .form-container-upload .form-upload-data image {
  566. width: 150rpx;
  567. height: 150rpx;
  568. padding: 5rpx;
  569. border: 1px solid #eee;
  570. display: block;
  571. border-radius: 10rpx;
  572. }
  573. .form-container-upload .upload-icon {
  574. margin-top: 10rpx;
  575. width: 160rpx;
  576. height: 160rpx;
  577. border: 1px dashed #e9e9e9;
  578. display: block;
  579. border-radius: 10rpx;
  580. }
  581. /**
  582. * 通知、公告
  583. */
  584. .notice-content {
  585. background: #ffffeb url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAKN0lEQVR4Xu1beZAcZRX/vZ7NTn9DWJAjQKIYpKRSoqJCuHJMLwkQNjvdJEoIIMHSotRgIaIErJICpDwoCBYUFKApwYgp2Jhjejabg4Tt3oTEKkhREg4NxVUqQjgEEqZ7j+ln9exOT3dPz/bsJrs7hPSf813v/b7fe+/73vuG8Cn/6FOuPw4BcIgBY4xAT3vz6QXHuVCSSE+2Gs+PtjhjZgLcdknClvc8DNCVRaWZ90oSnZnMGP8YTRDGBADOnTfJdpxlIMwJKMv8R6GZ3zuoAchnm6eBHJ1AR4UVZWY9pZnaQQuAnW2ey3BWgkhEKcngXEo11YMOAGZIVk65npjvAJFUTcFaGWDpM08CS0tAfCKDbk+pxt+GC9qI+wBrjTKZE/w4gc6sEJJ5N4hOKf1eKwMsXdkMYNbAuD4Gfp5SjbuGA8KIAtCdS89zHFoOwvgIe19JxDcC0qseADX6AEtXXgIwxT8nA+0i2biQLtz08VCAGBEAuO3URit57FIi/KhSGGaAbhaq8SveMOMEuyfxZpkBaE+pRiZOASurfBvEywEKyM/ATlHAbJpnfBA3R6n9gAPQT3msJeC0CMq7sX5RMmOsLYb+EABgrBOa0VqL8PZaZbYj8QoCHRsKpS/Khd5mmr99Ty3zHFAAijsDPBBFeTDvArEm1K7XvB0fJgO88euU4+0CVgKYHlSWd8gZczoRnDgQagKAOxXZ3oezq01GjPHMfAOIZlYJb/eKhtQSalnfHbDb/WCAB0LHRUm711oFwlz/3MR8p6yZS4YMgKU3pxl8TySF42YLtTP4HYlpkawZGyKBCQMA7hCqGVCkliW5U2mwPuJVRBQ4QxCxKmfM3GBzVDDAyirbQJhWy8KD9+FNMtEVlDHerdZvf3xARVTpVBrsvbwRoPN8UWWPSI07hc7f/GFV9oYbLF15HcDnhwuAu+tEuFFkzIfj5uB+G/5vuR+vF6rZEh5nr5t+CrGUSLZ2ueGv6scbLzjMsru3EtHXvU7My4VmXjXiADD4aQm0Iml3P0QLdlhxyrvtFQAwNgjNuMg/Np9VVhLhW2B2QLhZqOavB5u7O6dMcRw8D0LCY4LkTEu1dm2PGldpAkEG9MncexRpT+2tRaGh9oljAK9RjrQT+J9/XmZeI5rocmo27Grr2dn0Uia63gMAyKZU4+IhA8DMe1KaedxQFau1fxwD+u8Q6Xcqb468Q7Z7ZlVjGncq4+2P+E0QHd4vi3v44pP9Ibgk46AMYODtlGocX6tCQ+0XAcBGoRmBHEE+lz4HDv5KRBMDTHCPvhlDJQJHrWvpym8A3OSxgPmBlGYuDvetLwDAm4RqXhgWknOnpyw+fDkB3/S3EfNiWTMfiAKAs7OOs6nwbwANRQ6A3xf2hAm0YGUhMEd4sD8KjDgD+oV8q+yxUcGA8g5CsvT0mkCsZ+yTC4nJNH/Le1Eg5HUlR0D5aE00W2Q6t9QvAFUY4IHgOkWJnwPR58pK8C+Fat5SxQy+A8Afjh8SqvGDegbgCaGaFwzmS2xdaWXAO931U/vdE2jBCz0VptNxVpPdK94vhUQGP5dSzcAlbWx9QKUJbBaacX6cM7V0xU2fn+p5cnLmypmujkgWZNMvgOhLA8HAkSftk+mMnb31EQXCAIBjGeAKbuvK9xl40KfwMqEaV0ebQXoFQJeV2hLsfKNR63q2PgFg1MSA4gFJ4vd8+cUXhGp8ORKAnHITGG5IHCABLktpxmP1AcDqcyfYDY1v+wTfIlRjdpwJuO1WmNrjUqnwdbu/n3IVCI94CodC59j6gAoA+EmhmqVk56A4WHp6HUDli1NCmizmPvlGeFC33qw54GIGauD7hZuO++QzQFdcGl/q2TbR1xoznX8PA2DlFAWMTp/Cd8mqcUOdAlA7A/LZdNZ/KCKmKbLW+c8wAHZWmcOE9d7vjNuEZtxaHwB0zDjW7kuUk5fMnUIzvYTGYDaQzypPE+GMUh+5oTCBWra+Ex6T19OXEWhFWWH+saya936iAeBnTh9n/2f8xyAa1+/a8aHQjCOjALP19GIG3V9u40VCNf/8iQbA1mdewJA2+mhd9Q6R15XfEXCd15cwQ2SMbfUJAGAI1WiOC4NWNv0nEC0qhzZcJ2vGPVHjLF1xHaDimQrtPYwyO/P1CoApVMMTNkohzk6baNM4N9wVr7nFr0oIdJvyevp9An1mwFReF5pxkn/esT0HhJ0gEAtAXlfWEOBLb3GbUE0vHPqV61nbfFZBYq9yzMwrU5q5oH4AyCnH2Iyy52buEpqZrmYCVjZ9NYh+77P9gsSFryYv3vpitANU7mTgZ6U2JixMZYzH6xmArUIzI6tLtp6+iEFrACTLtl+9+uPmE+1c+jWATuynP/fK3T1HhPOIY2sCNTDALct1f8S3FXfS/7iCeZcs7Tvb79D8O2tllStAeNTbfebVKc0MpNTctvoCANgmVGOGJ7RbZpeP2UagqSGKvyFz4izStvgvUmXLcHdfV3aDcLL3I6FZZAwjbCoxdQHOC9U8rJpN7u/vvHrW0XZDoVw6YzwlNMOr9ObbZ55LjvSUfx1mflYUeucMVv62dMV9abbMN+55oRpfiZI3rjDijnkEjIpbVlXliV+RM+ZfailNxwHAbkqrT/4XQE39Zoz7xaS9P/FndMJyuLkCS8JrRPBOhgzn0pTa1TZcAIaz0SYS0lVR19PAblYwgLcLzQwUZvMdymepD7dKhPbSw4rBBLKyyqMgXOGzh12yap5WrX4QwYD0boC+OBytQ2O6GbglpRp3VJurkgGVAAxFDjunXMOM+/xjEoypjZrxTLV5KgDIZ5X7iHDNUBYevC+3ycnkd6MeL8WZwFBksHLKdDgw/EVR1w9UyxWW5q4AwL1p9bzZ1OIwl0vMNUrChIujH1bwy5LEWri8zRVhMOgEa1wWVnt6Bhxy7/w+h80vycnk1LhXYzU9kalVEGaQlVN+SozfhnbCdWF5CdLlSbUz64W5ypxgIAzWsq6dm9nCLK32H5AYeAsNmJpqMdzS2KDfAQWgtJJLR3awlghHB1d3q7S4vVTJGajflUtjoXPAYJIPlM7dx5GBx9XM+KAhQbMbWzt3xinvto8IAO7E7nM5SLzR/xK07JnxmNyEK5HHMYEXIsxVj8J+ZdzzARxpFQGByrVbzk9IlB7Kk/sRA8AVmJ+YfYSd73schIqKL8DrielaJrzsC1k1AWDpyi4AoToAv4oCzRLzDPeJT83fiAJQBKHtkoQl77mbQNdWSMV4JXBcjbkNeiamh0I1Y53chIXUbOyrWfOBjiMOQEkgO5v+IRPuDz9vDQhcIwDFAinzUoAmMuG24T6UHlEfELUTxSIFO20gaqyyU7EJkaHucFz/UWNAIEIwu/8Y6U9TBb+DHwBXX7t9+he4kFhfGSGin8jE7eL+tI86A0rCFiOE1dfuf+gsEc9PZkw36zNq35gB0B8hzhF2MvkHECYx4cFwvm40UBhTAEZDwbg1DgEQh9DB3v5/c3FujBE8RpQAAAAASUVORK5CYII=') no-repeat 20rpx 12rpx;
  586. background-size: 34rpx;
  587. color: #ffa106;
  588. border: 1px solid #faebd2;
  589. line-height: 38rpx;
  590. padding: 10rpx 20rpx 10rpx 66rpx;
  591. font-size: 26rpx;
  592. border-radius: 20rpx;
  593. }
  594. .notice-content-blue {
  595. background: #def2fd;
  596. border: 1px solid #cfeeff;
  597. color: #1490d2;
  598. padding: 10rpx 20rpx;
  599. font-size: 26rpx;
  600. border-radius: 22rpx;
  601. }
  602. /**
  603. * 箭头符号
  604. */
  605. .arrow-right {
  606. background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAA+klEQVRYR+3WsWrDMBAG4P/eotCQLlk73UGfq6O3BgLNEsg7JQQPZ7ADfos8gAeBijYTAsnpREJBXmX0f/7RCRNe/NCL81EBtYH/1YCq/gK4iMiu1PSYGlDVloi+AOyZ+bsEwgQYx/FtmqYDgFUphAmQvniOiDFuRaTxNGEGlEZkAWaIFsCHp4lsQEIMw7AIIRw9CBfgGgFgzcw/ljPhBtxoohGR7aOIIoC+799DCCciWsYYnwvwhKeWXA14w12AEuHZgFLhWYCS4WbAPDxn5m+NpukQquqZiD49V+81wgToum6TfkiYef/oRXPvPRPg3mY56xVQG6gN/AEiuagh/yEjYQAAAABJRU5ErkJggg==');
  607. background-size: 38rpx 38rpx;
  608. background-repeat: no-repeat;
  609. background-position: center right;
  610. }
  611. .arrow-bottom {
  612. background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABRklEQVRYR+2UsUrFMBSGT9LBN3AQR4vQNO0gPoA6Cy5XZ1ddfZbr6nwdXFwVH8AlJacg2cTFN7BLjkQQwtW2STvcJRlL8/8fX3LCYMOLbbgfEkAykAwkA4MGEHEhhLif81gZY3bzPP/oy+gFQMSCiJCIjqSUL1MgjDFbXdd9AcB1WZbL/zIGDWitVwCwmAKhlNrOsuyTMYYAcC6EaKMB3IZfCMbYiRDiOcQEIu4RkRkrd1lBU+CZOJVSPg5BNE1zwDl/DSkPBvBNENGFlNIdzZ+FiMdE9BRaHgXgQ1hrL6uquvMJ2rY9s9Y+xJRHA/gQnPOroihu3Tc3rkS0ii2fBLB2MW8A4H1q+WQAH+InZGTUhi5t0BT0BWitDQDsMMYO++Z8bGxnAbhwpdR+XddvY0XRT/HUwNh9sw3EFq7/nwCSgWQgGfgGWR6PIRYTYskAAAAASUVORK5CYII=');
  613. background-size: 38rpx 38rpx;
  614. background-repeat: no-repeat;
  615. background-position: center right;
  616. }
  617. /**
  618. * 信息提示、加载页面图片
  619. */
  620. .data-loding image {
  621. width: 120rpx;
  622. height: 120rpx;
  623. background-size: 80% 80% !important;
  624. }
  625. /**
  626. * 元素漂出可视页面
  627. */
  628. .drift {
  629. position: fixed;
  630. left: -1000px;
  631. }
  632. /**
  633. * 导航分割
  634. */
  635. .spacing-nav-title {
  636. height: 80rpx;
  637. line-height: 80rpx;
  638. }
  639. .spacing-nav-title .text-wrapper {
  640. display: inline-block;
  641. font-size: 36rpx;
  642. font-weight: bold;
  643. color: #333;
  644. }
  645. /**
  646. * 关键字标签展示
  647. */
  648. .word-list .word-icon:not(:last-child) {
  649. margin-right: 20rpx;
  650. }
  651. .word-list image {
  652. max-width: 100%;
  653. margin: 0 auto;
  654. }
  655. /**
  656. * 文字超出部分使用省略号
  657. */
  658. .single-text {
  659. -o-text-overflow: ellipsis;
  660. text-overflow: ellipsis;
  661. overflow: hidden;
  662. white-space: nowrap;
  663. max-width: 100%;
  664. }
  665. .multi-text {
  666. max-width: 100%;
  667. overflow: hidden;
  668. text-overflow: ellipsis;
  669. display: -webkit-box;
  670. -webkit-line-clamp: 2;
  671. -webkit-box-orient: vertical;
  672. min-height: 76rpx;
  673. line-height: 38rpx;
  674. font-size: 28rpx;
  675. white-space: initial;
  676. }
  677. /**
  678. * 基础导航
  679. */
  680. .nav-base {
  681. height: 80rpx;
  682. line-height: 80rpx;
  683. }
  684. .nav-base .item {
  685. /* #ifdef H5 */
  686. cursor: pointer;
  687. /* #endif */
  688. }
  689. /**
  690. * 滚动标签高度
  691. */
  692. .scroll-box {
  693. height: 100vh;
  694. }
  695. /**
  696. * 存在基础导航
  697. */
  698. .scroll-box-ece-nav {
  699. height: calc(100vh - 80rpx);
  700. }
  701. /**
  702. * 滚动水平左右滑动
  703. */
  704. .scroll-view-horizontal {
  705. white-space: nowrap;
  706. box-sizing: border-box;
  707. width: 100%;
  708. }
  709. /**
  710. * 滚动水平左右滑动内容宽度处理
  711. */
  712. .rolling-horizontal .scroll-view-horizontal {
  713. width: calc(100% + 20rpx);
  714. }
  715. /**
  716. * 公共操作栏按钮样式
  717. */
  718. .item-operation button:not(:first-child) {
  719. margin-left: 20rpx;
  720. }
  721. .item-operation button {
  722. padding: 0 35rpx;
  723. height: 58rpx;
  724. line-height: 58rpx;
  725. display: inline-flex;
  726. }
  727. /**
  728. * 单页预览
  729. */
  730. .single-page-top {
  731. padding-top: 110rpx;
  732. }
  733. /**
  734. * 上一篇、下一篇
  735. */
  736. .last-next-data navigator {
  737. width: calc(100% - 120rpx);
  738. }
  739. /**
  740. * 商品列表
  741. */
  742. .goods-list .cart-badge-icon {
  743. top: -18rpx;
  744. right: 8rpx;
  745. }
  746. .goods-list .right-cart-icon {
  747. bottom: 8rpx;
  748. right: 20rpx;
  749. }
  750. .goods-list .error-msg {
  751. position: absolute;
  752. top: 0;
  753. left: 0;
  754. background: rgb(253 253 253 / 60%);
  755. z-index: 1;
  756. filter: blur(0.3px);
  757. }
  758. .goods-data-grid-list .item .error-msg,
  759. .goods-data-rolling-list .item .error-msg {
  760. border-bottom-left-radius: 0 !important;
  761. border-bottom-right-radius: 0 !important;
  762. }
  763. /**
  764. * 商品列表 - 列表
  765. */
  766. .goods-data-list .error-msg,
  767. .goods-data-list .goods-img {
  768. width: 190rpx !important;
  769. height: 190rpx !important;
  770. }
  771. .goods-data-list .base {
  772. width: calc(100% - 220rpx);
  773. }
  774. .goods-data-list .base .base-bottom {
  775. bottom: 20rpx;
  776. right: 20rpx;
  777. width: calc(100% - 260rpx);
  778. }
  779. .goods-data-list .error-msg {
  780. top: 20rpx;
  781. left: 20rpx;
  782. line-height: 190rpx;
  783. }
  784. /*
  785. * 商品列表 - 滚动
  786. */
  787. .goods-data-rolling-list swiper {
  788. height: 390rpx !important;
  789. }
  790. .goods-data-rolling-list .item .error-msg,
  791. .goods-data-rolling-list .item .goods-img {
  792. height: 240rpx !important;
  793. }
  794. .goods-data-rolling-list .item .error-msg {
  795. line-height: 240rpx;
  796. }
  797. /**
  798. * 商品列表 - 九方格
  799. */
  800. .goods-data-grid-list .item {
  801. width: calc(50% - 10rpx);
  802. float: left;
  803. padding-bottom: 10rpx;
  804. margin-bottom: 20rpx;
  805. }
  806. .goods-data-grid-list .item:nth-of-type(2n + 1) {
  807. margin-right: 10rpx;
  808. }
  809. .goods-data-grid-list .item:nth-of-type(2n) {
  810. margin-left: 10rpx;
  811. }
  812. .goods-data-grid-list .item .error-msg,
  813. .goods-data-grid-list .item .goods-img {
  814. height: 380rpx !important;
  815. }
  816. .goods-data-grid-list .item .error-msg {
  817. line-height: 380rpx;
  818. }