康巴易测肤/伤疤uniapp小程序类
Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.

404 lines
8.8KB

  1. @charset "UTF-8";
  2. /**
  3. * 这里是uni-app内置的常用样式变量
  4. *
  5. * uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
  6. * 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
  7. *
  8. */
  9. /**
  10. * 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
  11. *
  12. * 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
  13. */
  14. /* 颜色变量 */
  15. /* 行为相关颜色 */
  16. /* 文字基本颜色 */
  17. /* 背景颜色 */
  18. /* 边框颜色 */
  19. /* 尺寸变量 */
  20. /* 文字尺寸 */
  21. /* 图片尺寸 */
  22. /* Border Radius */
  23. /* 水平间距 */
  24. /* 垂直间距 */
  25. /* 透明度 */
  26. /* 文章场景相关 */
  27. .safe-area-bottom.data-v-bbde6278 {
  28. padding-bottom: env(safe-area-inset-bottom);
  29. }
  30. .modal.data-v-bbde6278 {
  31. height: 100vh;
  32. position: fixed;
  33. top: 0;
  34. right: 0;
  35. bottom: 0;
  36. left: 0;
  37. z-index: 1000;
  38. opacity: 0.1;
  39. outline: 0;
  40. text-align: center;
  41. -webkit-backface-visibility: hidden;
  42. backface-visibility: hidden;
  43. -webkit-perspective: 2000rpx;
  44. perspective: 2000rpx;
  45. pointer-events: none;
  46. overflow: hidden;
  47. }
  48. .modal .back.data-v-bbde6278 {
  49. position: absolute;
  50. top: 30rpx;
  51. left: 0;
  52. height: 60rpx;
  53. /* line-height: 60rpx; */
  54. width: 100vw;
  55. padding: 0 20rpx;
  56. z-index: 9999;
  57. display: flex;
  58. justify-content: flex-start;
  59. align-items: center;
  60. }
  61. .modal .back .back-img.data-v-bbde6278 {
  62. height: 30rpx;
  63. width: 23rpx;
  64. }
  65. .modal .back .back-text.data-v-bbde6278 {
  66. padding-left: 12rpx;
  67. font-size: 30rpx;
  68. text-align: center;
  69. font-family: Alibaba PuHuiTi;
  70. }
  71. .modal .camera-con.data-v-bbde6278 {
  72. /* position: relative; */
  73. z-index: 9999;
  74. }
  75. .qhImage.data-v-bbde6278 {
  76. background-color: #ccc;
  77. width: 80rpx;
  78. height: 80rpx;
  79. z-index: 1001;
  80. margin: 30rpx;
  81. border-radius: 50%;
  82. padding: 16rpx;
  83. }
  84. .modal.data-v-bbde6278::before {
  85. content: "";
  86. display: inline-block;
  87. height: 100%;
  88. vertical-align: middle;
  89. }
  90. .modal.show.data-v-bbde6278 {
  91. opacity: 1;
  92. overflow-x: hidden;
  93. overflow-y: hidden;
  94. pointer-events: auto;
  95. }
  96. .modal.bottom-modal.data-v-bbde6278::before {
  97. vertical-align: bottom;
  98. }
  99. .modal.bottom-modal .dialog.data-v-bbde6278 {
  100. width: 100%;
  101. border-radius: 0;
  102. }
  103. .modal.bottom-modal.data-v-bbde6278 {
  104. margin-bottom: -1000rpx;
  105. }
  106. .modal.bottom-modal.show.data-v-bbde6278 {
  107. margin-bottom: 0;
  108. }
  109. .dialog.data-v-bbde6278 {
  110. position: fixed;
  111. display: inline-block;
  112. vertical-align: middle;
  113. margin-left: auto;
  114. margin-right: auto;
  115. /* width: 680rpx; */
  116. height: 80vh;
  117. width: 100vw;
  118. max-width: 100%;
  119. background-color: #f8f8f8;
  120. border-radius: 10rpx;
  121. overflow: hidden;
  122. left: 0;
  123. top: 0;
  124. }
  125. .bar.data-v-bbde6278 {
  126. display: flex;
  127. position: relative;
  128. align-items: center;
  129. min-height: 90rpx;
  130. height: 90rpx;
  131. padding: 0rpx 40rpx;
  132. justify-content: space-between;
  133. }
  134. .bg-white.data-v-bbde6278 {
  135. background-color: #ffffff;
  136. color: #666666;
  137. }
  138. .img.data-v-bbde6278 {
  139. height: 60rpx;
  140. width: 60rpx;
  141. object-fit: contain;
  142. }
  143. .detectInfo.data-v-bbde6278 {
  144. padding: 20rpx 0rpx;
  145. font-size: 34rpx;
  146. text-align: center;
  147. -webkit-animation-duration: 1.5s;
  148. animation-duration: 1.5s;
  149. color: #000000;
  150. z-index: 999;
  151. }
  152. .faceContent.data-v-bbde6278 {
  153. height: 700rpx;
  154. position: relative;
  155. }
  156. .successImage.data-v-bbde6278 {
  157. overflow: hidden;
  158. width: 600rpx;
  159. height: 600rpx;
  160. border-radius: 50%;
  161. position: absolute;
  162. top: 0;
  163. left: 50%;
  164. z-index: 999;
  165. -webkit-transform: translateX(-50%);
  166. transform: translateX(-50%);
  167. }
  168. .tipsTextCss.data-v-bbde6278 {
  169. -webkit-animation: 1.5s tipsTextAnimation-data-v-bbde6278;
  170. animation: 1.5s tipsTextAnimation-data-v-bbde6278;
  171. -webkit-animation-duration: 1.5s;
  172. animation-duration: 1.5s;
  173. }
  174. @-webkit-keyframes tipsTextAnimation-data-v-bbde6278 {
  175. 0% {
  176. -webkit-transform: scale(1);
  177. transform: scale(1);
  178. }
  179. 20% {
  180. -webkit-transform: scale(1.5);
  181. transform: scale(1.5);
  182. }
  183. 70% {
  184. -webkit-transform: scale(1.5);
  185. transform: scale(1.5);
  186. }
  187. 100% {
  188. -webkit-transform: scale(1);
  189. transform: scale(1);
  190. }
  191. }
  192. @keyframes tipsTextAnimation-data-v-bbde6278 {
  193. 0% {
  194. -webkit-transform: scale(1);
  195. transform: scale(1);
  196. }
  197. 20% {
  198. -webkit-transform: scale(1.5);
  199. transform: scale(1.5);
  200. }
  201. 70% {
  202. -webkit-transform: scale(1.5);
  203. transform: scale(1.5);
  204. }
  205. 100% {
  206. -webkit-transform: scale(1);
  207. transform: scale(1);
  208. }
  209. }
  210. .cover.data-v-bbde6278 {
  211. width: 100vw;
  212. height: 100vh;
  213. display: flex;
  214. flex-direction: column;
  215. /* overflow: hidden; */
  216. }
  217. .cover-bottom.data-v-bbde6278 {
  218. height: 60rpx;
  219. display: flex;
  220. justify-content: center;
  221. }
  222. .cover-item.data-v-bbde6278 {
  223. height: 60rpx;
  224. width: 100%;
  225. background-color: #FFFFFF;
  226. display: flex;
  227. justify-content: space-around;
  228. align-items: center;
  229. }
  230. .load-fail.data-v-bbde6278 {
  231. position: absolute;
  232. top: 0;
  233. left: 0;
  234. height: 100vh;
  235. width: 100vw;
  236. overflow: hidden;
  237. display: flex;
  238. justify-content: center;
  239. align-items: center;
  240. }
  241. .load-reset.data-v-bbde6278 {
  242. width: 260rpx;
  243. font-size: 28rpx;
  244. padding: 20rpx;
  245. color: #fff;
  246. background-color: #8f7aed;
  247. border-radius: 15rpx;
  248. box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(0, 0, 0, 0.2);
  249. }
  250. .camera.data-v-bbde6278 {
  251. width: 100vw;
  252. height: 100vh;
  253. -webkit-transform: scale(1.05);
  254. transform: scale(1.05);
  255. z-index: 999;
  256. overflow: hidden;
  257. }
  258. .camera-tips.data-v-bbde6278 {
  259. position: fixed;
  260. top: 50%;
  261. left: 0;
  262. height: 120rpx;
  263. width: 100%;
  264. background-color: #FFFFFF;
  265. display: flex;
  266. justify-content: space-around;
  267. align-items: center;
  268. }
  269. .camera-action.data-v-bbde6278 {
  270. position: absolute;
  271. bottom: 0;
  272. left: 0;
  273. width: 100%;
  274. display: flex;
  275. justify-content: space-around;
  276. align-items: center;
  277. z-index: 99999;
  278. overflow: hidden;
  279. background: #333;
  280. padding: 10rpx 0;
  281. }
  282. .camera-action .action .img.data-v-bbde6278 {
  283. height: 51rpx;
  284. width: 58rpx;
  285. object-fit: contain;
  286. }
  287. .camera-action .action.photoimg .img.data-v-bbde6278 {
  288. height: 161rpx;
  289. width: 161rpx;
  290. }
  291. .camera-action .action.QHimg .img.data-v-bbde6278 {
  292. height: 56rpx;
  293. width: 64rpx;
  294. }
  295. .face-con.data-v-bbde6278 {
  296. position: absolute;
  297. bottom: 22vh;
  298. left: 0;
  299. width: 100vw;
  300. z-index: 9999;
  301. display: flex;
  302. justify-content: space-between;
  303. align-items: center;
  304. flex-direction: column;
  305. }
  306. .face-con .title.data-v-bbde6278 {
  307. height: 200rpx;
  308. line-height: 200rpx;
  309. width: 100%;
  310. font-family: Alibaba PuHuiTi;
  311. font-weight: bold;
  312. font-size: 30rpx;
  313. color: #FFFFFF;
  314. text-align: center;
  315. }
  316. .face-con .face-img.data-v-bbde6278 {
  317. padding: 0 70rpx;
  318. height: 826rpx;
  319. width: calc(100vw - 140rpx);
  320. /* z-index: 9999; */
  321. object-fit: contain;
  322. }
  323. .face-tips.data-v-bbde6278 {
  324. position: absolute;
  325. bottom: 15vh;
  326. left: 0;
  327. z-index: 9999;
  328. width: 100vw;
  329. }
  330. .face-tips .title.data-v-bbde6278 {
  331. font-family: Alibaba PuHuiTi;
  332. font-weight: bold;
  333. font-size: 30rpx;
  334. color: #FFFFFF;
  335. line-height: 38rpx;
  336. }
  337. .face-tips .tips-con.data-v-bbde6278 {
  338. padding: 0 100rpx 0 100rpx;
  339. }
  340. .face-tips .tips-con .tips-list.data-v-bbde6278 {
  341. width: 100%;
  342. display: flex;
  343. justify-content: flex-start;
  344. align-items: center;
  345. flex-wrap: nowrap;
  346. }
  347. .face-tips .tips-con .tips-list .item.data-v-bbde6278 {
  348. height: 120rpx;
  349. width: 30%;
  350. padding: 30rpx 0 0 0;
  351. /* margin-top: 30rpx; */
  352. display: flex;
  353. justify-content: space-between;
  354. align-items: center;
  355. flex-direction: column;
  356. margin: 0 20rpx;
  357. }
  358. .face-tips .tips-con .tips-list .item .item-img.data-v-bbde6278 {
  359. height: 100%;
  360. width: 100%;
  361. object-fit: contain;
  362. }
  363. .face-tips .tips-con .tips-list .item .item-img.phone.data-v-bbde6278 {
  364. width: 36rpx;
  365. height: 52rpx;
  366. /* padding-bottom: 25rpx; */
  367. }
  368. .face-tips .tips-con .tips-list .item .item-img.line.data-v-bbde6278 {
  369. width: 61rpx;
  370. height: 61rpx;
  371. padding-top: 10rpx;
  372. /* padding-bottom: 18rpx; */
  373. }
  374. .face-tips .tips-con .tips-list .item .item-img.smile.data-v-bbde6278 {
  375. width: 56rpx;
  376. height: 56rpx;
  377. /* padding-bottom: 24rpx; */
  378. }
  379. .face-tips .tips-con .tips-list .item .item-img.brush.data-v-bbde6278 {
  380. width: 56rpx;
  381. height: 61rpx;
  382. padding-top: 10rpx;
  383. /* padding-bottom: 12rpx; */
  384. }
  385. .face-tips .tips-con .tips-list .item .item-img.glasses.data-v-bbde6278 {
  386. width: 62rpx;
  387. height: 39rpx;
  388. padding-top: 20rpx;
  389. }
  390. .face-tips .tips-con .tips-list .item .item-img.hat.data-v-bbde6278 {
  391. width: 54rpx;
  392. height: 37rpx;
  393. padding-top: 20rpx;
  394. /* padding-bottom: 35rpx; */
  395. }
  396. .face-tips .tips-con .tips-list .item .item-text.data-v-bbde6278 {
  397. width: auto;
  398. font-family: Alibaba PuHuiTi;
  399. font-weight: bold;
  400. font-size: 24rpx;
  401. color: #FFFFFF;
  402. line-height: 38rpx;
  403. }