Mine.wxss 9.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531
  1. .container {
  2. background-color: #F6F7F8;
  3. height: 100vh;
  4. }
  5. .userInfoBox {
  6. height: 280rpx;
  7. width: 100%;
  8. background-color: #3e6ffd;
  9. }
  10. .userHeader {
  11. padding: 30rpx 30rpx 40rpx;
  12. font-size: 0;
  13. }
  14. .userImg {
  15. display: inline-block;
  16. width: 100rpx;
  17. height: 100rpx;
  18. vertical-align: middle;
  19. margin-right: 20rpx;
  20. border-radius: 10rpx;
  21. }
  22. .userNameBox {
  23. display: inline-block;
  24. width: calc(100% - 120rpx);
  25. vertical-align: middle;
  26. position: relative;
  27. border-radius: 50rpx;
  28. }
  29. .userName {
  30. width: calc(100%);
  31. vertical-align: middle;
  32. font-size: 28rpx;
  33. color: #fff;
  34. }
  35. .loginBtn {
  36. width: 230rpx;
  37. text-align: center;
  38. background-color: #07c160;
  39. color: #fff;
  40. font-size: 24rpx;
  41. border-radius: 50rpx;
  42. height: 50rpx;
  43. line-height: 50rpx;
  44. margin-left: 0;
  45. margin-top: 20rpx;
  46. }
  47. .userNumBox {
  48. display: flex;
  49. justify-content: space-around;
  50. }
  51. .userNumItem {
  52. text-align: center;
  53. }
  54. .userNum {
  55. display: block;
  56. font-size: 28rpx;
  57. color: #fff;
  58. margin-bottom: 20rpx;
  59. }
  60. .userNumTitle {
  61. display: block;
  62. font-size: 24rpx;
  63. color: #fff;
  64. }
  65. .userOrderBox {
  66. margin: 30rpx 20rpx;
  67. background-color: #fff;
  68. box-shadow: 0rpx 5rpx 10rpx 0rpx #0587e21c;
  69. border-radius: 20rpx;
  70. }
  71. .orderTitle {
  72. padding: 40rpx 20rpx 30rpx;
  73. border-bottom: 2rpx #f2f2f2 solid;
  74. }
  75. .orderTitleText {
  76. display: inline-block;
  77. vertical-align: middle;
  78. width: calc(100% - 160rpx);
  79. color: #333333;
  80. font-size: 30rpx;
  81. font-weight: 600;
  82. overflow: hidden;
  83. white-space: nowrap;
  84. text-overflow: ellipsis;
  85. }
  86. .orderTitleMore {
  87. display: inline-block;
  88. vertical-align: middle;
  89. width: 160rpx;
  90. color: #999999;
  91. font-size: 22rpx;
  92. text-align: right;
  93. }
  94. .orderContent {
  95. display: flex;
  96. justify-content: space-around;
  97. padding: 30rpx 0;
  98. }
  99. .orderContentItem {
  100. text-align: center;
  101. }
  102. .orderContentItemNum {
  103. display: block;
  104. font-size: 32rpx;
  105. font-weight: bold;
  106. color: #000;
  107. margin-bottom: 30rpx;
  108. }
  109. .orderContentItemTitle {
  110. display: block;
  111. font-size: 24rpx;
  112. color: #333;
  113. }
  114. .moreServiceBox {
  115. margin: 30rpx 20rpx;
  116. background-color: #fff;
  117. box-shadow: 0rpx 5rpx 10rpx 0rpx #0587e21c;
  118. border-radius: 20rpx;
  119. }
  120. .moreServiceTitle {
  121. padding: 40rpx 20rpx 20rpx;
  122. vertical-align: middle;
  123. color: #333333;
  124. font-size: 30rpx;
  125. font-weight: 600;
  126. }
  127. .moreServiceContent {
  128. padding: 0 20rpx 20rpx;
  129. }
  130. .serviceContentItem {
  131. padding: 20rpx 0;
  132. }
  133. .serviceContentItem + .serviceContentItem {
  134. border-top: 2rpx #f2f2f2 solid;
  135. }
  136. .serviceContentItemImg {
  137. display: inline-block;
  138. width: 60rpx;
  139. height: 60rpx;
  140. vertical-align: middle;
  141. margin-right: 20rpx;
  142. }
  143. .serviceContentItemTitle {
  144. display: inline-block;
  145. vertical-align: middle;
  146. width: calc(100% - 110rpx);
  147. color: #333;
  148. font-size: 28rpx;
  149. }
  150. .serviceContentItemIcon {
  151. display: inline-block;
  152. width: 30rpx;
  153. height: 30rpx;
  154. vertical-align: middle;
  155. text-align: right;
  156. }
  157. /* 自定提示弹窗 */
  158. .popMask {
  159. position: fixed;
  160. left: 0;
  161. top: 0;
  162. right: 0;
  163. bottom: 0;
  164. display: flex;
  165. justify-content: center;
  166. align-items: center;
  167. background-color: rgba(0, 0, 0, 0.2);
  168. line-height: 1 !important;
  169. z-index: 99;
  170. }
  171. .popContent {
  172. width: 80%;
  173. line-height: 1 !important;
  174. }
  175. .popTips {
  176. width: 100%;
  177. font-size: 36rpx;
  178. color: #333;
  179. font-weight: bold;
  180. text-align: center;
  181. padding: 30rpx 0;
  182. line-height: 1 !important;
  183. background-color: #fff;
  184. border-radius: 30rpx 30rpx 0 0;
  185. }
  186. .popImg {
  187. width: 100%;
  188. height: 600rpx;
  189. border-radius: 0 0 30rpx 30rpx;
  190. }
  191. .popClose {
  192. margin-top: 30rpx;
  193. width: 80rpx;
  194. height: 80rpx;
  195. margin-left: calc(50% - 40rpx);
  196. }
  197. .popBody {
  198. width: calc(100% - 40rpx);
  199. padding: 20rpx 20rpx 30rpx;
  200. font-size: 32rpx;
  201. color: #333;
  202. line-height: 1.5 !important;
  203. background-color: #fff;
  204. }
  205. .fway-form-input {
  206. display: block;
  207. height: 66rpx;
  208. line-height: 66rpx;
  209. width: calc(100% - 20rpx);
  210. text-align: center;
  211. padding: 0 10rpx;
  212. font-size: 28rpx;
  213. background-color: #f7f7f7;
  214. white-space: nowrap;
  215. overflow-y: hidden;
  216. border-radius: 10rpx;
  217. }
  218. .bindedTips {
  219. width: calc(100%);
  220. line-height: 40rpx;
  221. font-size: 28rpx;
  222. text-align: center;
  223. }
  224. .errorTips {
  225. width: calc(100%);
  226. line-height: 40rpx;
  227. padding: 10rpx 0 0;
  228. font-size: 24rpx;
  229. color: #d9001bfe;
  230. }
  231. .popBtnBox {
  232. width: 100%;
  233. display: flex;
  234. justify-content: space-between;
  235. padding: 10rpx 0;
  236. background-color: #fff;
  237. border-top: 2rpx #ebebeb solid;
  238. border-radius: 0 0 30rpx 30rpx;
  239. }
  240. .popBtn {
  241. width: 50%;
  242. padding: 20rpx 0;
  243. text-align: center;
  244. font-size: 30rpx;
  245. letter-spacing: 2rpx;
  246. line-height: 1 !important;
  247. }
  248. .popBtn + .popBtn {
  249. border-left: 2rpx #ebebeb solid;
  250. }
  251. .loginPopBtn {
  252. width: 90%;
  253. text-align: center;
  254. background-color: #07c160;
  255. color: #fff;
  256. font-size: 28rpx;
  257. border-radius: 50rpx;
  258. line-height: 2.5;
  259. margin-left: 5%;
  260. margin-bottom: 30rpx;
  261. }
  262. .container {
  263. background-color: #F6F7F8;
  264. height: calc(100vh - 340rpx);
  265. }
  266. .userInfoBox {
  267. height: 380rpx;
  268. width: 100%;
  269. background-color: #3e6ffd;
  270. position: absolute;
  271. top: 0;
  272. left: 0;
  273. }
  274. .userHeader {
  275. padding: 30rpx 30rpx 40rpx;
  276. font-size: 0;
  277. }
  278. .userImg {
  279. display: inline-block;
  280. width: 160rpx;
  281. height: 160rpx;
  282. vertical-align: middle;
  283. margin-right: 20rpx;
  284. border-radius: 10rpx;
  285. }
  286. .userNameBox {
  287. display: inline-block;
  288. width: calc(100% - 180rpx);
  289. vertical-align: middle;
  290. position: relative;
  291. border-radius: 50rpx;
  292. }
  293. .userName {
  294. width: calc(100%);
  295. vertical-align: middle;
  296. font-size: 36rpx;
  297. color: #fff;
  298. }
  299. .loginBtn {
  300. width: 300rpx;
  301. text-align: center;
  302. background-color: #07c160;
  303. color: #fff;
  304. font-size: 32rpx;
  305. border-radius: 50rpx;
  306. height: 70rpx;
  307. line-height: 70rpx;
  308. margin-left: 0;
  309. margin-top: 40rpx;
  310. }
  311. .userNumBox {
  312. display: flex;
  313. justify-content: space-around;
  314. }
  315. .userNumItem {
  316. text-align: left;
  317. }
  318. .userNum {
  319. display: block;
  320. font-size: 40rpx;
  321. color: #fff;
  322. margin-bottom: 20rpx;
  323. }
  324. .userNumTitle {
  325. display: block;
  326. font-size: 34rpx;
  327. color: #fff;
  328. }
  329. .userOrderBox {
  330. margin: 340rpx 20rpx 30rpx;
  331. background-color: #fff;
  332. box-shadow: 0rpx 5rpx 10rpx 0rpx #0587e21c;
  333. border-radius: 20rpx;
  334. z-index: 99;
  335. position: relative;
  336. }
  337. .orderTitle {
  338. padding: 30rpx;
  339. border-bottom: 2rpx #f2f2f2 solid;
  340. }
  341. .orderTitleText {
  342. display: inline-block;
  343. vertical-align: middle;
  344. width: calc(100% - 200rpx);
  345. color: #000;
  346. font-size: 38rpx;
  347. font-weight: 600;
  348. overflow: hidden;
  349. white-space: nowrap;
  350. text-overflow: ellipsis;
  351. }
  352. .orderTitleMore {
  353. display: inline-block;
  354. vertical-align: middle;
  355. width: 200rpx;
  356. color: #777;
  357. font-size: 32rpx;
  358. text-align: right;
  359. }
  360. .orderContent {
  361. display: flex;
  362. justify-content: space-around;
  363. padding: 30rpx 0;
  364. }
  365. .orderContentItem {
  366. text-align: center;
  367. }
  368. .orderContentItemNum {
  369. display: block;
  370. font-size: 40rpx;
  371. font-weight: bold;
  372. color: #000;
  373. margin-bottom: 30rpx;
  374. }
  375. .orderContentItemTitle {
  376. display: block;
  377. font-size: 34rpx;
  378. color: #000;
  379. }
  380. .moreServiceBox {
  381. margin: 30rpx 20rpx;
  382. background-color: #fff;
  383. box-shadow: 0rpx 5rpx 10rpx 0rpx #0587e21c;
  384. border-radius: 20rpx;
  385. z-index: 99;
  386. position: relative;
  387. }
  388. .moreServiceTitle {
  389. padding: 40rpx 20rpx 20rpx;
  390. vertical-align: middle;
  391. color: #000;
  392. font-size: 38rpx;
  393. font-weight: 600;
  394. }
  395. .moreServiceContent {
  396. padding: 0 20rpx 20rpx;
  397. }
  398. .serviceContentItem {
  399. padding: 20rpx 0;
  400. }
  401. .serviceContentItem + .serviceContentItem {
  402. border-top: 2rpx #f2f2f2 solid;
  403. }
  404. .serviceContentItemImg {
  405. display: inline-block;
  406. width: 60rpx;
  407. height: 60rpx;
  408. vertical-align: middle;
  409. margin-right: 20rpx;
  410. }
  411. .serviceContentItemTitle {
  412. display: inline-block;
  413. vertical-align: middle;
  414. width: calc(100% - 120rpx);
  415. color: #000;
  416. font-size: 36rpx;
  417. }
  418. .serviceContentItemIcon {
  419. display: inline-block;
  420. width: 40rpx;
  421. height: 40rpx;
  422. vertical-align: middle;
  423. text-align: right;
  424. }
  425. /* 自定提示弹窗 */
  426. .popMask {
  427. position: fixed;
  428. left: 0;
  429. top: 0;
  430. right: 0;
  431. bottom: 0;
  432. display: flex;
  433. justify-content: center;
  434. align-items: center;
  435. background-color: rgba(0, 0, 0, 0.2);
  436. line-height: 1 !important;
  437. z-index: 99;
  438. }
  439. .popContent {
  440. width: 80%;
  441. line-height: 1 !important;
  442. }
  443. .popTips {
  444. width: 100%;
  445. font-size: 44rpx;
  446. color: #333;
  447. font-weight: bold;
  448. text-align: center;
  449. padding: 30rpx 0;
  450. line-height: 1 !important;
  451. background-color: #fff;
  452. border-radius: 30rpx 30rpx 0 0;
  453. }
  454. .popImg {
  455. width: 100%;
  456. height: 600rpx;
  457. border-radius: 0 0 30rpx 30rpx;
  458. }
  459. .popClose {
  460. margin-top: 30rpx;
  461. width: 100rpx;
  462. height: 100rpx;
  463. margin-left: calc(50% - 50rpx);
  464. }
  465. .popBody {
  466. width: calc(100% - 40rpx);
  467. padding: 20rpx 20rpx 30rpx;
  468. font-size: 36rpx;
  469. color: #333;
  470. line-height: 1.5 !important;
  471. background-color: #fff;
  472. }
  473. .fway-form-input {
  474. display: block;
  475. height: 90rpx;
  476. line-height: 90rpx;
  477. width: calc(100% - 20rpx);
  478. text-align: center;
  479. padding: 0 10rpx;
  480. font-size: 36rpx;
  481. background-color: #f7f7f7;
  482. white-space: nowrap;
  483. overflow-y: hidden;
  484. border-radius: 10rpx;
  485. }
  486. .bindedTips {
  487. width: calc(100%);
  488. line-height: 40rpx;
  489. font-size: 36rpx;
  490. text-align: center;
  491. }
  492. .errorTips {
  493. width: calc(100%);
  494. line-height: 40rpx;
  495. padding: 30rpx 0 0;
  496. font-size: 32rpx;
  497. color: #d9001bfe;
  498. }
  499. .popBtnBox {
  500. width: 100%;
  501. display: flex;
  502. justify-content: space-between;
  503. padding: 10rpx 0;
  504. background-color: #fff;
  505. border-top: 2rpx #ebebeb solid;
  506. border-radius: 0 0 30rpx 30rpx;
  507. }
  508. .popBtn {
  509. width: 50%;
  510. padding: 20rpx 0;
  511. text-align: center;
  512. font-size: 36rpx;
  513. letter-spacing: 2rpx;
  514. line-height: 1 !important;
  515. }
  516. .popBtn + .popBtn {
  517. border-left: 2rpx #ebebeb solid;
  518. }
  519. .loginPopBtn {
  520. width: 90%;
  521. text-align: center;
  522. background-color: #07c160;
  523. color: #fff;
  524. font-size: 32rpx;
  525. border-radius: 50rpx;
  526. line-height: 2.5;
  527. margin-left: 5%;
  528. margin-bottom: 30rpx;
  529. }