wallet.wxss 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
  1. @charset "UTF-8";
  2. /* 页面左右间距 */
  3. /* 文字尺寸 */
  4. /*文字颜色*/
  5. /* 边框颜色 */
  6. /*颜色*/
  7. /* 图片加载中颜色 */
  8. /* 行为相关颜色 */
  9. /* 功能栏字体大小 */
  10. /*功能栏左侧小图标*/
  11. page {
  12. background-color: #fff;
  13. height: auto;
  14. min-height: 100%;
  15. }
  16. .top-bg {
  17. background-color: #ee2f72;
  18. height: 180rpx;
  19. width: 750rpx;
  20. }
  21. .yue-wrap {
  22. width: 670rpx;
  23. height: 320rpx;
  24. margin: -160rpx auto 30rpx;
  25. background: linear-gradient(-70deg, #ff77a7, #ff4a8a);
  26. box-shadow: 0px 15rpx 22rpx 6rpx rgba(238, 47, 114, 0.1);
  27. border-radius: 25rpx;
  28. color: #fff;
  29. font-size: 26rpx;
  30. padding: 50rpx 75rpx;
  31. flex-direction: column;
  32. justify-content: space-between;
  33. align-items: flex-start;
  34. }
  35. .yue-wrap .yue-tit {
  36. width: 100%;
  37. }
  38. .yue-wrap .cz image {
  39. width: 13rpx;
  40. margin-left: 10rpx;
  41. }
  42. .yue-wrap .tx image {
  43. width: 13rpx;
  44. margin-left: 10rpx;
  45. }
  46. .yue-wrap .yue-num {
  47. width: 100%;
  48. justify-content: space-between;
  49. }
  50. .yue-wrap .yue-num .yue {
  51. font-size: 76rpx;
  52. font-weight: bold;
  53. }
  54. .yue-wrap .yue-num .cz image {
  55. width: 13rpx;
  56. margin-left: 10rpx;
  57. }
  58. .yue-wrap .lj-wrap {
  59. width: 100%;
  60. justify-content: space-between;
  61. font-size: 24rpx;
  62. }
  63. .jl {
  64. width: 670rpx;
  65. margin: 0 auto 20rpx;
  66. padding: 35rpx 30rpx;
  67. background: #ffffff;
  68. box-shadow: 0px 0px 28px 0px rgba(48, 48, 48, 0.1);
  69. border-radius: 8px;
  70. }
  71. .jl .jl-tit {
  72. width: 100%;
  73. font-size: 28rpx;
  74. font-weight: bold;
  75. color: #333333;
  76. }
  77. .jl .jl-tit .tit {
  78. max-width: 450rpx;
  79. }
  80. .jl .jl-tit .price {
  81. font-size: 38rpx;
  82. font-weight: bold;
  83. }
  84. .jl .jl-tit .add {
  85. color: #ee2f72;
  86. }
  87. .jl .jl-tit .add::before {
  88. content: '+';
  89. font-size: 28rpx;
  90. color: #ee2f72;
  91. }
  92. .jl .jl-tit .jian {
  93. color: #808080;
  94. }
  95. .jl .jl-tit .jian::before {
  96. content: '-';
  97. font-size: 28rpx;
  98. }
  99. .jl .jl-mark {
  100. padding-top: 20rpx;
  101. width: 100%;
  102. font-size: 24rpx;
  103. font-weight: 500;
  104. color: #808080;
  105. align-items: flex-start;
  106. }
  107. .jl .jl-mark .mark {
  108. max-width: 470rpx;
  109. }
  110. .hx-wrapper {
  111. width: 536rpx;
  112. height: 630rpx;
  113. position: relative;
  114. }
  115. .hx-wrapper .hx-img {
  116. width: 536rpx;
  117. height: 281rpx;
  118. }
  119. .hx-wrapper .hx-img image {
  120. width: 536rpx;
  121. height: 281rpx;
  122. }
  123. .hx-wrapper .hx-close {
  124. position: absolute;
  125. left: 243rpx;
  126. bottom: -80rpx;
  127. width: 52rpx;
  128. height: 52rpx;
  129. }
  130. .hx-wrapper .hx-close image {
  131. width: 52rpx;
  132. height: 52rpx;
  133. }
  134. .hx-wrapper .hx-body {
  135. width: 536rpx;
  136. height: 349rpx;
  137. background-color: #fff;
  138. border-radius: 0 0 10rpx 10rpx;
  139. }
  140. .hx-wrapper .hx-body .hx-title {
  141. width: 536rpx;
  142. font-size: 36rpx;
  143. font-weight: 500;
  144. color: #333333;
  145. line-height: 1;
  146. padding-top: 42rpx;
  147. text-align: center;
  148. }
  149. .hx-wrapper .hx-body input {
  150. width: 439rpx;
  151. height: 68rpx;
  152. background: #eeddde;
  153. border-radius: 10rpx;
  154. margin: 39rpx auto 0;
  155. padding-left: 26rpx;
  156. }
  157. .hx-wrapper .hx-body input .hx-placeholder {
  158. font-size: 26rpx;
  159. font-weight: 500;
  160. color: #ee2f72;
  161. }
  162. .hx-wrapper .hx-body .hx-btn {
  163. margin: 44rpx auto 0;
  164. width: 353rpx;
  165. height: 71rpx;
  166. background: #ee2f72;
  167. border-radius: 34rpx;
  168. font-size: 36rpx;
  169. font-weight: 500;
  170. color: #f8f9f9;
  171. line-height: 71rpx;
  172. text-align: center;
  173. }