living.css 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965
  1. /**
  2. * 这里是uni-app内置的常用样式变量
  3. *
  4. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  5. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  6. *
  7. */
  8. /**
  9. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  10. *
  11. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  12. */
  13. /* 颜色变量 */
  14. /* 行为相关颜色 */
  15. /* 文字基本颜色 */
  16. /* 背景颜色 */
  17. /* 边框颜色 */
  18. /* 尺寸变量 */
  19. /* 文字尺寸 */
  20. /* 图片尺寸 */
  21. /* Border Radius */
  22. /* 水平间距 */
  23. /* 垂直间距 */
  24. /* 透明度 */
  25. /* 文章场景相关 */
  26. /*自定义主题色 */
  27. .u-empty[data-v-ac70166d],
  28. .u-empty__wrap[data-v-ac70166d],
  29. .u-tabs[data-v-ac70166d],
  30. .u-tabs__wrapper[data-v-ac70166d],
  31. .u-tabs__wrapper__scroll-view-wrapper[data-v-ac70166d],
  32. .u-tabs__wrapper__scroll-view[data-v-ac70166d],
  33. .u-tabs__wrapper__nav[data-v-ac70166d],
  34. .u-tabs__wrapper__nav__line[data-v-ac70166d] {
  35. display: flex;
  36. flex-direction: column;
  37. flex-shrink: 0;
  38. flex-grow: 0;
  39. flex-basis: auto;
  40. align-items: stretch;
  41. align-content: flex-start;
  42. }
  43. @font-face {
  44. font-family: "uicon-iconfont";
  45. src: url("https://at.alicdn.com/t/font_2225171_8kdcwk4po24.ttf") format("truetype");
  46. }
  47. .u-icon[data-v-ac70166d] {
  48. display: flex;
  49. align-items: center;
  50. }
  51. .u-icon--left[data-v-ac70166d] {
  52. flex-direction: row-reverse;
  53. align-items: center;
  54. }
  55. .u-icon--right[data-v-ac70166d] {
  56. flex-direction: row;
  57. align-items: center;
  58. }
  59. .u-icon--top[data-v-ac70166d] {
  60. flex-direction: column-reverse;
  61. justify-content: center;
  62. }
  63. .u-icon--bottom[data-v-ac70166d] {
  64. flex-direction: column;
  65. justify-content: center;
  66. }
  67. .u-icon__icon[data-v-ac70166d] {
  68. font-family: uicon-iconfont;
  69. position: relative;
  70. display: flex;
  71. flex-direction: row;
  72. align-items: center;
  73. }
  74. .u-icon__icon--primary[data-v-ac70166d] {
  75. color: #3c9cff;
  76. }
  77. .u-icon__icon--success[data-v-ac70166d] {
  78. color: #5ac725;
  79. }
  80. .u-icon__icon--error[data-v-ac70166d] {
  81. color: #f56c6c;
  82. }
  83. .u-icon__icon--warning[data-v-ac70166d] {
  84. color: #f9ae3d;
  85. }
  86. .u-icon__icon--info[data-v-ac70166d] {
  87. color: #909399;
  88. }
  89. .u-icon__img[data-v-ac70166d] {
  90. height: auto;
  91. will-change: transform;
  92. }
  93. .u-icon__label[data-v-ac70166d] {
  94. line-height: 1;
  95. }
  96. /**
  97. * 这里是uni-app内置的常用样式变量
  98. *
  99. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  100. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  101. *
  102. */
  103. /**
  104. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  105. *
  106. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  107. */
  108. /* 颜色变量 */
  109. /* 行为相关颜色 */
  110. /* 文字基本颜色 */
  111. /* 背景颜色 */
  112. /* 边框颜色 */
  113. /* 尺寸变量 */
  114. /* 文字尺寸 */
  115. /* 图片尺寸 */
  116. /* Border Radius */
  117. /* 水平间距 */
  118. /* 垂直间距 */
  119. /* 透明度 */
  120. /* 文章场景相关 */
  121. /*自定义主题色 */
  122. .u-empty[data-v-12f6646d],
  123. .u-empty__wrap[data-v-12f6646d],
  124. .u-tabs[data-v-12f6646d],
  125. .u-tabs__wrapper[data-v-12f6646d],
  126. .u-tabs__wrapper__scroll-view-wrapper[data-v-12f6646d],
  127. .u-tabs__wrapper__scroll-view[data-v-12f6646d],
  128. .u-tabs__wrapper__nav[data-v-12f6646d],
  129. .u-tabs__wrapper__nav__line[data-v-12f6646d] {
  130. display: flex;
  131. flex-direction: column;
  132. flex-shrink: 0;
  133. flex-grow: 0;
  134. flex-basis: auto;
  135. align-items: stretch;
  136. align-content: flex-start;
  137. }
  138. .u-link[data-v-12f6646d] {
  139. line-height: 1;
  140. display: flex;
  141. flex-direction: row;
  142. flex-wrap: wrap;
  143. flex: 1;
  144. }
  145. /**
  146. * 这里是uni-app内置的常用样式变量
  147. *
  148. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  149. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  150. *
  151. */
  152. /**
  153. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  154. *
  155. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  156. */
  157. /* 颜色变量 */
  158. /* 行为相关颜色 */
  159. /* 文字基本颜色 */
  160. /* 背景颜色 */
  161. /* 边框颜色 */
  162. /* 尺寸变量 */
  163. /* 文字尺寸 */
  164. /* 图片尺寸 */
  165. /* Border Radius */
  166. /* 水平间距 */
  167. /* 垂直间距 */
  168. /* 透明度 */
  169. /* 文章场景相关 */
  170. /*自定义主题色 */
  171. .u-empty[data-v-0a574502],
  172. .u-empty__wrap[data-v-0a574502],
  173. .u-tabs[data-v-0a574502],
  174. .u-tabs__wrapper[data-v-0a574502],
  175. .u-tabs__wrapper__scroll-view-wrapper[data-v-0a574502],
  176. .u-tabs__wrapper__scroll-view[data-v-0a574502],
  177. .u-tabs__wrapper__nav[data-v-0a574502],
  178. .u-tabs__wrapper__nav__line[data-v-0a574502] {
  179. display: flex;
  180. flex-direction: column;
  181. flex-shrink: 0;
  182. flex-grow: 0;
  183. flex-basis: auto;
  184. align-items: stretch;
  185. align-content: flex-start;
  186. }
  187. .u-text[data-v-0a574502] {
  188. display: flex;
  189. flex-direction: row;
  190. align-items: center;
  191. flex-wrap: nowrap;
  192. flex: 1;
  193. width: 100%;
  194. }
  195. .u-text__price[data-v-0a574502] {
  196. font-size: 14px;
  197. color: #606266;
  198. }
  199. .u-text__value[data-v-0a574502] {
  200. font-size: 14px;
  201. display: flex;
  202. flex-direction: row;
  203. color: #606266;
  204. flex-wrap: wrap;
  205. text-overflow: ellipsis;
  206. align-items: center;
  207. }
  208. .u-text__value--primary[data-v-0a574502] {
  209. color: #3c9cff;
  210. }
  211. .u-text__value--warning[data-v-0a574502] {
  212. color: #f9ae3d;
  213. }
  214. .u-text__value--success[data-v-0a574502] {
  215. color: #5ac725;
  216. }
  217. .u-text__value--info[data-v-0a574502] {
  218. color: #909399;
  219. }
  220. .u-text__value--error[data-v-0a574502] {
  221. color: #f56c6c;
  222. }
  223. .u-text__value--main[data-v-0a574502] {
  224. color: #303133;
  225. }
  226. .u-text__value--content[data-v-0a574502] {
  227. color: #606266;
  228. }
  229. .u-text__value--tips[data-v-0a574502] {
  230. color: #909193;
  231. }
  232. .u-text__value--light[data-v-0a574502] {
  233. color: #c0c4cc;
  234. }
  235. /**
  236. * 这里是uni-app内置的常用样式变量
  237. *
  238. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  239. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  240. *
  241. */
  242. /**
  243. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  244. *
  245. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  246. */
  247. /* 颜色变量 */
  248. /* 行为相关颜色 */
  249. /* 文字基本颜色 */
  250. /* 背景颜色 */
  251. /* 边框颜色 */
  252. /* 尺寸变量 */
  253. /* 文字尺寸 */
  254. /* 图片尺寸 */
  255. /* Border Radius */
  256. /* 水平间距 */
  257. /* 垂直间距 */
  258. /* 透明度 */
  259. /* 文章场景相关 */
  260. /*自定义主题色 */
  261. .u-empty[data-v-34d954f9],
  262. .u-empty__wrap[data-v-34d954f9],
  263. .u-tabs[data-v-34d954f9],
  264. .u-tabs__wrapper[data-v-34d954f9],
  265. .u-tabs__wrapper__scroll-view-wrapper[data-v-34d954f9],
  266. .u-tabs__wrapper__scroll-view[data-v-34d954f9],
  267. .u-tabs__wrapper__nav[data-v-34d954f9],
  268. .u-tabs__wrapper__nav__line[data-v-34d954f9] {
  269. display: flex;
  270. flex-direction: column;
  271. flex-shrink: 0;
  272. flex-grow: 0;
  273. flex-basis: auto;
  274. align-items: stretch;
  275. align-content: flex-start;
  276. }
  277. .u-avatar[data-v-34d954f9] {
  278. display: flex;
  279. flex-direction: row;
  280. align-items: center;
  281. justify-content: center;
  282. }
  283. .u-avatar--circle[data-v-34d954f9] {
  284. border-radius: 100px;
  285. }
  286. .u-avatar--square[data-v-34d954f9] {
  287. border-radius: 4px;
  288. }
  289. .u-avatar__image--circle[data-v-34d954f9] {
  290. border-radius: 100px;
  291. overflow: hidden;
  292. }
  293. .u-avatar__image--square[data-v-34d954f9] {
  294. border-radius: 4px;
  295. }
  296. /**
  297. * 这里是uni-app内置的常用样式变量
  298. *
  299. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  300. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  301. *
  302. */
  303. /**
  304. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  305. *
  306. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  307. */
  308. /* 颜色变量 */
  309. /* 行为相关颜色 */
  310. /* 文字基本颜色 */
  311. /* 背景颜色 */
  312. /* 边框颜色 */
  313. /* 尺寸变量 */
  314. /* 文字尺寸 */
  315. /* 图片尺寸 */
  316. /* Border Radius */
  317. /* 水平间距 */
  318. /* 垂直间距 */
  319. /* 透明度 */
  320. /* 文章场景相关 */
  321. /*自定义主题色 */
  322. .u-empty[data-v-df79975b],
  323. .u-empty__wrap[data-v-df79975b],
  324. .u-tabs[data-v-df79975b],
  325. .u-tabs__wrapper[data-v-df79975b],
  326. .u-tabs__wrapper__scroll-view-wrapper[data-v-df79975b],
  327. .u-tabs__wrapper__scroll-view[data-v-df79975b],
  328. .u-tabs__wrapper__nav[data-v-df79975b],
  329. .u-tabs__wrapper__nav__line[data-v-df79975b] {
  330. display: flex;
  331. flex-direction: column;
  332. flex-shrink: 0;
  333. flex-grow: 0;
  334. flex-basis: auto;
  335. align-items: stretch;
  336. align-content: flex-start;
  337. }
  338. .u-input[data-v-df79975b] {
  339. display: flex;
  340. flex-direction: row;
  341. align-items: center;
  342. justify-content: space-between;
  343. flex: 1;
  344. }
  345. .u-input--radius[data-v-df79975b], .u-input--square[data-v-df79975b] {
  346. border-radius: 4px;
  347. }
  348. .u-input--no-radius[data-v-df79975b] {
  349. border-radius: 0;
  350. }
  351. .u-input--circle[data-v-df79975b] {
  352. border-radius: 100px;
  353. }
  354. .u-input__content[data-v-df79975b] {
  355. flex: 1;
  356. display: flex;
  357. flex-direction: row;
  358. align-items: center;
  359. justify-content: space-between;
  360. }
  361. .u-input__content__field-wrapper[data-v-df79975b] {
  362. position: relative;
  363. display: flex;
  364. flex-direction: row;
  365. margin: 0;
  366. flex: 1;
  367. }
  368. .u-input__content__field-wrapper__field[data-v-df79975b] {
  369. line-height: 26px;
  370. text-align: left;
  371. color: #303133;
  372. height: 24px;
  373. font-size: 15px;
  374. flex: 1;
  375. }
  376. .u-input__content__clear[data-v-df79975b] {
  377. width: 20px;
  378. height: 20px;
  379. border-radius: 100px;
  380. background-color: #c6c7cb;
  381. display: flex;
  382. flex-direction: row;
  383. align-items: center;
  384. justify-content: center;
  385. transform: scale(0.82);
  386. margin-left: 4px;
  387. }
  388. .u-input__content__subfix-icon[data-v-df79975b] {
  389. margin-left: 4px;
  390. }
  391. .u-input__content__prefix-icon[data-v-df79975b] {
  392. margin-right: 4px;
  393. }
  394. /**
  395. * 这里是uni-app内置的常用样式变量
  396. *
  397. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  398. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  399. *
  400. */
  401. /**
  402. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  403. *
  404. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  405. */
  406. /* 颜色变量 */
  407. /* 行为相关颜色 */
  408. /* 文字基本颜色 */
  409. /* 背景颜色 */
  410. /* 边框颜色 */
  411. /* 尺寸变量 */
  412. /* 文字尺寸 */
  413. /* 图片尺寸 */
  414. /* Border Radius */
  415. /* 水平间距 */
  416. /* 垂直间距 */
  417. /* 透明度 */
  418. /* 文章场景相关 */
  419. /*自定义主题色 */
  420. .u-empty[data-v-5cec8177],
  421. .u-empty__wrap[data-v-5cec8177],
  422. .u-tabs[data-v-5cec8177],
  423. .u-tabs__wrapper[data-v-5cec8177],
  424. .u-tabs__wrapper__scroll-view-wrapper[data-v-5cec8177],
  425. .u-tabs__wrapper__scroll-view[data-v-5cec8177],
  426. .u-tabs__wrapper__nav[data-v-5cec8177],
  427. .u-tabs__wrapper__nav__line[data-v-5cec8177] {
  428. display: flex;
  429. flex-direction: column;
  430. flex-shrink: 0;
  431. flex-grow: 0;
  432. flex-basis: auto;
  433. align-items: stretch;
  434. align-content: flex-start;
  435. }
  436. /**
  437. * vue版本动画内置的动画模式有如下:
  438. * fade:淡入
  439. * zoom:缩放
  440. * fade-zoom:缩放淡入
  441. * fade-up:上滑淡入
  442. * fade-down:下滑淡入
  443. * fade-left:左滑淡入
  444. * fade-right:右滑淡入
  445. * slide-up:上滑进入
  446. * slide-down:下滑进入
  447. * slide-left:左滑进入
  448. * slide-right:右滑进入
  449. */
  450. .u-fade-enter-active[data-v-5cec8177],
  451. .u-fade-leave-active[data-v-5cec8177] {
  452. transition-property: opacity;
  453. }
  454. .u-fade-enter[data-v-5cec8177],
  455. .u-fade-leave-to[data-v-5cec8177] {
  456. opacity: 0;
  457. }
  458. .u-fade-zoom-enter[data-v-5cec8177],
  459. .u-fade-zoom-leave-to[data-v-5cec8177] {
  460. transform: scale(0.95);
  461. opacity: 0;
  462. }
  463. .u-fade-zoom-enter-active[data-v-5cec8177],
  464. .u-fade-zoom-leave-active[data-v-5cec8177] {
  465. transition-property: transform, opacity;
  466. }
  467. .u-fade-down-enter-active[data-v-5cec8177],
  468. .u-fade-down-leave-active[data-v-5cec8177],
  469. .u-fade-left-enter-active[data-v-5cec8177],
  470. .u-fade-left-leave-active[data-v-5cec8177],
  471. .u-fade-right-enter-active[data-v-5cec8177],
  472. .u-fade-right-leave-active[data-v-5cec8177],
  473. .u-fade-up-enter-active[data-v-5cec8177],
  474. .u-fade-up-leave-active[data-v-5cec8177] {
  475. transition-property: opacity, transform;
  476. }
  477. .u-fade-up-enter[data-v-5cec8177],
  478. .u-fade-up-leave-to[data-v-5cec8177] {
  479. transform: translate3d(0, 100%, 0);
  480. opacity: 0;
  481. }
  482. .u-fade-down-enter[data-v-5cec8177],
  483. .u-fade-down-leave-to[data-v-5cec8177] {
  484. transform: translate3d(0, -100%, 0);
  485. opacity: 0;
  486. }
  487. .u-fade-left-enter[data-v-5cec8177],
  488. .u-fade-left-leave-to[data-v-5cec8177] {
  489. transform: translate3d(-100%, 0, 0);
  490. opacity: 0;
  491. }
  492. .u-fade-right-enter[data-v-5cec8177],
  493. .u-fade-right-leave-to[data-v-5cec8177] {
  494. transform: translate3d(100%, 0, 0);
  495. opacity: 0;
  496. }
  497. .u-slide-down-enter-active[data-v-5cec8177],
  498. .u-slide-down-leave-active[data-v-5cec8177],
  499. .u-slide-left-enter-active[data-v-5cec8177],
  500. .u-slide-left-leave-active[data-v-5cec8177],
  501. .u-slide-right-enter-active[data-v-5cec8177],
  502. .u-slide-right-leave-active[data-v-5cec8177],
  503. .u-slide-up-enter-active[data-v-5cec8177],
  504. .u-slide-up-leave-active[data-v-5cec8177] {
  505. transition-property: transform;
  506. }
  507. .u-slide-up-enter[data-v-5cec8177],
  508. .u-slide-up-leave-to[data-v-5cec8177] {
  509. transform: translate3d(0, 100%, 0);
  510. }
  511. .u-slide-down-enter[data-v-5cec8177],
  512. .u-slide-down-leave-to[data-v-5cec8177] {
  513. transform: translate3d(0, -100%, 0);
  514. }
  515. .u-slide-left-enter[data-v-5cec8177],
  516. .u-slide-left-leave-to[data-v-5cec8177] {
  517. transform: translate3d(-100%, 0, 0);
  518. }
  519. .u-slide-right-enter[data-v-5cec8177],
  520. .u-slide-right-leave-to[data-v-5cec8177] {
  521. transform: translate3d(100%, 0, 0);
  522. }
  523. .u-zoom-enter-active[data-v-5cec8177],
  524. .u-zoom-leave-active[data-v-5cec8177] {
  525. transition-property: transform;
  526. }
  527. .u-zoom-enter[data-v-5cec8177],
  528. .u-zoom-leave-to[data-v-5cec8177] {
  529. transform: scale(0.95);
  530. }
  531. /**
  532. * 这里是uni-app内置的常用样式变量
  533. *
  534. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  535. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  536. *
  537. */
  538. /**
  539. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  540. *
  541. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  542. */
  543. /* 颜色变量 */
  544. /* 行为相关颜色 */
  545. /* 文字基本颜色 */
  546. /* 背景颜色 */
  547. /* 边框颜色 */
  548. /* 尺寸变量 */
  549. /* 文字尺寸 */
  550. /* 图片尺寸 */
  551. /* Border Radius */
  552. /* 水平间距 */
  553. /* 垂直间距 */
  554. /* 透明度 */
  555. /* 文章场景相关 */
  556. /*自定义主题色 */
  557. .u-empty[data-v-9112bed9],
  558. .u-empty__wrap[data-v-9112bed9],
  559. .u-tabs[data-v-9112bed9],
  560. .u-tabs__wrapper[data-v-9112bed9],
  561. .u-tabs__wrapper__scroll-view-wrapper[data-v-9112bed9],
  562. .u-tabs__wrapper__scroll-view[data-v-9112bed9],
  563. .u-tabs__wrapper__nav[data-v-9112bed9],
  564. .u-tabs__wrapper__nav__line[data-v-9112bed9] {
  565. display: flex;
  566. flex-direction: column;
  567. flex-shrink: 0;
  568. flex-grow: 0;
  569. flex-basis: auto;
  570. align-items: stretch;
  571. align-content: flex-start;
  572. }
  573. .u-overlay[data-v-9112bed9] {
  574. position: fixed;
  575. top: 0;
  576. left: 0;
  577. width: 100%;
  578. height: 100%;
  579. background-color: rgba(0, 0, 0, 0.7);
  580. }
  581. /**
  582. * 这里是uni-app内置的常用样式变量
  583. *
  584. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  585. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  586. *
  587. */
  588. /**
  589. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  590. *
  591. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  592. */
  593. /* 颜色变量 */
  594. /* 行为相关颜色 */
  595. /* 文字基本颜色 */
  596. /* 背景颜色 */
  597. /* 边框颜色 */
  598. /* 尺寸变量 */
  599. /* 文字尺寸 */
  600. /* 图片尺寸 */
  601. /* Border Radius */
  602. /* 水平间距 */
  603. /* 垂直间距 */
  604. /* 透明度 */
  605. /* 文章场景相关 */
  606. /*自定义主题色 */
  607. .u-status-bar[data-v-eb8e0cdd] {
  608. width: 100%;
  609. }
  610. /**
  611. * 这里是uni-app内置的常用样式变量
  612. *
  613. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  614. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  615. *
  616. */
  617. /**
  618. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  619. *
  620. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  621. */
  622. /* 颜色变量 */
  623. /* 行为相关颜色 */
  624. /* 文字基本颜色 */
  625. /* 背景颜色 */
  626. /* 边框颜色 */
  627. /* 尺寸变量 */
  628. /* 文字尺寸 */
  629. /* 图片尺寸 */
  630. /* Border Radius */
  631. /* 水平间距 */
  632. /* 垂直间距 */
  633. /* 透明度 */
  634. /* 文章场景相关 */
  635. /*自定义主题色 */
  636. .u-safe-bottom[data-v-f3d22cfe] {
  637. width: 100%;
  638. }
  639. /**
  640. * 这里是uni-app内置的常用样式变量
  641. *
  642. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  643. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  644. *
  645. */
  646. /**
  647. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  648. *
  649. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  650. */
  651. /* 颜色变量 */
  652. /* 行为相关颜色 */
  653. /* 文字基本颜色 */
  654. /* 背景颜色 */
  655. /* 边框颜色 */
  656. /* 尺寸变量 */
  657. /* 文字尺寸 */
  658. /* 图片尺寸 */
  659. /* Border Radius */
  660. /* 水平间距 */
  661. /* 垂直间距 */
  662. /* 透明度 */
  663. /* 文章场景相关 */
  664. /*自定义主题色 */
  665. .u-empty[data-v-05c24e9b],
  666. .u-empty__wrap[data-v-05c24e9b],
  667. .u-tabs[data-v-05c24e9b],
  668. .u-tabs__wrapper[data-v-05c24e9b],
  669. .u-tabs__wrapper__scroll-view-wrapper[data-v-05c24e9b],
  670. .u-tabs__wrapper__scroll-view[data-v-05c24e9b],
  671. .u-tabs__wrapper__nav[data-v-05c24e9b],
  672. .u-tabs__wrapper__nav__line[data-v-05c24e9b] {
  673. display: flex;
  674. flex-direction: column;
  675. flex-shrink: 0;
  676. flex-grow: 0;
  677. flex-basis: auto;
  678. align-items: stretch;
  679. align-content: flex-start;
  680. }
  681. .u-popup[data-v-05c24e9b] {
  682. flex: 1;
  683. }
  684. .u-popup__content[data-v-05c24e9b] {
  685. background-color: #fff;
  686. position: relative;
  687. }
  688. .u-popup__content--round-top[data-v-05c24e9b] {
  689. border-top-left-radius: 0;
  690. border-top-right-radius: 0;
  691. border-bottom-left-radius: 10px;
  692. border-bottom-right-radius: 10px;
  693. }
  694. .u-popup__content--round-left[data-v-05c24e9b] {
  695. border-top-left-radius: 0;
  696. border-top-right-radius: 10px;
  697. border-bottom-left-radius: 0;
  698. border-bottom-right-radius: 10px;
  699. }
  700. .u-popup__content--round-right[data-v-05c24e9b] {
  701. border-top-left-radius: 10px;
  702. border-top-right-radius: 0;
  703. border-bottom-left-radius: 10px;
  704. border-bottom-right-radius: 0;
  705. }
  706. .u-popup__content--round-bottom[data-v-05c24e9b] {
  707. border-top-left-radius: 10px;
  708. border-top-right-radius: 10px;
  709. border-bottom-left-radius: 0;
  710. border-bottom-right-radius: 0;
  711. }
  712. .u-popup__content--round-center[data-v-05c24e9b] {
  713. border-top-left-radius: 10px;
  714. border-top-right-radius: 10px;
  715. border-bottom-left-radius: 10px;
  716. border-bottom-right-radius: 10px;
  717. }
  718. .u-popup__content__close[data-v-05c24e9b] {
  719. position: absolute;
  720. }
  721. .u-popup__content__close--hover[data-v-05c24e9b] {
  722. opacity: 0.4;
  723. }
  724. .u-popup__content__close--top-left[data-v-05c24e9b] {
  725. top: 15px;
  726. left: 15px;
  727. }
  728. .u-popup__content__close--top-right[data-v-05c24e9b] {
  729. top: 15px;
  730. right: 15px;
  731. }
  732. .u-popup__content__close--bottom-left[data-v-05c24e9b] {
  733. bottom: 15px;
  734. left: 15px;
  735. }
  736. .u-popup__content__close--bottom-right[data-v-05c24e9b] {
  737. right: 15px;
  738. bottom: 15px;
  739. }
  740. /**
  741. * 这里是uni-app内置的常用样式变量
  742. *
  743. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  744. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  745. *
  746. */
  747. /**
  748. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  749. *
  750. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  751. */
  752. /* 颜色变量 */
  753. /* 行为相关颜色 */
  754. /* 文字基本颜色 */
  755. /* 背景颜色 */
  756. /* 边框颜色 */
  757. /* 尺寸变量 */
  758. /* 文字尺寸 */
  759. /* 图片尺寸 */
  760. /* Border Radius */
  761. /* 水平间距 */
  762. /* 垂直间距 */
  763. /* 透明度 */
  764. /* 文章场景相关 */
  765. /*自定义主题色 */
  766. .submitbtn[data-v-471975a0] {
  767. width: 8.125rem;
  768. margin: 0 auto;
  769. text-align: center;
  770. border-radius: 2.5rem;
  771. padding: 0.625rem 0;
  772. color: #fff;
  773. background-color: #ff5c03;
  774. }
  775. .itemanswer[data-v-471975a0] {
  776. padding: 0.625rem 0.625rem;
  777. text-align: center;
  778. border-radius: 2.5rem;
  779. border: 0.0625rem solid #dddddd;
  780. margin: 0.375rem 0;
  781. color: #555;
  782. width: calc(100% - 1.25rem);
  783. }
  784. .answeract[data-v-471975a0] {
  785. background-color: #00caa6;
  786. color: #fff;
  787. }
  788. .answerbox[data-v-471975a0] {
  789. width: 18.75rem;
  790. border-radius: 0.625rem;
  791. }
  792. .welcome-message[data-v-471975a0] {
  793. position: fixed;
  794. width: 100%;
  795. bottom: 3.75rem;
  796. left: 50%;
  797. transform: translateX(-50%);
  798. color: white;
  799. padding: 10px 20px;
  800. border-radius: 20px;
  801. animation: fadeOut-471975a0 1s ease 1s forwards;
  802. /* 1秒后开始淡出 */
  803. z-index: 1000;
  804. }
  805. @keyframes fadeOut-471975a0 {
  806. from {
  807. opacity: 1;
  808. }
  809. to {
  810. opacity: 0;
  811. }
  812. }
  813. .container[data-v-471975a0] {
  814. position: relative;
  815. width: 100%;
  816. height: 100vh;
  817. /* 或者你需要的任何高度 */
  818. overflow: hidden;
  819. }
  820. .talktext[data-v-471975a0] {
  821. border-radius: 0.25rem;
  822. background-color: rgba(255, 255, 255, 0.1);
  823. }
  824. .talktext uni-view[data-v-471975a0] {
  825. width: 100%;
  826. }
  827. .talk-list[data-v-471975a0] {
  828. border-radius: 0.9375rem;
  829. background-color: rgba(255, 255, 255, 0.1);
  830. padding: 0.3125rem 0.9375rem;
  831. }
  832. .zoom-button-active[data-v-471975a0] {
  833. transform: scale(1.5);
  834. /* 放大 1.2 倍 */
  835. }
  836. .background-image[data-v-471975a0] {
  837. position: absolute;
  838. top: 0;
  839. left: -1.25rem;
  840. width: 110%;
  841. height: 110%;
  842. object-fit: cover;
  843. /* 确保背景图覆盖整个容器 */
  844. filter: blur(20px);
  845. /* 设置模糊效果,10px为模糊半径,你可以根据需要调整 */
  846. z-index: 0;
  847. /* 确保背景图在内容之下 */
  848. }
  849. .background-images[data-v-471975a0] {
  850. position: absolute;
  851. top: 0;
  852. left: -1.25rem;
  853. width: 110%;
  854. height: 110%;
  855. object-fit: cover;
  856. /* 确保背景图覆盖整个容器 */
  857. filter: blur(20px);
  858. /* 设置模糊效果,10px为模糊半径,你可以根据需要调整 */
  859. z-index: 6;
  860. /* 确保背景图在内容之下 */
  861. }
  862. .blackbg[data-v-471975a0] {
  863. position: absolute;
  864. top: 0;
  865. left: 0;
  866. width: 100%;
  867. height: 100%;
  868. background: rgba(0, 0, 0, 0.7);
  869. object-fit: cover;
  870. /* 确保背景图覆盖整个容器 */
  871. filter: blur(10px);
  872. /* 设置模糊效果,10px为模糊半径,你可以根据需要调整 */
  873. z-index: 1;
  874. /* 确保背景图在内容之下 */
  875. }
  876. .content[data-v-471975a0] {
  877. position: relative;
  878. z-index: 2;
  879. /* 确保内容在背景图之上 */
  880. /* 其他样式,比如文本颜色、内边距等 */
  881. height: 100%;
  882. width: 100%;
  883. top: 0;
  884. left: 0;
  885. display: flex;
  886. flex-direction: column;
  887. justify-content: space-between;
  888. }
  889. .videolist[data-v-471975a0] {
  890. position: relative;
  891. }
  892. .vedio[data-v-471975a0] {
  893. height: 15.625rem;
  894. width: 100%;
  895. background-color: rgba(0, 0, 0, 0.6);
  896. }
  897. .videotop[data-v-471975a0] {
  898. width: 100%;
  899. height: 100%;
  900. }
  901. .popup-video[data-v-471975a0] {
  902. position: absolute;
  903. top: 30%;
  904. height: 15.625rem;
  905. display: flex;
  906. flex-direction: column;
  907. align-items: center;
  908. justify-content: center;
  909. width: 100%;
  910. color: #fff;
  911. z-index: 9;
  912. }
  913. .popup-video .more[data-v-471975a0] {
  914. background-color: #3280fe;
  915. border-radius: 2.5rem;
  916. width: 8.75rem;
  917. text-align: center;
  918. height: 1.875rem;
  919. line-height: 1.875rem;
  920. }
  921. .icon-bg[data-v-471975a0] {
  922. background-color: rgba(255, 255, 255, 0.2);
  923. border-radius: 50%;
  924. width: 2.5rem;
  925. height: 2.5rem;
  926. display: flex;
  927. justify-content: center;
  928. align-items: center;
  929. transition: transform 0.2s ease;
  930. /* 添加过渡效果 */
  931. }
  932. .list[data-v-471975a0] {
  933. width: 80%;
  934. margin-bottom: 0.625rem;
  935. animation: xxxawdawd-471975a0 0.2s;
  936. }
  937. @keyframes xxxawdawd-471975a0 {
  938. from {
  939. margin-top: 0;
  940. opacity: 0;
  941. }
  942. to {
  943. margin-top: 0.625rem;
  944. opacity: 1;
  945. }
  946. }