page-role.component.scss 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198
  1. .subtitle{
  2. margin-right: 12px;
  3. color: #00000073;
  4. font-size: 14px;
  5. font-weight: normal;
  6. line-height: 1.5715;
  7. // overflow: hidden;
  8. // white-space: nowrap;
  9. // text-overflow: ellipsis;
  10. }
  11. .edit-content{
  12. margin: 0 0 20px;
  13. padding: 0 24px;
  14. height: calc(100vh - 192px);
  15. min-width: 800px;
  16. .tool{
  17. display: flex;
  18. justify-content: space-between;
  19. .tool-left{
  20. display: flex;
  21. align-items: center;
  22. .search{
  23. display: flex;
  24. width: 280px;
  25. margin-right: 20px;
  26. }
  27. .tag{
  28. background: #f7f7f7;
  29. display: flex;
  30. align-items: center;
  31. color: #6f6f6f;
  32. line-height: 26px;
  33. padding: 0 8px;
  34. margin: 0 10px;
  35. }
  36. }
  37. }
  38. .layout{
  39. display: flex;
  40. width: 100%;
  41. .sider{
  42. width: 280px;
  43. margin: 10px 0;
  44. height: calc(100vh - 192px);
  45. overflow-y: scroll;
  46. flex-shrink: 0;
  47. margin-right: 20px;
  48. .custom-node{
  49. display: flex;
  50. }
  51. .folder-desc{
  52. display: none;
  53. margin-left: 10px;
  54. background-color: white;
  55. color: #ba1a1a;
  56. border: none;
  57. }
  58. .custom-node:hover .folder-desc{
  59. display: block;
  60. }
  61. .custom-name:hover .folder-desc{
  62. display: block;
  63. }
  64. .loading{
  65. display: flex;
  66. flex-direction: column;
  67. justify-content: center;
  68. align-items: center;
  69. .tips{
  70. color: #6f6f6f;
  71. font-size: 14px;
  72. }
  73. }
  74. }
  75. .breadcrumb{
  76. flex: 1;
  77. }
  78. }
  79. .activeTd{
  80. cursor: pointer;
  81. }
  82. .activeTd{
  83. color: #c6233f;
  84. }
  85. }
  86. .depart-modal{
  87. .row{
  88. width: 90%;
  89. margin-bottom: 26px;
  90. .warning{
  91. padding: 10px;
  92. background: #eceef7;
  93. border-radius: 4px;
  94. }
  95. }
  96. .select{
  97. width: 90%;
  98. margin-bottom: 20px;
  99. .tree{
  100. height: 140px;
  101. overflow-y: scroll;
  102. .li{
  103. display: flex;
  104. justify-content: space-between;
  105. padding: 8px 4px;
  106. span{
  107. flex-shrink: 0;
  108. }
  109. }
  110. .li:hover{
  111. background-color: #f9f9f9;
  112. }
  113. }
  114. }
  115. }
  116. input:-webkit-autofill,
  117. input:-webkit-autofill:hover,
  118. input:-webkit-autofill:focus,
  119. input:-webkit-autofill:active {
  120. -webkit-transition-delay: 99999s;
  121. -webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
  122. }
  123. // 选中,批量操作区域
  124. .batch-toolbar-modal{
  125. position: fixed;
  126. display: flex;
  127. justify-content: center;
  128. bottom: 80px;
  129. left: calc(50% - 134px);
  130. -webkit-transform: translate(0);
  131. transform: translate(0);
  132. z-index: 99;
  133. }
  134. .batch-toolbar {
  135. display: flex;
  136. align-items: center;
  137. height: 56px;
  138. // min-width: 600px;
  139. background: #fff;
  140. border: 1px solid #e5e6eb;
  141. box-sizing: border-box;
  142. box-shadow: 0 16px 32px -10px rgba(4, 24, 115, .1);
  143. border-radius: 4px;
  144. button{
  145. color:#545968;
  146. }
  147. }
  148. .batch-toolbar .styles_counter__18S08 {
  149. color: #fff;
  150. display: flex;
  151. justify-content: center;
  152. align-items: center;
  153. height: 100%;
  154. background: #C6233F;
  155. width: 100px;
  156. font-size: 12px;
  157. border-top-left-radius: 4px;
  158. border-bottom-left-radius: 4px;
  159. }
  160. .batch-toolbar .batch-toolbar-actions {
  161. display: flex;
  162. margin: auto;
  163. padding: 0 20px;
  164. }
  165. .batch-toolbar .styles_cancel__AARoT {
  166. font-size: 16px;
  167. border-left: 1px solid #a9aeb8;
  168. // padding-left: 20px;
  169. display: flex;
  170. justify-content: center;
  171. width: 128px;
  172. }
  173. .batch-toolbar .styles_counter__18S08 .styles_num__178Wa {
  174. font-size: 24px;
  175. margin-left: 8px;
  176. }
  177. ::ng-deep .ant-page-header-heading-title{
  178. white-space: normal;
  179. }
  180. ::ng-deep .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn{
  181. color: #c6233f;
  182. }
  183. ::ng-deep .ant-tabs-ink-bar{
  184. background: #c6233f;
  185. }
  186. ::ng-deep .ant-tabs-tab:hover{
  187. color: #e97488;
  188. }
  189. ::ng-deep .ant-tabs-tab-btn:active{
  190. color: #e97488;
  191. }
  192. ::ng-deep .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected{
  193. background-color: #ba1a1a;
  194. color: white;
  195. }
  196. ::ng-deep .ant-tree .ant-tree-node-content-wrapper:hover{
  197. background-color: #eae6e6;
  198. }