mess.wxss 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. .main {
  2. height: 88.8vh;
  3. }
  4. .main .zero {
  5. width: 96vw;
  6. margin: 0 0 2vw 0;
  7. }
  8. .main .zero:nth-child(2) {
  9. margin: 0 0 0 0;
  10. }
  11. .main .one {
  12. display: flex;
  13. flex-direction: row;
  14. justify-content: space-between;
  15. padding: 2vw;
  16. width: 92vw;
  17. background-color: #fff;
  18. }
  19. .main .one .one_1 {
  20. width: 76vw;
  21. background-color: #f1f1f1;
  22. padding: 0 0 0 2vw;
  23. }
  24. .main .one .one_1 input {
  25. padding: 1vw 2px;
  26. font-size: 14px;
  27. }
  28. .main .one .one_2 button {
  29. font-size: 14px;
  30. }
  31. .main .two {
  32. flex-grow: 1;
  33. width: 100%;
  34. position: relative;
  35. }
  36. .main .two .scroll-view {
  37. position: absolute;
  38. top: 0;
  39. left: 0;
  40. right: 0;
  41. bottom: 0;
  42. }
  43. .main .two .scroll-view .list-scroll-view {
  44. display: flex;
  45. flex-direction: column;
  46. }
  47. .main .two .scroll-view .list-scroll-view .list {
  48. border-bottom: 1px solid #cccccc;
  49. padding: 2vw 0;
  50. display: flex;
  51. flex-direction: column;
  52. }
  53. .main .two .scroll-view .list-scroll-view .list .info {
  54. display: flex;
  55. flex-direction: row;
  56. margin: 0 0 2vw 0;
  57. }
  58. .main .two .scroll-view .list-scroll-view .list .info .list_1 {
  59. padding: 8vw 0 0 0;
  60. }
  61. .main .two .scroll-view .list-scroll-view .list .info .list_1 .image {
  62. width: 60px;
  63. height: 60px;
  64. border-radius: 10px;
  65. }
  66. .main .two .scroll-view .list-scroll-view .list .info .list_2 {
  67. width: 80vw;
  68. padding: 0 0 0 2vw;
  69. }
  70. .main .two .scroll-view .list-scroll-view .list .info .list_2 .name {
  71. font-size: 16px;
  72. font-weight: bold;
  73. margin: 0 0 1vw 0;
  74. overflow: hidden;
  75. text-overflow: ellipsis;
  76. -webkit-line-clamp: 2;
  77. word-break: break-all;
  78. display: -webkit-box;
  79. -webkit-box-orient: vertical;
  80. }
  81. .main .two .scroll-view .list-scroll-view .list .info .list_2 .name .status {
  82. background-color: #ff0000;
  83. color: #fff;
  84. padding: 0 2vw;
  85. font-size: 14px;
  86. }
  87. .main .two .scroll-view .list-scroll-view .list .info .list_2 .other .other_1 {
  88. margin: 0 0 1vw 0;
  89. color: #000000a6;
  90. font-size: 12px;
  91. overflow: hidden;
  92. text-overflow: ellipsis;
  93. -webkit-line-clamp: 2;
  94. word-break: break-all;
  95. display: -webkit-box;
  96. -webkit-box-orient: vertical;
  97. }
  98. .main .two .scroll-view .list-scroll-view .list .btn {
  99. text-align: center;
  100. }
  101. .main .two .scroll-view .list-scroll-view .list .btn button {
  102. margin: 0 2vw;
  103. font-size: 14px;
  104. }