You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

302 lines
4.8 KiB

  1. /* pages/couponRecord/index.wxss */
  2. page {
  3. background: #f6f6f6;
  4. }
  5. .head {
  6. height: 227rpx;
  7. width: 681rpx;
  8. margin: 40rpx auto 0;
  9. position: relative;
  10. }
  11. picker {
  12. width: 180rpx;
  13. text-align:center;
  14. height: 45rpx;
  15. font-size: 30rpx;
  16. overflow: hidden;
  17. color: rgba(85, 85, 85, 1);
  18. margin: 0 auto;
  19. }
  20. .head image {
  21. position: absolute;
  22. width: 100%;
  23. height: 100% !important;
  24. left: 0;
  25. right: 0;
  26. top: 0;
  27. bottom: 0;
  28. z-index: 1;
  29. }
  30. .time {
  31. position: relative;
  32. display: flex;
  33. flex: 2.5;
  34. text-align: center;
  35. z-index: 10;
  36. align-items: center;
  37. }
  38. .time >view:nth-of-type(1), .time >view:nth-of-type(3) {
  39. flex: 1;
  40. }
  41. .time >view:nth-of-type(2) {
  42. flex: 0.5;
  43. }
  44. .time >view text {
  45. display: block;
  46. }
  47. .time >view text:nth-of-type(2n+1) {
  48. margin-top: 69rpx;
  49. }
  50. .time >view text:nth-of-type(2n+1) {
  51. color: #999;
  52. font-size: 26rpx;
  53. margin-bottom: 24rpx;
  54. }
  55. .time >view text:nth-of-type(2n) {
  56. color: rgba(153, 153, 153, 1);
  57. font-size: 32rpx;
  58. margin-top: 34rpx;
  59. }
  60. .btn {
  61. background: #51a0fc;
  62. height: 76rpx;
  63. line-height: 76rpx;
  64. display: block;
  65. width: 681rpx;
  66. margin: 0 auto;
  67. border-top-left-radius: 0 !important;
  68. border-top-right-radius: 0 !important;
  69. border-bottom-left-radius: 16rpx;
  70. border-bottom-right-radius: 16rpx;
  71. color: #fff;
  72. font-size: 30rpx;
  73. box-shadow: 0 9rpx 16rpx 0 rgba(81, 160, 252, 0.57);
  74. }
  75. button::after {
  76. border: none;
  77. }
  78. .active {
  79. opacity: 0.6;
  80. }
  81. .acount {
  82. width: 630rpx;
  83. display: flex;
  84. margin: 30rpx auto 0;
  85. padding: 35rpx 0;
  86. flex: 2;
  87. text-align: center;
  88. border-top: 1px solid #e3f0ff;
  89. }
  90. .acount>view {
  91. flex: 1;
  92. }
  93. .acount>view text {
  94. display: block;
  95. color: #999;
  96. font-size: 26rpx;
  97. }
  98. .acount>view text:nth-of-type(2n) {
  99. color: #333;
  100. font-size: 40rpx;
  101. margin-top: 20rpx;
  102. }
  103. .content {
  104. position: relative;
  105. padding: 15rpx 35rpx 20rpx;
  106. background: #fff;
  107. border-bottom: 1px solid #eaeaea;
  108. }
  109. .contentL {
  110. position: relative;
  111. padding: 25rpx;
  112. background: #fff;
  113. width: 85%;
  114. border-radius: 16rpx;
  115. margin: 30rpx auto;
  116. /* box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.1); */
  117. }
  118. .contentL>view {
  119. height: 60rpx;
  120. line-height: 60rpx;
  121. font-size: 30rpx;
  122. }
  123. .contentL>view:nth-child(2){
  124. color: rgba(153,153,153,1);
  125. }
  126. .contentL>view>text {
  127. font-size: 28rpx;
  128. }
  129. .contentL>view>text:nth-child(1) {
  130. width: 460rpx;
  131. overflow: hidden;
  132. text-overflow:ellipsis;
  133. white-space: nowrap;
  134. }
  135. .contentL>view>text:nth-child(2) {
  136. width:160rpx;
  137. overflow: hidden;
  138. text-overflow:ellipsis;
  139. white-space: nowrap;
  140. text-align: right;
  141. }
  142. .content>view:nth-child(1){
  143. font-size: 28rpx;
  144. }
  145. .contentL>view:nth-child(2),.content>view:nth-child(2),.content>view:nth-child(3) {
  146. display: flex;
  147. justify-content: space-between;
  148. }
  149. .content>view:nth-child(2)>text,.content>view:nth-child(3)>text {
  150. font-size: 26rpx;
  151. font-family: PingFang-SC-Bold;
  152. color: rgba(153, 153, 153, 1);
  153. }
  154. .nocontent {
  155. text-align: center;
  156. font-size: 30rpx;
  157. padding: 30rpx 0;
  158. }
  159. .contents {
  160. margin-top: 30rpx;
  161. }
  162. .contentL>view:nth-child(1){
  163. display: flex;
  164. justify-content: space-between;
  165. }
  166. .content .fr text:nth-of-type(1) {
  167. margin-top: 36rpx;
  168. }
  169. .content .fr text:nth-of-type(1), .content .fr text:nth-of-type(3) {
  170. color:rgba(51,51,51,1);
  171. display: block;
  172. font-size: 34rpx;
  173. }
  174. .content .fr text:nth-of-type(2) {
  175. display: block;
  176. }
  177. .img {
  178. display: block;
  179. width: 100%;
  180. }
  181. .title {
  182. display: block;
  183. text-align: center;
  184. color: rgba(153, 153, 153, 1);
  185. font-size: 26rpx;
  186. }
  187. .total {
  188. display: block;
  189. text-align: center;
  190. font-size: 70rpx;
  191. margin: 36rpx 0;
  192. font-family: PingFang-SC-Bold;
  193. font-weight: bold;
  194. color: rgba(51, 51, 51, 1);
  195. }
  196. .acounts {
  197. width: 680rpx;
  198. margin: 48rpx auto 48rpx;
  199. border: 1px solid #51a0fc;
  200. border-radius: 16rpx;
  201. padding: 40rpx 0 0;
  202. background: #fff;
  203. }
  204. .daishou{
  205. width: 133rpx;
  206. height: 79rpx;
  207. position: absolute;
  208. top: 0;
  209. bottom: 0;
  210. right:264rpx;
  211. margin: auto;
  212. }
  213. .date-t{
  214. font-size:26rpx;
  215. font-family:PingFang-SC-Regular;
  216. font-weight:400;
  217. color:rgba(153,153,153,1);
  218. line-height:44rpx;
  219. padding:0 35rpx;
  220. margin: 10rpx 0;
  221. }
  222. .loading{
  223. color:rgba(51,51,51,1);
  224. font-size:28rpx;
  225. line-height: 40rpx;
  226. margin:30rpx 0;
  227. text-align: center;
  228. }
  229. .tab{
  230. height: 80rpx;
  231. padding:0 25rpx;
  232. display: flex;
  233. align-items: center;
  234. justify-content: center
  235. }
  236. .tab > view{
  237. width: 35%;
  238. line-height: 80rpx;
  239. text-align: center;
  240. font-size: 28rpx;
  241. /* border: 1rpx #333 solid; */
  242. border-radius: 10rpx;
  243. }
  244. .couponsL{
  245. background: #51a0fc;
  246. color: #fff;
  247. }
  248. .couponsR{
  249. background: #FFF;
  250. color: #000;
  251. }
  252. .hide {
  253. width: 100%;
  254. height: 55rpx;
  255. line-height: 55rpx;
  256. }
  257. .hide text {
  258. color: #999;
  259. display: block;
  260. text-align: center;
  261. font-size: 28rpx;
  262. }
  263. .jiaoyi {
  264. width: 160rpx;
  265. display: block;
  266. margin: 200rpx auto 0;
  267. }
  268. .mark{
  269. background-color:rgba(0,0,0,0.08);
  270. z-index: 10;
  271. }
  272. .guoqi{
  273. color: red;
  274. z-index: 1000;
  275. }