recharge.less 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. .recharge-record__wrap {
  2. flex-direction: column;
  3. .user-account__wrap {
  4. width: 690px;
  5. height: 180px;
  6. background: linear-gradient(45deg, #fff2e2, #fff6e2);
  7. border-radius: 12px;
  8. margin: 20px auto 40px;
  9. align-items: center;
  10. padding: 0 30px 0 40px;
  11. justify-content: space-between;
  12. .account-blance {
  13. flex-direction: column;
  14. .blance-title {
  15. font-size: 36px;
  16. color: #3d2b15;
  17. font-weight: bold;
  18. }
  19. .blance-info {
  20. font-size: 30px;
  21. color: #ef5952;
  22. }
  23. }
  24. .account-pay {
  25. border-radius: 26px;
  26. background-color: #ef5952;
  27. width: 150px;
  28. height: 50px;
  29. font-size: 24px;
  30. color: #fff;
  31. line-height: 50px;
  32. text-align: center;
  33. }
  34. }
  35. .title-bar {
  36. margin: 10px 0 0 24px;
  37. font-size: 32px;
  38. }
  39. .recharge-list__wrap {
  40. border-bottom: 0;
  41. flex-direction: column;
  42. }
  43. .recharge-list {
  44. flex-direction: column;
  45. .recharge-item {
  46. justify-content: space-between;
  47. align-items: center;
  48. padding: 24px 24px 0;
  49. border-bottom: 2px solid #f7f7f7;
  50. .item-info {
  51. flex: 1;
  52. flex-direction: column;
  53. justify-content: flex-start;
  54. align-items: flex-start;
  55. .item-name,
  56. .item-number {
  57. font-size: 24px;
  58. color: #999;
  59. }
  60. .item-number {
  61. margin: 10px 0;
  62. }
  63. .item-pay {
  64. padding-bottom: 20px;
  65. text {
  66. font-size: 24px;
  67. color: #333;
  68. }
  69. .pay-number {
  70. font-size: 36px;
  71. font-weight: bold;
  72. color: #ff6060;
  73. }
  74. }
  75. }
  76. .paid {
  77. color: #999;
  78. }
  79. .item-status {
  80. font-size: 24px;
  81. color: #ff6060;
  82. }
  83. }
  84. }
  85. }