terminal.wxss 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370
  1. .data-v-26d32206 ax-custom-title {
  2. z-index: 9999 !important;
  3. }
  4. .page-background.data-v-26d32206{
  5. display: block;
  6. position: fixed;
  7. top: 0;
  8. left: 0;
  9. width: 100%;
  10. height: 100%;
  11. }
  12. .body.data-v-26d32206{
  13. width: 100%;
  14. height: 100%;
  15. overflow: auto;
  16. padding-bottom: 130px;
  17. position: relative;
  18. z-index: 1;
  19. }
  20. .body.data-v-26d32206::-webkit-scrollbar{
  21. display: none;
  22. }
  23. .body.visit.data-v-26d32206{
  24. padding-bottom: 0px;
  25. }
  26. .block.data-v-26d32206{
  27. padding: 0 10px;
  28. }
  29. .block + .block.data-v-26d32206{
  30. margin-top: 10px;
  31. }
  32. /* 主图 */
  33. .host-graph.data-v-26d32206{
  34. display: block;
  35. position: fixed;
  36. top: 100rpx;
  37. left: 0;
  38. width: 100%;
  39. height: 100%;
  40. z-index: 100;
  41. }
  42. /* 主参数 */
  43. .parameter.data-v-26d32206{
  44. display: flex;
  45. align-items: center;
  46. justify-content: space-between;
  47. padding: 0 10px;
  48. margin: 0 20px;
  49. margin-top: 10px;
  50. margin-bottom: 20px;
  51. }
  52. .parameter .param.data-v-26d32206{
  53. display: flex;
  54. align-items: center;
  55. justify-content: center;
  56. flex-direction: column;
  57. }
  58. .parameter .param .value.data-v-26d32206{
  59. font-size: 20px;
  60. font-weight: bold;
  61. }
  62. .parameter .param .name.data-v-26d32206{
  63. font-size: 14px;
  64. color: #aaa;
  65. margin-top: 7px;
  66. }
  67. /* 卡片 */
  68. .card.data-v-26d32206{
  69. background-color: #fff;
  70. border-radius: 8px;
  71. padding: 10px;
  72. box-shadow: 0 0 10px rgba(0,0,0,0.05);
  73. }
  74. .card .title.data-v-26d32206{
  75. display: flex;
  76. align-items: center;
  77. justify-content: space-between;
  78. font-size: 15px;
  79. font-weight: bold;
  80. padding-bottom: 10px;
  81. padding-left: 10px;
  82. border-bottom: 1px solid #ddd;
  83. }
  84. .card .title .more.data-v-26d32206{
  85. font-size: 14px;
  86. color: #aaa;
  87. font-weight: normal;
  88. }
  89. .card .title .more .icon.data-v-26d32206{
  90. margin-left: 5px;
  91. }
  92. .card .cell.data-v-26d32206{
  93. display: flex;
  94. align-items: center;
  95. justify-content: space-between;
  96. font-size: 14px;
  97. height: 32px;
  98. padding: 0 10px;
  99. }
  100. .cell .contet.data-v-26d32206{
  101. color: #aaa;
  102. }
  103. .cell .obsolete.data-v-26d32206{
  104. font-size: 12px;
  105. text-decoration: line-through;
  106. color: #aaa;
  107. margin-right: 5px;
  108. }
  109. .cell .obsolete .money.data-v-26d32206{
  110. font-size: inherit;
  111. color: inherit;
  112. font-weight: normal;
  113. }
  114. .cell .money.data-v-26d32206{
  115. font-size: 16px;
  116. font-weight: bold;
  117. color: #f44033;
  118. }
  119. /* 开关 */
  120. .switch.data-v-26d32206{
  121. display: flex;
  122. align-items: center;
  123. justify-content: space-between;
  124. width: 110px;
  125. height: 30px;
  126. font-size: 14px;
  127. border-radius: 100pc;
  128. background-color: #fff;
  129. position: relative;
  130. color: #333;
  131. }
  132. .switch > text.data-v-26d32206{
  133. flex: 1;
  134. display: flex;
  135. justify-content: center;
  136. -webkit-transform: translateY(-1px);
  137. transform: translateY(-1px);
  138. transition: all 300ms ease;
  139. position: relative;
  140. z-index: 2;
  141. }
  142. .switch.personal > text.data-v-26d32206:first-child,
  143. .switch > text.data-v-26d32206:last-child{
  144. color: #fff;
  145. }
  146. .switch.personal > text.data-v-26d32206:last-child{
  147. color: inherit;
  148. }
  149. .switch.data-v-26d32206::after{
  150. content: '';
  151. display: block;
  152. width: calc(50% - 3px);
  153. height: calc(100% - 6px);
  154. border-radius: 100pc;
  155. background-color: #3eb6f8;
  156. position: absolute;
  157. top: 3px;
  158. right: 3px;
  159. transition: all 200ms ease;
  160. }
  161. .switch.personal.data-v-26d32206::after{
  162. -webkit-transform: translateX(-100%);
  163. transform: translateX(-100%);
  164. }
  165. /* 提示 */
  166. .tips.data-v-26d32206{
  167. font-size: 14px;
  168. margin-top: 10px;
  169. padding: 0 10px;
  170. }
  171. /* 优惠券 */
  172. .coupon.data-v-26d32206{
  173. --coupon-height: 80px;
  174. --coupon-cut-size: 16px;
  175. display: flex;
  176. align-items: center;
  177. width: 100%;
  178. height: var(--coupon-height);
  179. padding: 5px;
  180. border-radius: 8px;
  181. background-color: #3eb6f8;
  182. margin-top: 10px;
  183. }
  184. .coupon .name.data-v-26d32206{
  185. padding: 0 10px;
  186. }
  187. .coupon .info.data-v-26d32206{
  188. flex: 1;
  189. display: flex;
  190. align-items: center;
  191. justify-content: center;
  192. flex-direction: column;
  193. }
  194. .coupon .info .value.data-v-26d32206{
  195. font-size: 30px;
  196. font-weight: bold;
  197. }
  198. .coupon .info .describe.data-v-26d32206{
  199. font-size: 12px;
  200. }
  201. .coupon .feature.data-v-26d32206{
  202. display: block;
  203. position: relative;
  204. width: var(--coupon-cut-size);
  205. height: var(--coupon-height);
  206. overflow: hidden;
  207. }
  208. .coupon .feature .line.data-v-26d32206{
  209. display: block;
  210. width: 1px;
  211. position: absolute;
  212. left: 50%;
  213. top: var(--coupon-cut-size);
  214. bottom: var(--coupon-cut-size);
  215. border-left: 1px dashed #fff;
  216. }
  217. .coupon .feature.data-v-26d32206::after,
  218. .coupon .feature.data-v-26d32206::before{
  219. content: '';
  220. display: block;
  221. width: var(--coupon-cut-size);
  222. height: var(--coupon-cut-size);
  223. border-radius: 100pc;
  224. background-color: #fff;
  225. position: absolute;
  226. }
  227. .coupon .feature.data-v-26d32206::before{
  228. top: 0;
  229. -webkit-transform: translateY(-50%);
  230. transform: translateY(-50%);
  231. }
  232. .coupon .feature.data-v-26d32206::after{
  233. bottom: 0;
  234. -webkit-transform: translateY(50%);
  235. transform: translateY(50%);
  236. }
  237. .coupon.personal.data-v-26d32206{
  238. background-color: #ff7043;
  239. color: #fff;
  240. }
  241. /* 主信息 */
  242. .footer.data-v-26d32206{
  243. display: flex;
  244. flex-direction: column;
  245. background-color: #fff;
  246. border-radius: 16px 16px 0 0;
  247. height: 120px;
  248. padding: 10px;
  249. position: fixed;
  250. left: 0;
  251. right: 0;
  252. bottom: 0;
  253. box-shadow: 0 0 10px rgba(0,0,0,0.1);
  254. z-index: 99999;
  255. }
  256. .footer .tips.data-v-26d32206{
  257. flex: 1;
  258. display: flex;
  259. align-items: center;
  260. justify-content: center;
  261. font-size: 12px;
  262. color: #aaa;
  263. margin-bottom: 10px;
  264. }
  265. .footer .startup.data-v-26d32206{
  266. display: flex;
  267. align-items: center;
  268. justify-content: center;
  269. font-size: 14px;
  270. border-radius: 8px;
  271. height: 50px;
  272. background: linear-gradient(to right,#8FF8FB,#47AEFF);
  273. }
  274. .coupon-image-card.data-v-26d32206{
  275. display: flex;
  276. align-items: center;
  277. margin-top: 28rpx;
  278. width: 664rpx;
  279. height: 160rpx;
  280. /* background-image: url('@/static/img/coupon-gr.png'); */
  281. background-repeat: no-repeat;
  282. background-size: cover;
  283. background-position: center;
  284. }
  285. .coupon-title.data-v-26d32206{
  286. width:220rpx;
  287. text-align: center;
  288. font-weight: bold;
  289. font-size: 32rpx;
  290. color: #FFFFFF;
  291. }
  292. .price-info.data-v-26d32206{
  293. width: 270rpx;
  294. text-align: center;
  295. color: #222222;
  296. }
  297. .price-numer.data-v-26d32206{
  298. font-weight: 800;
  299. font-size: 48rpx;
  300. }
  301. .price-text.data-v-26d32206{
  302. font-size: 22rpx;
  303. }
  304. .shop-coupon-btn.data-v-26d32206{
  305. margin-left: 14rpx;
  306. width: 136rpx;
  307. height: 44rpx;
  308. border-radius: 22rpx;
  309. font-size: 24rpx;
  310. color: #FFFFFF;
  311. text-align: center;
  312. line-height: 44rpx;
  313. }
  314. .Modal-tips.data-v-26d32206{
  315. width: 514rpx;
  316. height: 528rpx;
  317. background: #FFFFFF;
  318. border-radius: 16rpx;
  319. text-align: center;
  320. padding-top: 40rpx;
  321. }
  322. .tips-icon.data-v-26d32206{
  323. margin: auto;
  324. width: 116rpx;
  325. height: 116rpx;
  326. line-height: 116rpx;
  327. font-size: 70rpx;
  328. font-weight: bold;
  329. color: #fff;
  330. border-radius: 50%;
  331. background-color: #FF4D3A ;
  332. }
  333. .icon-title.data-v-26d32206{
  334. margin-top: 24rpx;
  335. font-weight: bold;
  336. font-size: 40rpx;
  337. color: #2B303A;
  338. }
  339. .tips-text.data-v-26d32206{
  340. margin-top: 28rpx;
  341. font-size: 28rpx;
  342. color: #2B303A;
  343. }
  344. .tips-btn.data-v-26d32206{
  345. margin-top:60rpx;
  346. display: flex;
  347. align-items: center;
  348. gap: 20rpx;
  349. justify-content: center;
  350. }
  351. .cancel-btn.data-v-26d32206{
  352. width: 224rpx;
  353. height: 80rpx;
  354. background: #F0F0F0;
  355. border-radius: 40rpx;
  356. line-height: 80rpx;
  357. font-size: 28rpx;
  358. color: #AAAAAA;
  359. }
  360. .confirm-btn.data-v-26d32206{
  361. width: 224rpx;
  362. height: 80rpx;
  363. background: #3EB6F8;
  364. border-radius: 40rpx;
  365. line-height: 80rpx;
  366. font-size: 28rpx;
  367. color: #FFFFFF;
  368. }