index.less 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. .box {
  2. width: 331px;
  3. margin-bottom: 15px;
  4. background: hsl(0, 0%, 100%);
  5. border-radius: 25px;
  6. box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.07), 0px 4px 10px rgba(0, 0, 0, 0.05);
  7. .content {
  8. .env {
  9. position: relative;
  10. display: flex;
  11. .envLeft {
  12. flex: 1 1 auto;
  13. height: 140px;
  14. padding-top: 24px;
  15. padding-left: 30px;
  16. .envnum {
  17. display: flex;
  18. flex-direction: row;
  19. align-items: flex-start;
  20. padding-top: 5px;
  21. padding-bottom: 5px;
  22. color: #1b144e;
  23. font-weight: 400;
  24. font-size: 32px;
  25. font-family: Montserrat;
  26. line-height: 32px;
  27. .unit {
  28. color: #c4c4c4;
  29. font-weight: 800;
  30. font-size: 12px;
  31. font-family: Mulish;
  32. font-style: normal;
  33. line-height: 15px;
  34. }
  35. }
  36. }
  37. .envRight {
  38. width: 165px;
  39. height: 140px;
  40. .roomAirImg {
  41. width: 165px;
  42. height: 140px;
  43. }
  44. }
  45. }
  46. .airStatus {
  47. padding-top: 5px;
  48. color: rgba(196, 196, 196, 1);
  49. font-weight: 400;
  50. font-size: 14px;
  51. font-family: PingFang SC;
  52. line-height: 20px;
  53. .airStatusbox {
  54. display: flex;
  55. align-items: center;
  56. .airStatusImg {
  57. width: 12px;
  58. height: 12px;
  59. margin-right: 3px;
  60. }
  61. .statusText {
  62. display: inline-block;
  63. width: 96px;
  64. overflow: hidden;
  65. font-size: 11px;
  66. line-height: 18px;
  67. white-space: nowrap;
  68. text-overflow: ellipsis;
  69. }
  70. }
  71. }
  72. .airBtn {
  73. position: absolute;
  74. top: 103px;
  75. right: 15px;
  76. }
  77. }
  78. .expend {
  79. .item {
  80. display: flex;
  81. align-items: center;
  82. justify-content: space-between;
  83. height: 60px;
  84. padding-right: 14px;
  85. padding-left: 27px;
  86. color: rgba(196, 196, 196, 1);
  87. font-weight: 400;
  88. font-size: 14px;
  89. line-height: 20px;
  90. border-top: 1px solid rgba(196, 196, 196, 0.4);
  91. .itemRight {
  92. display: flex;
  93. }
  94. .itemBg {
  95. display: flex;
  96. align-items: center;
  97. justify-content: center;
  98. width: 42px;
  99. height: 42px;
  100. background: rgba(196, 196, 196, 0.2);
  101. border-radius: 50%;
  102. }
  103. .itemBg:nth-child(1) {
  104. margin-right: 20px;
  105. }
  106. .itemImg {
  107. width: 20px;
  108. height: 20px;
  109. }
  110. }
  111. }
  112. }