monthly.scss 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. page{
  2. background-color: #F6F6FF
  3. }
  4. .monthly {
  5. padding: 37rpx 40rpx;
  6. height: calc(100vh - 88rpx);
  7. overflow-y: scroll;
  8. .monthly-list {
  9. .monthly-list-item {
  10. overflow: hidden;
  11. width: 100%;
  12. background-color: #fff;
  13. border-radius: 15rpx;
  14. margin-bottom: 20rpx;
  15. .monthly-list-item-top {
  16. display: flex;
  17. justify-content: space-between;
  18. padding: 26rpx 39rpx;
  19. border-bottom: solid 1px #DFDFDF;
  20. .mlit-left {
  21. view {
  22. &:first-child {
  23. font-size: 32rpx;
  24. color: #3A3A3A;
  25. font-family: PingFangSC-Semibold, PingFang SC;
  26. font-weight: 600;
  27. line-height: 45rpx;
  28. }
  29. &:last-child {
  30. color: #787878;
  31. font-size: 26rpx;
  32. font-family: PingFangSC-Regular, PingFang SC;
  33. font-weight: 400;
  34. line-height: 37rpx;
  35. }
  36. }
  37. }
  38. .mlit-right {
  39. line-height: 50rpx;
  40. text-align: center;
  41. border-radius: 5rpx;
  42. color: #858585;
  43. font-size: 24rpx;
  44. .mlit-right-item{
  45. padding: 0 15rpx;
  46. border: solid 1px #BDBDBD;
  47. }
  48. .mlit-right-item.fee-status{color: #FA6400;border-color: #FA6400;}
  49. .mlit-right-item + .mlit-right-item{margin-left: 10rpx;}
  50. }
  51. }
  52. .monthly-list-item-bottom {
  53. padding: 31rpx 39rpx;
  54. .mlib-item {
  55. display: flex;
  56. flex-direction: row;
  57. color: #595959;
  58. font-family: PingFangSC-Regular, PingFang SC;
  59. font-size: 26rpx;
  60. line-height: 40rpx;
  61. view {
  62. &:first-child {
  63. width: 20%;
  64. text-align: justify;
  65. text-align-last: justify;
  66. margin-right: 5rpx;
  67. }
  68. &:last-child {
  69. margin-left: 10rpx;
  70. }
  71. }
  72. &:last-child {
  73. view {
  74. &:last-child {
  75. color: #FA6400;
  76. }
  77. }
  78. }
  79. }
  80. }
  81. .button-wrap{
  82. border-top: 1px solid #DFDFDF;
  83. // padding: 26rpx 39rpx;
  84. .tool-btn{
  85. padding: 26rpx 39rpx;
  86. flex: 1;
  87. text-align: center;
  88. &-cancel{
  89. // background-color: red;
  90. }
  91. }
  92. }
  93. }
  94. }
  95. }