style.less 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. .LeftAndRighrStructure {
  2. width: 100%;
  3. padding: 16px;
  4. .line {
  5. display: flex;
  6. flex-direction: row;
  7. justify-content: space-between;
  8. align-items: center;
  9. height: 40px;
  10. background: #F0FCFC;
  11. border-radius: 4px;
  12. margin-bottom: 16px;
  13. padding: 0 12px;
  14. .info {
  15. display: flex;
  16. flex-direction: row;
  17. justify-content: flex-start;
  18. align-items: center;
  19. font-weight: 500;
  20. font-size: 16px;
  21. color: #17181A;
  22. &>img {
  23. width: 16px;
  24. height: 16px;
  25. margin-right: 8px;
  26. }
  27. &>span {
  28. font-weight: 500;
  29. font-size: 16px;
  30. color: #00B3B3;
  31. padding-left: 4px;
  32. }
  33. }
  34. .lineBtnGroup {
  35. &>span {
  36. display: inline-block;
  37. height: 24px;
  38. padding: 0 14px;
  39. line-height: 24px;
  40. background: #FFFFFF;
  41. border-radius: 4px;
  42. text-align: center;
  43. font-weight: 400;
  44. font-size: 14px;
  45. color: #00B3B3;
  46. cursor: pointer;
  47. &:first-child {
  48. margin-right: 8px;
  49. }
  50. }
  51. }
  52. }
  53. .contentWrapper {
  54. display: flex;
  55. width: 100%;
  56. flex-direction: row;
  57. justify-content: space-between;
  58. align-items: flex-start;
  59. .left {
  60. width: 220px;
  61. border-radius: 4px;
  62. padding-top: 16px;
  63. border: 1px solid #DAE2F2;
  64. .leftTab {
  65. display: flex;
  66. margin: 0 16px;
  67. flex-direction: row;
  68. justify-content: flex-start;
  69. align-items: center;
  70. border-radius: 4px;
  71. margin-bottom: 4px;
  72. border: 1px solid #DAE2F2;
  73. overflow: hidden;
  74. .tab {
  75. flex: 1;
  76. cursor: pointer;
  77. text-align: center;
  78. height: 24px;
  79. line-height: 24px;
  80. font-weight: 400;
  81. font-size: 14px;
  82. color: #17181A;
  83. &.on {
  84. color: #FFFFFF;
  85. background: #3377FF;
  86. }
  87. }
  88. }
  89. }
  90. .right {
  91. width: calc(100% - 236px);
  92. .cost-ant-pro-page-container {
  93. border:none !important;
  94. }
  95. .toolBar {
  96. display: flex;
  97. flex-direction: row;
  98. justify-content: space-between;
  99. align-items: center;
  100. margin-bottom: 12px;
  101. .leftTool {
  102. font-weight: 500;
  103. font-size: 14px;
  104. color: #17181A;
  105. &>span {
  106. color: #3477FF;
  107. }
  108. &::before {
  109. position: relative;
  110. display: inline-block;
  111. content: '';
  112. width: 8px;
  113. height: 8px;
  114. background: #3377FF;
  115. border-radius: 2px;
  116. margin-right: 8px;
  117. margin-left: 4px;
  118. }
  119. }
  120. .rightTool {
  121. .filterItem {
  122. display: flex;
  123. flex-direction: row;
  124. justify-content: center;
  125. align-items: center;
  126. }
  127. }
  128. .btnGroup {
  129. .import,
  130. .normal {
  131. cursor: pointer;
  132. display: inline-block;
  133. font-size: 14px;
  134. font-family: SourceHanSansCN-Normal, SourceHanSansCN;
  135. font-weight: 400;
  136. color: #FFFFFF;
  137. line-height: 24px;
  138. padding: 0 14px;
  139. background: #3377FF;
  140. border-radius: 4px;
  141. }
  142. .normal {
  143. display: inline-block;
  144. color: #17181A;
  145. border: 1px solid #DAE2F2;
  146. background: #FAFCFF;
  147. margin-right: 8px;
  148. }
  149. }
  150. }
  151. }
  152. }
  153. }