@kdcloudjs/table 1.2.1-canary.6 → 1.2.2-canary.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (288) hide show
  1. package/LICENSE +568 -568
  2. package/README.md +111 -111
  3. package/dist/@kdcloudjs/table.css +1 -1
  4. package/dist/@kdcloudjs/table.js +5480 -6087
  5. package/dist/@kdcloudjs/table.js.map +1 -1
  6. package/dist/@kdcloudjs/table.min.css +1 -1
  7. package/dist/@kdcloudjs/table.min.js +18 -16
  8. package/dist/@kdcloudjs/table.min.js.map +1 -1
  9. package/dist/kd-ui-complete.less +777 -777
  10. package/es/_utils/arrayUtil.js +0 -3
  11. package/es/_utils/devwarning.js +0 -1
  12. package/es/_utils/formatUtil.js +36 -101
  13. package/es/_utils/hooks.js +21 -45
  14. package/es/_utils/index.js +0 -2
  15. package/es/_utils/numberUtil.js +32 -55
  16. package/es/_utils/omit.js +0 -2
  17. package/es/_utils/type.js +0 -2
  18. package/es/_utils/usePopper.js +81 -144
  19. package/es/config-provider/compDefaultProps.js +0 -1
  20. package/es/config-provider/configProvider.js +2 -7
  21. package/es/config-provider/defaultConfig.js +0 -1
  22. package/es/index.js +0 -2
  23. package/es/locale/locale.js +11 -50
  24. package/es/style/color/colors.less +1 -1
  25. package/es/style/core/index.less +1 -1
  26. package/es/style/core/motion/other.less +27 -27
  27. package/es/style/core/motion/slide.less +53 -53
  28. package/es/style/core/motion.less +1 -1
  29. package/es/style/core/reset.less +185 -185
  30. package/es/style/index.less +1 -1
  31. package/es/style/mixins/index.less +18 -18
  32. package/es/style/mixins/overlay.less +21 -21
  33. package/es/style/mixins/reset.less +12 -12
  34. package/es/style/themes/default.less +445 -445
  35. package/es/table/base/calculations.js +25 -75
  36. package/es/table/base/colgroup.js +0 -1
  37. package/es/table/base/empty.js +6 -6
  38. package/es/table/base/globalStyleComponent.d.ts +4 -0
  39. package/es/table/base/globalStyleComponent.js +24 -0
  40. package/es/table/base/header.js +21 -76
  41. package/es/table/base/helpers/SpanManager.js +4 -11
  42. package/es/table/base/helpers/TableDOMUtils.js +9 -34
  43. package/es/table/base/helpers/__test__/SpanManager.test.js +2 -2
  44. package/es/table/base/helpers/__test__/TableDOMUtils.test.js +0 -1
  45. package/es/table/base/helpers/getRichVisibleRectsStream.js +13 -45
  46. package/es/table/base/helpers/rowHeightManager.js +0 -28
  47. package/es/table/base/html-table.js +17 -39
  48. package/es/table/base/loading.js +8 -10
  49. package/es/table/base/renderTemplates.js +42 -60
  50. package/es/table/base/styles.d.ts +10 -0
  51. package/es/table/base/styles.js +17 -16
  52. package/es/table/base/table.js +113 -201
  53. package/es/table/base/utils.js +17 -57
  54. package/es/table/common-views.js +0 -7
  55. package/es/table/interfaces.d.ts +38 -0
  56. package/es/table/internals.js +0 -13
  57. package/es/table/pipeline/const.d.ts +3 -0
  58. package/es/table/pipeline/const.js +3 -0
  59. package/es/table/pipeline/features/autoFill.js +11 -40
  60. package/es/table/pipeline/features/autoRowSpan.js +1 -14
  61. package/es/table/pipeline/features/colGroupExtendable.js +4 -19
  62. package/es/table/pipeline/features/columnDrag.js +41 -97
  63. package/es/table/pipeline/features/columnFilter.js +12 -51
  64. package/es/table/pipeline/features/columnHover.js +1 -7
  65. package/es/table/pipeline/features/columnRangeHover.js +1 -8
  66. package/es/table/pipeline/features/columnResizeWidth.js +13 -39
  67. package/es/table/pipeline/features/contextMenu.js +22 -95
  68. package/es/table/pipeline/features/featureApi/RowDragApi.d.ts +15 -0
  69. package/es/table/pipeline/features/featureApi/RowDragApi.js +66 -0
  70. package/es/table/pipeline/features/featureApi/utils.d.ts +2 -0
  71. package/es/table/pipeline/features/featureApi/utils.js +10 -0
  72. package/es/table/pipeline/features/filter/DefaultFilterContent.js +14 -30
  73. package/es/table/pipeline/features/filter/DefaultFilterIcon.js +1 -1
  74. package/es/table/pipeline/features/filter/Filter.js +27 -51
  75. package/es/table/pipeline/features/filter/FilterPanel.js +11 -25
  76. package/es/table/pipeline/features/filter/util.js +0 -4
  77. package/es/table/pipeline/features/footerDataSource.js +0 -3
  78. package/es/table/pipeline/features/mergeCellHover.js +0 -1
  79. package/es/table/pipeline/features/multiSelect.js +15 -57
  80. package/es/table/pipeline/features/rangeSelection.js +73 -152
  81. package/es/table/pipeline/features/rowDetail.js +4 -43
  82. package/es/table/pipeline/features/rowDrag.d.ts +10 -12
  83. package/es/table/pipeline/features/rowDrag.js +491 -236
  84. package/es/table/pipeline/features/rowGrouping.js +4 -37
  85. package/es/table/pipeline/features/singleSelect.js +0 -24
  86. package/es/table/pipeline/features/sort.js +38 -96
  87. package/es/table/pipeline/features/tips.js +4 -10
  88. package/es/table/pipeline/features/treeMode.d.ts +1 -0
  89. package/es/table/pipeline/features/treeMode.js +38 -57
  90. package/es/table/pipeline/features/treeSelect.js +2 -28
  91. package/es/table/pipeline/pipeline.d.ts +3 -0
  92. package/es/table/pipeline/pipeline.js +35 -54
  93. package/es/table/pivot/cross-table/buildCrossTable.js +21 -72
  94. package/es/table/pivot/cross-table/cross-table.js +23 -31
  95. package/es/table/pivot/cross-tree-table/buildCrossTreeTable.js +22 -57
  96. package/es/table/pivot/cross-tree-table/cross-tree-table.js +36 -61
  97. package/es/table/pivot/pivot-utils/buildDrillTree.js +10 -23
  98. package/es/table/pivot/pivot-utils/builders.js +34 -74
  99. package/es/table/pivot/pivot-utils/convert-utils.js +16 -42
  100. package/es/table/pivot/pivot-utils/simpleEncode.js +0 -1
  101. package/es/table/style/index.less +1 -1
  102. package/es/table/transforms/autoRowSpan.js +1 -15
  103. package/es/table/transforms/autoWidth.js +13 -35
  104. package/es/table/transforms/buildTree.js +1 -2
  105. package/es/table/transforms/columnHover.js +9 -15
  106. package/es/table/transforms/columnRangeHover.js +12 -19
  107. package/es/table/transforms/columnResize.js +18 -42
  108. package/es/table/transforms/flatten.js +0 -3
  109. package/es/table/transforms/orderField.js +0 -3
  110. package/es/table/transforms/sort.js +42 -101
  111. package/es/table/transforms/tips.js +5 -10
  112. package/es/table/transforms/treeMode.js +36 -77
  113. package/es/table/transforms/visible.js +0 -2
  114. package/es/table/use/useResizeObserver.js +1 -4
  115. package/es/table/utils/applyTransforms.js +0 -1
  116. package/es/table/utils/browserType.js +12 -19
  117. package/es/table/utils/buildTree.js +7 -22
  118. package/es/table/utils/collectNodes.js +4 -13
  119. package/es/table/utils/console.js +0 -14
  120. package/es/table/utils/copyToClipboard.js +0 -4
  121. package/es/table/utils/element.js +14 -41
  122. package/es/table/utils/exportTableAsExcel.js +7 -43
  123. package/es/table/utils/getTreeDepth.js +4 -12
  124. package/es/table/utils/groupBy.js +4 -13
  125. package/es/table/utils/layeredFilter.js +0 -4
  126. package/es/table/utils/layeredSort.js +0 -5
  127. package/es/table/utils/makeRecursiveMapper.js +4 -15
  128. package/es/table/utils/mergeCellProps.js +6 -14
  129. package/es/table/utils/others.js +6 -19
  130. package/es/table/utils/proto.js +2 -30
  131. package/es/table/utils/smartCompare.js +4 -12
  132. package/es/table/utils/traverseColumn.js +5 -18
  133. package/es/table/utils/tree-data-helpers/StrictTreeDataHelper.js +8 -30
  134. package/es/table/utils/tree-data-helpers/TreeDataHelper.js +19 -74
  135. package/es/table/utils/uiDegrade.js +0 -5
  136. package/lib/_utils/arrayUtil.js +2 -8
  137. package/lib/_utils/devwarning.js +0 -5
  138. package/lib/_utils/formatUtil.js +36 -105
  139. package/lib/_utils/hooks.js +21 -56
  140. package/lib/_utils/index.js +2 -9
  141. package/lib/_utils/numberUtil.js +32 -63
  142. package/lib/_utils/omit.js +0 -5
  143. package/lib/_utils/react-children.js +0 -5
  144. package/lib/_utils/type.js +3 -11
  145. package/lib/_utils/usePopper.js +86 -173
  146. package/lib/config-provider/ConfigContext.js +2 -6
  147. package/lib/config-provider/compDefaultProps.js +1 -3
  148. package/lib/config-provider/configProvider.js +6 -22
  149. package/lib/config-provider/defaultConfig.js +1 -7
  150. package/lib/config-provider/index.js +1 -8
  151. package/lib/index.js +2 -8
  152. package/lib/locale/index.js +3 -11
  153. package/lib/locale/locale.js +15 -71
  154. package/lib/locale/zh-CN.js +1 -2
  155. package/lib/style/color/colors.less +1 -1
  156. package/lib/style/components.less +1 -1
  157. package/lib/style/core/index.less +1 -1
  158. package/lib/style/core/motion/other.less +27 -27
  159. package/lib/style/core/motion/slide.less +53 -53
  160. package/lib/style/core/motion.less +1 -1
  161. package/lib/style/core/reset.less +185 -185
  162. package/lib/style/index.less +1 -1
  163. package/lib/style/mixins/index.less +18 -18
  164. package/lib/style/mixins/overlay.less +21 -21
  165. package/lib/style/mixins/reset.less +12 -12
  166. package/lib/style/themes/default.less +445 -445
  167. package/lib/table/base/calculations.js +25 -86
  168. package/lib/table/base/colgroup.js +0 -5
  169. package/lib/table/base/empty.js +8 -20
  170. package/lib/table/base/globalStyleComponent.d.ts +4 -0
  171. package/lib/table/base/globalStyleComponent.js +35 -0
  172. package/lib/table/base/header.js +21 -86
  173. package/lib/table/base/helpers/SpanManager.js +6 -16
  174. package/lib/table/base/helpers/TableDOMUtils.js +9 -37
  175. package/lib/table/base/helpers/__test__/SpanManager.test.js +2 -4
  176. package/lib/table/base/helpers/__test__/TableDOMUtils.test.js +0 -5
  177. package/lib/table/base/helpers/__test__/rowHeightManager.test.js +0 -1
  178. package/lib/table/base/helpers/getRichVisibleRectsStream.js +15 -65
  179. package/lib/table/base/helpers/rowHeightManager.js +0 -33
  180. package/lib/table/base/html-table.js +17 -49
  181. package/lib/table/base/index.js +0 -2
  182. package/lib/table/base/loading.js +8 -14
  183. package/lib/table/base/renderTemplates.js +45 -76
  184. package/lib/table/base/styles.d.ts +10 -0
  185. package/lib/table/base/styles.js +24 -42
  186. package/lib/table/base/table.js +125 -245
  187. package/lib/table/base/utils.js +27 -109
  188. package/lib/table/common-views.js +4 -24
  189. package/lib/table/index.js +0 -13
  190. package/lib/table/interfaces.d.ts +38 -0
  191. package/lib/table/internals.js +2 -17
  192. package/lib/table/pipeline/const.d.ts +3 -0
  193. package/lib/table/pipeline/const.js +9 -0
  194. package/lib/table/pipeline/features/autoFill.js +14 -53
  195. package/lib/table/pipeline/features/autoRowSpan.js +1 -19
  196. package/lib/table/pipeline/features/buildTree.js +0 -2
  197. package/lib/table/pipeline/features/colGroupExtendable.js +6 -35
  198. package/lib/table/pipeline/features/columnDrag.js +41 -103
  199. package/lib/table/pipeline/features/columnFilter.js +12 -65
  200. package/lib/table/pipeline/features/columnHover.js +1 -11
  201. package/lib/table/pipeline/features/columnRangeHover.js +1 -13
  202. package/lib/table/pipeline/features/columnResizeWidth.js +18 -63
  203. package/lib/table/pipeline/features/contextMenu.js +24 -121
  204. package/lib/table/pipeline/features/featureApi/RowDragApi.d.ts +15 -0
  205. package/lib/table/pipeline/features/featureApi/RowDragApi.js +72 -0
  206. package/lib/table/pipeline/features/featureApi/utils.d.ts +2 -0
  207. package/lib/table/pipeline/features/featureApi/utils.js +17 -0
  208. package/lib/table/pipeline/features/filter/DefaultFilterContent.js +17 -52
  209. package/lib/table/pipeline/features/filter/DefaultFilterIcon.js +1 -4
  210. package/lib/table/pipeline/features/filter/Filter.js +30 -77
  211. package/lib/table/pipeline/features/filter/FilterPanel.js +14 -44
  212. package/lib/table/pipeline/features/filter/index.js +0 -5
  213. package/lib/table/pipeline/features/filter/util.js +2 -10
  214. package/lib/table/pipeline/features/footerDataSource.js +1 -12
  215. package/lib/table/pipeline/features/index.js +0 -23
  216. package/lib/table/pipeline/features/mergeCellHover.js +0 -5
  217. package/lib/table/pipeline/features/multiSelect.js +15 -71
  218. package/lib/table/pipeline/features/rangeSelection.js +75 -173
  219. package/lib/table/pipeline/features/rowDetail.js +4 -67
  220. package/lib/table/pipeline/features/rowDrag.d.ts +10 -12
  221. package/lib/table/pipeline/features/rowDrag.js +494 -252
  222. package/lib/table/pipeline/features/rowGrouping.js +4 -57
  223. package/lib/table/pipeline/features/singleSelect.js +0 -34
  224. package/lib/table/pipeline/features/sort.js +37 -115
  225. package/lib/table/pipeline/features/tips.js +4 -19
  226. package/lib/table/pipeline/features/treeMode.d.ts +1 -0
  227. package/lib/table/pipeline/features/treeMode.js +40 -80
  228. package/lib/table/pipeline/features/treeSelect.js +2 -36
  229. package/lib/table/pipeline/index.js +2 -10
  230. package/lib/table/pipeline/pipeline.d.ts +3 -0
  231. package/lib/table/pipeline/pipeline.js +36 -65
  232. package/lib/table/pivot/cross-table/buildCrossTable.js +21 -83
  233. package/lib/table/pivot/cross-table/constants.js +1 -2
  234. package/lib/table/pivot/cross-table/cross-table.js +25 -42
  235. package/lib/table/pivot/cross-table/index.js +0 -4
  236. package/lib/table/pivot/cross-tree-table/buildCrossTreeTable.js +22 -70
  237. package/lib/table/pivot/cross-tree-table/cross-tree-table.js +37 -73
  238. package/lib/table/pivot/cross-tree-table/index.js +0 -3
  239. package/lib/table/pivot/pivot-utils/buildDrillTree.js +10 -29
  240. package/lib/table/pivot/pivot-utils/builders.js +34 -85
  241. package/lib/table/pivot/pivot-utils/convert-utils.js +16 -60
  242. package/lib/table/pivot/pivot-utils/index.js +0 -7
  243. package/lib/table/pivot/pivot-utils/simpleEncode.js +0 -2
  244. package/lib/table/style/css.js +0 -1
  245. package/lib/table/style/index.js +0 -1
  246. package/lib/table/style/index.less +1 -1
  247. package/lib/table/transforms/autoRowSpan.js +1 -21
  248. package/lib/table/transforms/autoWidth.js +15 -58
  249. package/lib/table/transforms/buildTree.js +1 -4
  250. package/lib/table/transforms/columnHover.js +9 -22
  251. package/lib/table/transforms/columnRangeHover.js +12 -27
  252. package/lib/table/transforms/columnResize.js +20 -63
  253. package/lib/table/transforms/flatten.js +0 -5
  254. package/lib/table/transforms/index.js +0 -12
  255. package/lib/table/transforms/orderField.js +0 -7
  256. package/lib/table/transforms/sort.js +44 -127
  257. package/lib/table/transforms/tips.js +5 -20
  258. package/lib/table/transforms/treeMode.js +38 -106
  259. package/lib/table/transforms/visible.js +0 -7
  260. package/lib/table/transforms/warnTransformsDeprecated.js +0 -4
  261. package/lib/table/use/useResizeObserver.js +2 -10
  262. package/lib/table/utils/applyTransforms.js +0 -2
  263. package/lib/table/utils/browserType.js +14 -23
  264. package/lib/table/utils/buildTree.js +7 -33
  265. package/lib/table/utils/collectNodes.js +4 -18
  266. package/lib/table/utils/console.js +2 -19
  267. package/lib/table/utils/copyToClipboard.js +1 -8
  268. package/lib/table/utils/element.js +14 -46
  269. package/lib/table/utils/exportTableAsExcel.js +7 -52
  270. package/lib/table/utils/getTreeDepth.js +4 -17
  271. package/lib/table/utils/groupBy.js +4 -17
  272. package/lib/table/utils/index.js +0 -22
  273. package/lib/table/utils/isGroupColumn.js +0 -3
  274. package/lib/table/utils/isLeafNode.js +0 -1
  275. package/lib/table/utils/keyCode.js +1 -2
  276. package/lib/table/utils/layeredFilter.js +0 -10
  277. package/lib/table/utils/layeredSort.js +0 -10
  278. package/lib/table/utils/makeRecursiveMapper.js +4 -24
  279. package/lib/table/utils/mergeCellProps.js +6 -18
  280. package/lib/table/utils/others.js +7 -36
  281. package/lib/table/utils/proto.js +3 -35
  282. package/lib/table/utils/selectColumn.js +2 -5
  283. package/lib/table/utils/smartCompare.js +4 -13
  284. package/lib/table/utils/traverseColumn.js +5 -25
  285. package/lib/table/utils/tree-data-helpers/StrictTreeDataHelper.js +10 -41
  286. package/lib/table/utils/tree-data-helpers/TreeDataHelper.js +21 -90
  287. package/lib/table/utils/uiDegrade.js +1 -8
  288. package/package.json +218 -218
@@ -1,779 +1,779 @@
1
- // color palettes
2
- @blue-base: #1890ff;
3
-
4
-
5
- @keyframes loadingcircle {
6
- 100% {
7
- transform: rotate(360deg);
8
- }
9
- }
10
-
11
- @keyframes waveEffect {
12
- 100% {
13
- box-shadow: 0 0 0 6px @theme-color;
14
- }
15
- }
16
-
17
- @keyframes fadeEffect {
18
- 100% {
19
- opacity: 0;
20
- }
21
- }
22
-
23
- @keyframes kdRadioEffect {
24
- 0% {
25
- transform: translateY(-50%) scale(0.5);
26
- opacity: 0;
27
- }
28
- 100% {
29
- transform: translateY(-50%) scale(1);
30
- opacity: 1;
31
- }
32
- }
33
- @keyframes kdSlideDownIn {
34
- 0% {
35
- transform: scaleY(0.8);
36
- transform-origin: 50% 0%;
37
- opacity: 0;
38
- }
39
- 100% {
40
- transform: scaleY(1);
41
- transform-origin: 50% 0%;
42
- opacity: 1;
43
- }
44
- }
45
-
46
- @keyframes kdSlideDownOut {
47
- 0% {
48
- transform: scaleY(1);
49
- transform-origin: 50% 0%;
50
- opacity: 1;
51
- }
52
- 100% {
53
- transform: scaleY(0.9);
54
- transform-origin: 50% 0%;
55
- opacity: 0;
56
- }
57
- }
58
-
59
- @keyframes kdSlideUpIn {
60
- 0% {
61
- transform-origin: 50% 100%;
62
- opacity: 0;
63
- }
64
- 5% {
65
- transform: scaleY(0.8);
66
- }
67
- 100% {
68
- transform: scaleY(1);
69
- transform-origin: 50% 100%;
70
- opacity: 1;
71
- }
72
- }
73
-
74
- @keyframes kdSlideUpOut {
75
- 0% {
76
- transform: scaleY(1);
77
- transform-origin: 50% 100%;
78
- opacity: 1;
79
- }
80
- 100% {
81
- transform: scaleY(0.9);
82
- transform-origin: 50% 100%;
83
- opacity: 0;
84
- }
85
- }
86
-
87
-
88
-
89
- /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
90
-
91
- /* normalize.css 和现有产品的结合版本, 根据兼容性进行了调整 */
92
- /* Document
93
- ========================================================================== */
94
-
95
- /* Sections
96
- ========================================================================== */
97
-
98
- /**
99
- * Remove the margin in all browsers.
100
- */
101
- html,body {
102
- height: 100%;
103
- padding: 0;
104
- margin: 0;
105
- font-size:12px;
106
-
107
- }
108
-
109
- html,body,input, textarea, select, button{
110
- font-family:"Microsoft YaHei","PingFangSC-Regular","Helvetica Neue", Helvetica, Arial,"Hiragino Sans GB","WenQuanYi Micro Hei", sans-serif;
111
- }
112
-
113
- body {
114
- box-sizing: border-box;
115
- }
116
-
117
- /**
118
- * Remove the gray background on active links in IE 10.
119
- */
120
-
121
- a {
122
- background-color: transparent;
123
- }
124
-
125
-
126
- /* Forms
127
- ========================================================================== */
128
-
129
- /**
130
- */
131
- input {
132
- padding: 0;
133
- margin: 0;
134
- }
135
- /**
136
- * 1. Change the font styles in all browsers.
137
- * 2. Remove the margin in Firefox and Safari.
138
- */
139
-
140
- button,
141
- input,
142
- optgroup,
143
- select,
144
- textarea {
145
- margin: 0; /* 2 */
146
- }
147
-
148
- /**
149
- * Show the overflow in IE.
150
- * 1. Show the overflow in Edge.
151
- */
152
-
153
- button,
154
- input { /* 1 */
155
- overflow: visible;
156
- }
157
-
158
- /**
159
- * Remove the inheritance of text transform in Edge, Firefox, and IE.
160
- * 1. Remove the inheritance of text transform in Firefox.
161
- */
162
-
163
- button,
164
- select { /* 1 */
165
- text-transform: none;
166
- }
167
-
168
- /**
169
- * Correct the inability to style clickable types in iOS and Safari.
170
- */
171
-
172
- button,
173
- [type="button"],
174
- [type="reset"],
175
- [type="submit"] {
176
- -webkit-appearance: button;
177
- }
178
-
179
- /**
180
- * Remove the inner border and padding in Firefox.
181
- */
182
-
183
- button::-moz-focus-inner,
184
- [type="button"]::-moz-focus-inner,
185
- [type="reset"]::-moz-focus-inner,
186
- [type="submit"]::-moz-focus-inner {
187
- border-style: none;
188
- padding: 0;
189
- }
190
-
191
- /**
192
- * Restore the focus styles unset by the previous rule.
193
- */
194
-
195
- button:-moz-focusring,
196
- [type="button"]:-moz-focusring,
197
- [type="reset"]:-moz-focusring,
198
- [type="submit"]:-moz-focusring {
199
- outline: 1px dotted ButtonText;
200
- }
201
-
202
- /**
203
- * Add the correct vertical alignment in Chrome, Firefox, and Opera.
204
- */
205
-
206
- progress {
207
- vertical-align: baseline;
208
- }
209
-
210
- /**
211
- * Remove the default vertical scrollbar in IE 10+.
212
- */
213
-
214
- textarea {
215
- overflow: auto;
216
- }
217
-
218
- /**
219
- * 1. Add the correct box sizing in IE 10.
220
- * 2. Remove the padding in IE 10.
221
- */
222
-
223
- [type="checkbox"],
224
- [type="radio"] {
225
- box-sizing: border-box; /* 1 */
226
- padding: 0; /* 2 */
227
- }
228
-
229
- /**
230
- * Correct the cursor style of increment and decrement buttons in Chrome.
231
- */
232
-
233
- [type="number"]::-webkit-inner-spin-button,
234
- [type="number"]::-webkit-outer-spin-button {
235
- height: auto;
236
- }
237
-
238
- /**
239
- * 1. Correct the odd appearance in Chrome and Safari.
240
- * 2. Correct the outline style in Safari.
241
- */
242
-
243
- [type="search"] {
244
- -webkit-appearance: textfield; /* 1 */
245
- outline-offset: -2px; /* 2 */
246
- }
247
-
248
- /**
249
- * Remove the inner padding in Chrome and Safari on macOS.
250
- */
251
-
252
- [type="search"]::-webkit-search-decoration {
253
- -webkit-appearance: none;
254
- }
255
-
256
-
257
- /* Misc
258
- ========================================================================== */
259
-
260
- /**
261
- * Add the correct display in IE 10+.
262
- */
263
-
264
- template {
265
- display: none;
266
- }
267
-
268
- /**
269
- * Add the correct display in IE 10.
270
- */
271
-
272
- [hidden] {
273
- display: none;
274
- }
275
-
276
-
277
- // Mixins
278
- //----------------------------------------
279
-
280
-
281
- /* 多行显示省略号 */
282
- .multilpleEllipsis(@n: n) {
283
- overflow: hidden;
284
- text-overflow: ellipsis;
285
- display: -webkit-box;
286
- -webkit-line-clamp: @n;
287
- -webkit-box-orient: vertical;
288
- }
289
-
290
- /* 单行显示省略号 */
291
- .ellipsis() {
292
- white-space: nowrap;
293
- overflow: hidden;
294
- text-overflow: ellipsis;
295
- }
296
-
297
-
298
- .overlay(@bgcolor, @isUseMaskZindex) {
299
- position: fixed;
300
- background-color: @bgcolor;
301
- z-index: if(boolean(@isUseMaskZindex), @zIndex-masker, auto);
302
- .overall-postion()
303
- }
304
-
305
- .overall-postion {
306
- left: 0;
307
- right: 0;
308
- top: 0;
309
- bottom: 0;
310
- }
311
-
312
- .static-overlay(@bgcolor, @isUseMaskZindex) {
313
- width: 100%;
314
- height: 100%;
315
- background-color: @bgcolor;
316
- z-index: if(boolean(@isUseMaskZindex), @zIndex-masker, auto);
317
- }
318
-
319
-
320
- @font-variant: tabular-nums;
321
- @font-feature-settings: 'tnum';
322
-
323
- .reset-component() {
324
- box-sizing: border-box;
325
- margin: 0;
326
- padding: 0;
327
- font-variant: @font-variant;
328
- list-style: none;
329
- font-feature-settings: @font-feature-settings;
330
- }
331
- @kd-prefix: kd;
332
-
333
- /* ----------- color ——————---- start */
334
- @theme-color: #5582f3; // 主题色
335
- // 使用hsb/hsv 计算色值
336
- @hsv-h: hsvhue(@theme-color); // 色相
337
- @hsv-s: hsvsaturation(@theme-color); // 饱和度
338
- @hsv-v: hsvvalue(@theme-color); // 明度
339
-
340
- @theme-color-disabled: hsv(@hsv-h, max(5%, (@hsv-s - 54%)), min((@hsv-v + 24%), 100%)); // 禁用色
341
- @theme-color-hover: hsv(@hsv-h, max(5%, (@hsv-s - 18%)), min((@hsv-v + 8%), 100%)); // 悬浮色
342
- @theme-color-click: hsv(@hsv-h, min((@hsv-s + 8%), 100%), max(5%, (@hsv-v - 16%))); // 点击色
343
- @theme-color-active-light: hsv(@hsv-h, max(5%, (@hsv-s - 90%)), min((@hsv-v + 40%), 100%)); // 浅色选中
344
- @theme-color-active-dark: @theme-color; // 深色选中
345
- @hover-color: #f5f5f5; // 中性的悬停色
346
- @disabled-contain-bg: #f5f5f5; // 容器失效背景色
347
- @success-color: #1ba854; // 成功色(深)
348
- @success-bg-color: #f2fff5; // 成功反馈浮层的底色
349
- @success-border-color: #6dd18e; // 成功反馈浮层的容器边框色
350
- @warning-color: #ff991c; // 警示色(深)
351
- @warning-bg-color: #fffbf2; // 警示反馈浮层的底色
352
- @warning-border-color: #ffcb78; // 警示反馈浮层的容器边框色
353
- @error-color: #fb2323; // 失败色(深)
354
- @error-bg-color: #fff2f4; // 失败反馈浮层的底色
355
- @error-border-color: #ff8088; // 失败反馈浮层的容器边框色
356
- @ongoing-color: #276ff5; // 进行中(深)
357
- @ongoing-bg-color: #f2f9ff; // 进行中反馈浮层的底色
358
- @ongoing-border-color: #85b8ff; // 进行中反馈浮层的容器边框色
359
- @disabled-color: #b2b2b2; // 失效色
360
- @disabled-border-color: #ccc; // 失效边框色
361
- @end-color: #666; // 暂停或者终止等状态标签色
362
- @link-color: #0e5fd8; // 链接色
363
- @link-color-hover: #3987ed; // 链接色或辅助色(悬浮)
364
- @link-color-active: #0041b0; // 链接色或辅助色(点击)
365
- @primary-text-color: #212121; // 一级文本
366
- @primary-text-color2: rgba(255, 255, 255, 1); // 一级文本
367
- @secondary-text-color: #666; // 二级文本
368
- @secondary-text-color2: rgba(255, 255, 255, 0.65); // 二级文本
369
- @third-text-color: #999; // 三级文本
370
- @third-text-color2: rgba(255, 255, 255, 0.4); // 三级文本
371
- @placeholder-text-color: #ccc; // 占位符文本
372
- @placeholder-text-color2: rgba(255, 255, 255, 0.3); // 占位符文本
373
- @bg: #fff; // 底色白背景
374
- @bg2: #f2f2f2; // 底色灰背景
375
- @contain-bg: #fafafa; // 容器内的灰背景
376
- @radius-size: 2px; // 圆角值
377
- @input-color: #999; // 线型录入的默认态
378
- @strong-border-color: #d9d9d9; // 强线条 --带操作
379
- @strong-border-color-1: #d9d9d9; // 强线条 --分割内容/容器包裹线
380
- @weak-border-color: #e5e5e5; // 弱线条 -- 需要多层级时
381
- // @shadow-on-hover: ; // 悬停时阴影
382
- @white: #fff;
383
- @dirList: left, top, bottom, right;
384
- /* ----------- color ——————---- end */
385
-
386
- /* ----------- font ——————---- start */
387
- @font-size: 14px;
388
- @font-weight: 400;
389
- @small-font-size: 12px;
390
- @middle-font-size: 14px;
391
- @large-font-size: 16px;
392
- @xlarge-font-size: 18px;
393
- /* ----------- font ——————---- end */
394
-
395
- @radius-size: 2px; // 圆角值
396
-
397
- /* ----------- zIndex ——————---- start */
398
- /*
399
- 普通组件内部自身层级应设置在0-100间
400
- */
401
- @zIndex-below: -1; // 置于下层
402
- @zIndex-popper: 1000; // 弹出层
403
- @zIndex-dialog: 1050; // 对话框
404
- @zIndex-masker: 3000; // 遮罩层 (loading等)
405
- @zIndex-apex: 9999; // 顶层 (notify)
406
- /* ----------- zIndex ——————---- end */
407
-
408
- /* ----------- transition ——————---- start */
409
- @transition-duration: 0.3s;
410
- /* ----------- transition ——————---- end */
411
-
412
- /* ----------- Button ——————---- start */
413
- @btn-border-width: 1px;
414
- @btn-border-style: solid;
415
- @btn-primary-font-color: @white; // 基础文字颜色
416
- @btn-primary-background-color: @theme-color; // 基础背景颜色
417
- @btn-primary-border-color: @theme-color; // 基础边框颜色
418
-
419
- @btn-ghost-font-color: @secondary-text-color; // 幽灵按钮文字颜色
420
- @btn-ghost-background-color: transparent; // 幽灵背景颜色
421
- @btn-ghost-border-color: @strong-border-color; //幽灵边框颜色
422
-
423
- @btn-second-font-color: fade(@secondary-text-color, 65%); // 次要文字颜色
424
- @btn-second-background-color: fade(@white, 65%); // 次要背景颜色
425
- @btn-second-border-color: fade(@strong-border-color, 65%); // 次要边框颜色
426
-
427
- @btn-link-font-color: @link-color; // 链接文字颜色
428
-
429
- @btn-disabled-font-color: @white; // 禁用状态 文字颜色
430
- @btn-disabled-background-color: @disabled-contain-bg; // 禁用状态 背景颜色
431
- @btn-disabled-border-color: @strong-border-color; // 禁用状态 边框颜色
432
-
433
- @btn-danger-font-color: @white; // 危险状态 文字颜色
434
- @btn-danger-background-color: @error-color; // 危险状态 背景颜色
435
- @btn-danger-border-color: @error-color; // 危险状态 边框颜色
436
-
437
- @btn-small-font-size: @small-font-size; // 小号 文字大小
438
- @btn-small-height: 24px; // 小号 高度
439
- @btn-small-min-width: 60px; // 小号 最小宽度
440
- @btn-small-padding-vertical: 3px; // 小号 内间距 纵向
441
- @btn-small-padding-horizontal: 8px; // 小号 内间距 横向
442
-
443
- @btn-middle-font-size: @small-font-size; // 中号 文字大小
444
- @btn-middle-height: 28px; // 中号 高度
445
- @btn-middle-min-width: 60px; // 中号 最小宽度
446
- @btn-middle-padding-vertical: 5px; // 中号 内间距 纵向
447
- @btn-middle-padding-horizontal: 8px; // 中号 内间距 纵向
448
-
449
- @btn-large-font-size: @large-font-size; // 大号 文字大小
450
- @btn-large-height: 32px; // 大号 高度
451
- @btn-large-min-width: 80px; // 大号 最小宽度
452
- @btn-large-padding-vertical: 6px; // 大号 内间距 纵向
453
- @btn-large-padding-horizontal: 8px; // 大号 内间距 横向
454
- @btn-transition-fn: cubic-bezier(0.075, 0.82, 0.165, 1);
455
- /* ----------- Button ——————---- end */
456
-
457
- /* ----------- Collapse ——————---- start */
458
- @collapse-border-width: 1px;
459
- @collapse-border-color: @strong-border-color-1;
460
- @collapse-icon-margin-right: 6px;
461
- @collapse-header-font-color: @primary-text-color;
462
- @collapse-header-font-size: @font-size;
463
- @collapse-content-font-color: @primary-text-color;
464
- @collapse-content-font-size: @font-size;
465
- @collapse-content-padding: 10px 0px 0px 20px;
466
- @collapse-disabled-color: @disabled-color;
467
-
468
- /* ----------- Collapse ——————---- end */
469
-
470
- /* ----------- Switch ——————---- start */
471
- @switch-small-font-size: @small-font-size;
472
- @switch-small-line-height: 14px;
473
- @switch-small-height: 14px;
474
- @switch-small-min-width: 28px;
475
- @switch-small-border-radius: 7px;
476
- @switch-large-font-size: @small-font-size;
477
- @switch-large-line-height: 20px;
478
- @switch-large-height: 20px;
479
- @switch-large-min-width: 40px;
480
- @switch-large-border-radius: 10px;
481
- @switch-on-color: @theme-color;
482
- @switch-off-color: #999;
483
- @switch-disabled-bg: @disabled-color;
484
- @switch-loading-color: @ongoing-color;
485
- @switch-font-color: @white;
486
- @switch-inner-small-font-size: @small-font-size;
487
- @switch-inner-margin: 0 5px 0 16px;
488
- @switch-inner-checked-margin: 0 16px 0 5px;
489
- @switch-inner-large-margin: 0 5px 0 21px;
490
- @switch-inner-large-checked-margin: 0 21px 0 5px;
491
- /* ----------- Switch ——————---- end */
492
-
493
- /* ----------- Input ——————---- start */
494
- @input-placeholder-color: @third-text-color;
495
- @input-font-color: @secondary-text-color;
496
- @input-focus-color: @primary-text-color;
497
- @input-background-color: @white;
498
- @input-border-width: 1px;
499
- @input-width: 230px;
500
-
501
- @input-small-font-size: @small-font-size; // 小号 文字大小
502
- @input-small-height: 20px; // 小号 高度
503
- @input-small-padding-vertical: 3px; // 小号 内间距 纵向
504
- @input-small-padding-horizontal: 9px; // 小号 内间距 横向
505
-
506
- @input-middle-font-size: @middle-font-size; // 中号 文字大小
507
- @input-middle-height: 30px; // 中号 高度
508
- @input-middle-padding-vertical: 5px; // 中号 内间距 纵向
509
- @input-middle-padding-horizontal: 9px; // 中号 内间距 纵向
510
-
511
- @input-large-font-size: @large-font-size; // 大号 文字大小
512
- @input-large-height: 36px; // 大号 高度
513
- @input-large-padding-vertical: 8px; // 大号 内间距 纵向
514
- @input-large-padding-horizontal: 9px; // 大号 内间距 横向
515
- /* ----------- Input ——————---- end */
516
-
517
- /* ----------- InputNumber ——————---- start */
518
- @inputNumber-embedStepBtn-bg-color: #f6f7f9;
519
- /* ----------- InputNumber ——————---- end */
520
-
521
- /* ----------- checkbox ——————---- start */
522
- @checkbox-font-size: @small-font-size; //默认字体大小
523
- @checkbox-font-color: @primary-text-color;
524
- @checkbox-border-color: @strong-border-color;
525
- @checkbox-checked-border-color: @theme-color-active-dark;
526
- @checkbox-checked-font-color: @theme-color-active-dark;
527
- @checkbox-bg-color: @bg;
528
- @checkbox-disabled-bg-color: @disabled-color;
529
- @checkbox-small-size-height: 32px; // 小尺寸复选框
530
- @checkbox-middle-size-height: 36px; // 中尺寸复选框
531
- @checkbox-large-size-height: 40px; // 大尺寸复选框
532
- @checkbox-border-width: 1px; // 边框类型边框大小
533
- @checkbox-group-margin-right: 8px; // 按钮组的间距
534
- @checkbox-default-padding: 0; // 默认类型复选框内边距
535
- @checkbox-default-input-margin-right: 8px; // 勾选输入框与右侧内容间距
536
- @checkbox-default-input-height: 16px; // 勾选输入框高度
537
- @checkbox-default-input-width: 16px; // 勾选输入框宽度
538
- @checkbox-default-input-border-radius: 4px; // 勾选输入框圆角
539
- @checkbox-default-input-border-width: 1px; // 勾选输入框边框大小
540
- @checkbox-default-input-icon-color: #fff; // 勾选输入框边勾勾图标颜色
541
- @checkbox-default-input-icon-size: 12px; // 勾选输入框勾勾图标大小
542
- @checkbox-square-padding: 0 20px; // 边框类型内边距
543
- @checkbox-square-triangle-height: 18px; // 边框类型右下角三角高度
544
- @checkbox-square-triangle-width: 18px; // 边框类型右下角三角宽度
545
- @checkbox-square-input-icon-color: #fff; // 边框类型三角内勾选输入框勾勾图标颜色
546
- @checkbox-square-input-icon-size: 9px; // 边框类型三角内勾选输入框勾勾图标大小
547
- /* ----------- checkbox ——————---- end */
548
-
549
- /* ----------- Radio ——————---- start */
550
- @radio-font-size: @small-font-size;
551
- @radio-font-color: @primary-text-color;
552
- @radio-border-width: 1px;
553
- @radio-margin-right: 8px;
554
- @radio-transition-fn: cubic-bezier(0.075, 0.82, 0.165, 1);
555
- @radio-circle-size: 13px;
556
- @radio-square-height: 32px;
557
- @radio-square-padding: 0 20px;
558
- @radio-button-height: 24px;
559
- @radio-button-padding: 0 18px;
560
- /* ----------- Radio ——————---- end */
561
-
562
- /* ----------- icon ——————---- start */
563
- @icon-css-prefix: kdicon;
564
- /* ----------- icon ——————---- end */
565
-
566
- /* ----------- Popconfirm ——————---- start */
567
- @popconfirm-icon-size: 17px;
568
- @popconfirm-min-width: 164px;
569
- @popconfirm-max-width: 500px;
570
- @popconfirm-min-height: 98px;
571
- @popconfirm-max-height: 400px;
572
- @popconfirm-title-line-height: 21px;
573
- @popconfirm-color: @primary-text-color;
574
- @popconfirm-font-size: @small-font-size;
575
- @popconfirm-title-font-size: @middle-font-size;
576
- @popconfirm-vertical-gap: 16px;
577
- @popconfirm-horizontal-gap: 16px;
578
- @popconfirm-background-color: @white;
579
- @popconfirm-box-shadow-blur: 6px;
580
- @popconfirm-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
581
- @popconfirm-duration: 0.2s;
582
- /* ----------- Popconfirm ——————---- end */
583
-
584
- /* ----------- Popover ——————---- start */
585
- @popover-min-width: 164px;
586
- @popover-max-width: 500px;
587
- @popover-min-height: 98px;
588
- @popover-max-height: 400px;
589
- @popover-title-line-height: 21px;
590
- @popover-color: @primary-text-color;
591
- @popover-font-size: @small-font-size;
592
- @popover-title-font-size: @middle-font-size;
593
- @popover-vertical-gap: 16px;
594
- @popover-horizontal-gap: 16px;
595
- @popover-background-color: @white;
596
- @popover-box-shadow-blur: 6px;
597
- @popover-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
598
- @popover-duration: 0.2s;
599
- /* ----------- Popover ——————---- end */
600
-
601
- /* ----------- Progress ——————---- start */
602
- @progress-remaining-color: #e5e5e5;
603
- @progress-default-color: @ongoing-color;
604
- @progress-success-color: @success-color;
605
- @progress-failure-color: @error-color;
606
- @progress-border-radius: 100px;
607
- @progress-line-stroke-width: 8px;
608
- @progress-line-text-width: 3em;
609
- @progress-line-icon-font-size: 16px;
610
- @progress-line-text-font-size: 16px;
611
- @progress-line-special-text-font-size: 16px;
612
- @progress-line-text-margin-left: 8px;
613
- @progress-circle-stroke-width: 4px;
614
- @progress-transition-fn: cubic-bezier(0.66, 0, 0.34, 1);
615
- @progress-circle-text-font-size: 28px;
616
- @progress-circle-percent-line-height: 48px;
617
- @progress-circle-unit-line-height: 18px;
618
- @progress-circle-unit-font-size: 12px;
619
- @progress-circle-unit-margin-top: 18px;
620
- @progress-circle-icon-font-size: 48px;
621
- /* ----------- Progress ——————---- end */
622
-
623
- /* ----------- Pagination ——————---- start */
624
- @pagination-size: 24px;
625
- @pagination-nicety-size: 30px;
626
- @pagination-button-gap: 8px;
627
- @pagination-hover-color: @theme-color;
628
- @pagination-font-size: @small-font-size;
629
- @pagination-icon-size: @large-font-size;
630
- @pagination-font-color: @secondary-text-color;
631
- @pagination-button-color: @secondary-text-color;
632
- @pagination-button-disabled-color: @disabled-border-color;
633
- @pagination-button-disabled-background-color: @disabled-contain-bg;
634
- /* ----------- Pagination ——————---- end */
635
-
636
- /* ----------- Timeline ——————---- start */
637
- @timeline-width: 1px;
638
- @timeline-dot-size: 12px;
639
- @timeline-line-height: 18px;
640
- @timeline-color: @weak-border-color;
641
- @timeline-dot-border-width: 2px;
642
- @timeline-dot-color: @theme-color;
643
- @timeline-dot-bg: @white;
644
- @timeline-item-padding-bottom: 26px;
645
- /* ----------- Timeline ——————---- end */
646
-
647
- /* ----------- Tabs ——————---- start */
648
- @tabs-font-color: @secondary-text-color;
649
- @tabs-border-color: @strong-border-color;
650
- @tabPane-font-size: @font-size;
651
- @tabPane-font-color-active: @theme-color;
652
- @tabPane-font-color-hover: @theme-color;
653
- @tabPane-font-color-disabled: @disabled-color;
654
- @tab-line-color-active: @theme-color;
655
- @tabs-card-bg: @disabled-contain-bg;
656
- @tabs-height: 48px;
657
- @tabs-border-width: 1px;
658
- @tab-pane-height: 48px;
659
- @tab-pane-line-height: 48px;
660
- @tab-pane-margin-right: 24px;
661
- @tab-transition-fn: cubic-bezier(0.42, 0, 1, 1);
662
- /* ----------- Tabs ——————---- end */
663
-
664
- /* ----------- Select ——————---- start */
665
- @select-dropdown-bg: @bg;
666
- @select-item-active-bg: #F5F5F5;
667
- @select-dropdown-height: 22px;
668
- @select-list-font-size: 12px;// 下拉列表文字大小
669
- @select-large-font-size: 16px; // 大号字体
670
- @select-middle-font-size: 14px; // 中号高度
671
- @select-small-font-size: 12px; // 小号高度
672
- @select-dropdown-line-height: 22px;
673
- @select-item-selected-color: #276FF5;
674
- @select-item-selected-bg: #F2F9FF;
675
- @select-font-color: #212121;
676
- @select-large-height: 36px; // 大号高度 lh:28px
677
- @select-middle-height: 30px; // 中号高度lh:22px
678
- @select-small-height: 20px; // 小号高度lh:12px
679
- @select-large-line-height: 28px;
680
- @select-middle-line-height: 22px;
681
- @select-small-line-height: 12px;
682
-
683
- /* ----------- Select ——————---- end */
684
- /* ----------- Rate ——————---- start */
685
- @rate-selected-color: #fdc200;
686
- @rate-not-selected-color: #d9d9d9;
687
- @rate-icon-margin: 10px;
688
- @rate-small-font-size: @small-font-size;
689
- @rate-middle-font-size: @middle-font-size;
690
- @rate-large-font-size: @large-font-size;
691
- /* ----------- Rate ——————---- end */
692
-
693
- /* ----------- Dropdown ——————---- start */
694
- @dropdown-menu-min-width: 136px;
695
- @dropdown-menu-max-width: 320px;
696
- @dropdown-menu-max-height: 336px;
697
- @dropdown-menu-gap: 8px;
698
- @dropdown-line-height: 18px;
699
- @dropdown-color: @primary-text-color;
700
- @dropdown-divided-color: @weak-border-color;
701
- @dropdown-hover-bg-color: @disabled-contain-bg;
702
- @dropdown-active-bg-color: @theme-color-active-light;
703
- @dropdown-font-size: @small-font-size;
704
- @dropdown-item-vertical-gap: 7px;
705
- @dropdown-item-horizontal-gap: 12px;
706
- @dropdown-box-shadow-blur: 10px;
707
- @dropdown-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
708
- @dropdown-duration: 0.2s;
709
- /* ----------- Dropdown ——————---- end */
710
-
711
- /* ----------- Tooltip ——————---- start */
712
- @tooltip-width: 267px;
713
- @tooltip-line-height: 18px;
714
- @tooltip-color: @primary-text-color;
715
- @tooltip-font-size: @small-font-size;
716
- @tooltip-vertical-gap: 8px;
717
- @tooltip-horizontal-gap: 12px;
718
- @tooltip-background-color: @white;
719
- @tooltip-box-shadow-blur: 6px;
720
- /* ----------- Tooltip ——————---- end */
721
-
722
- /* ----------- Transfer ——————---- start */
723
- @transfer-disabled-bg: @disabled-contain-bg;
724
- @transfer-border-color: @strong-border-color;
725
- @transfer-padding-base: 14px;
726
- @transfer-font-size-base: 12px;
727
- @transfer-list-item-height: 32px;
728
- @transfer-list-content-height: @transfer-list-item-height * 10;
729
- @transfer-list-item-hover-bg: @hover-color;
730
- @transfer-list-item-checked: @theme-color;
731
- @transfer-list-item-disabled: @disabled-color;
732
- @transfer-header-bg: #f5f5f5;
733
- @transfer-header-height: 36px;
734
- @transfer-search-height: 32px;
735
- @transfer-search-prefix-icon-color: @theme-color;
736
- @transfer-search-suffix-icon-color: #bbb;
737
- @transfer-pagination-height: 36px;
738
- /* ----------- Transfer ——————---- end */
739
-
740
- /* ----------- Alert ——————---- start */
741
- @success-alert-bg-color: @success-bg-color; // 反馈浮层成功提示的背景色
742
- @warning-alert-bg-color: @warning-bg-color; // 反馈浮层警告提示的背景色
743
- @error-alert-bg-color: @error-bg-color; // 反馈浮层错误提示的背景色
744
- @info-alert-bg-color: @ongoing-bg-color; // 反馈浮层一般提示的背景色
745
- @alert-transition-fn: cubic-bezier(0.32, 0.94, 0.6, 1);
746
- /* ----------- Alert ——————---- end */
747
-
748
- /* ----------- Split-Panel ——————---- start */
749
- @split-panel-trigger-border-color: #ccc;
750
- @split-panel-trigger-arrow-color: #a7b5d3;
751
- @split-panel-trigger-arrow-hover-color: @theme-color;
752
- @split-panel-trigger-line-width: 1px;
753
- @split-panel-trigger-line-color: @split-panel-trigger-border-color;
754
- /* ----------- Split-Panel ——————---- end */
755
-
756
- /* ----------- Modal ——————---- start */
757
- @confirm-modal-title-icon-bg: @ongoing-bg-color; // 提示弹窗的背景色
758
- @warning-modal-title-icon-bg: @warning-bg-color; // 警告弹窗的背景色
759
- @error-modal-title-icon-bg: @error-bg-color; // 反馈浮层错误提示的背景色
760
- /* ----------- Modal ——————---- end */
761
-
762
- /* ----------- Steps ——————---- start */
763
- @steps-transition-fn: cubic-bezier(0.48, 0.04, 0.52, 0.96);
764
- /* ----------- Steps ——————---- end */
765
- /* ----------- Tag ——————---- start */
766
- @tag-font-size: 12px;
767
- @tag-border-radius: 10px;
768
- @tag-height: 18px;
769
- @tag-process-color: @ongoing-color;
770
- @tag-success-color: @success-color;
771
- @tag-warning-color: @warning-color;
772
- @tag-error-color: @error-color;
773
- @tag-end-color: @end-color;
774
- @tag-expired-color: @disabled-color;
775
- /* ----------- Tag ——————---- end */
776
-
777
-
778
1
 
2
+ @kd-prefix: kd;
3
+
4
+ /* ----------- color ——————---- start */
5
+ @theme-color: #5582f3; // 主题色
6
+ // 使用hsb/hsv 计算色值
7
+ @hsv-h: hsvhue(@theme-color); // 色相
8
+ @hsv-s: hsvsaturation(@theme-color); // 饱和度
9
+ @hsv-v: hsvvalue(@theme-color); // 明度
10
+
11
+ @theme-color-disabled: hsv(@hsv-h, max(5%, (@hsv-s - 54%)), min((@hsv-v + 24%), 100%)); // 禁用色
12
+ @theme-color-hover: hsv(@hsv-h, max(5%, (@hsv-s - 18%)), min((@hsv-v + 8%), 100%)); // 悬浮色
13
+ @theme-color-click: hsv(@hsv-h, min((@hsv-s + 8%), 100%), max(5%, (@hsv-v - 16%))); // 点击色
14
+ @theme-color-active-light: hsv(@hsv-h, max(5%, (@hsv-s - 90%)), min((@hsv-v + 40%), 100%)); // 浅色选中
15
+ @theme-color-active-dark: @theme-color; // 深色选中
16
+ @hover-color: #f5f5f5; // 中性的悬停色
17
+ @disabled-contain-bg: #f5f5f5; // 容器失效背景色
18
+ @success-color: #1ba854; // 成功色(深)
19
+ @success-bg-color: #f2fff5; // 成功反馈浮层的底色
20
+ @success-border-color: #6dd18e; // 成功反馈浮层的容器边框色
21
+ @warning-color: #ff991c; // 警示色(深)
22
+ @warning-bg-color: #fffbf2; // 警示反馈浮层的底色
23
+ @warning-border-color: #ffcb78; // 警示反馈浮层的容器边框色
24
+ @error-color: #fb2323; // 失败色(深)
25
+ @error-bg-color: #fff2f4; // 失败反馈浮层的底色
26
+ @error-border-color: #ff8088; // 失败反馈浮层的容器边框色
27
+ @ongoing-color: #276ff5; // 进行中(深)
28
+ @ongoing-bg-color: #f2f9ff; // 进行中反馈浮层的底色
29
+ @ongoing-border-color: #85b8ff; // 进行中反馈浮层的容器边框色
30
+ @disabled-color: #b2b2b2; // 失效色
31
+ @disabled-border-color: #ccc; // 失效边框色
32
+ @end-color: #666; // 暂停或者终止等状态标签色
33
+ @link-color: #0e5fd8; // 链接色
34
+ @link-color-hover: #3987ed; // 链接色或辅助色(悬浮)
35
+ @link-color-active: #0041b0; // 链接色或辅助色(点击)
36
+ @primary-text-color: #212121; // 一级文本
37
+ @primary-text-color2: rgba(255, 255, 255, 1); // 一级文本
38
+ @secondary-text-color: #666; // 二级文本
39
+ @secondary-text-color2: rgba(255, 255, 255, 0.65); // 二级文本
40
+ @third-text-color: #999; // 三级文本
41
+ @third-text-color2: rgba(255, 255, 255, 0.4); // 三级文本
42
+ @placeholder-text-color: #ccc; // 占位符文本
43
+ @placeholder-text-color2: rgba(255, 255, 255, 0.3); // 占位符文本
44
+ @bg: #fff; // 底色白背景
45
+ @bg2: #f2f2f2; // 底色灰背景
46
+ @contain-bg: #fafafa; // 容器内的灰背景
47
+ @radius-size: 2px; // 圆角值
48
+ @input-color: #999; // 线型录入的默认态
49
+ @strong-border-color: #d9d9d9; // 强线条 --带操作
50
+ @strong-border-color-1: #d9d9d9; // 强线条 --分割内容/容器包裹线
51
+ @weak-border-color: #e5e5e5; // 弱线条 -- 需要多层级时
52
+ // @shadow-on-hover: ; // 悬停时阴影
53
+ @white: #fff;
54
+ @dirList: left, top, bottom, right;
55
+ /* ----------- color ——————---- end */
56
+
57
+ /* ----------- font ——————---- start */
58
+ @font-size: 14px;
59
+ @font-weight: 400;
60
+ @small-font-size: 12px;
61
+ @middle-font-size: 14px;
62
+ @large-font-size: 16px;
63
+ @xlarge-font-size: 18px;
64
+ /* ----------- font ——————---- end */
65
+
66
+ @radius-size: 2px; // 圆角值
67
+
68
+ /* ----------- zIndex ——————---- start */
69
+ /*
70
+ 普通组件内部自身层级应设置在0-100间
71
+ */
72
+ @zIndex-below: -1; // 置于下层
73
+ @zIndex-popper: 1000; // 弹出层
74
+ @zIndex-dialog: 1050; // 对话框
75
+ @zIndex-masker: 3000; // 遮罩层 (loading等)
76
+ @zIndex-apex: 9999; // 顶层 (notify)
77
+ /* ----------- zIndex ——————---- end */
78
+
79
+ /* ----------- transition ——————---- start */
80
+ @transition-duration: 0.3s;
81
+ /* ----------- transition ——————---- end */
82
+
83
+ /* ----------- Button ——————---- start */
84
+ @btn-border-width: 1px;
85
+ @btn-border-style: solid;
86
+ @btn-primary-font-color: @white; // 基础文字颜色
87
+ @btn-primary-background-color: @theme-color; // 基础背景颜色
88
+ @btn-primary-border-color: @theme-color; // 基础边框颜色
89
+
90
+ @btn-ghost-font-color: @secondary-text-color; // 幽灵按钮文字颜色
91
+ @btn-ghost-background-color: transparent; // 幽灵背景颜色
92
+ @btn-ghost-border-color: @strong-border-color; //幽灵边框颜色
93
+
94
+ @btn-second-font-color: fade(@secondary-text-color, 65%); // 次要文字颜色
95
+ @btn-second-background-color: fade(@white, 65%); // 次要背景颜色
96
+ @btn-second-border-color: fade(@strong-border-color, 65%); // 次要边框颜色
97
+
98
+ @btn-link-font-color: @link-color; // 链接文字颜色
99
+
100
+ @btn-disabled-font-color: @white; // 禁用状态 文字颜色
101
+ @btn-disabled-background-color: @disabled-contain-bg; // 禁用状态 背景颜色
102
+ @btn-disabled-border-color: @strong-border-color; // 禁用状态 边框颜色
103
+
104
+ @btn-danger-font-color: @white; // 危险状态 文字颜色
105
+ @btn-danger-background-color: @error-color; // 危险状态 背景颜色
106
+ @btn-danger-border-color: @error-color; // 危险状态 边框颜色
107
+
108
+ @btn-small-font-size: @small-font-size; // 小号 文字大小
109
+ @btn-small-height: 24px; // 小号 高度
110
+ @btn-small-min-width: 60px; // 小号 最小宽度
111
+ @btn-small-padding-vertical: 3px; // 小号 内间距 纵向
112
+ @btn-small-padding-horizontal: 8px; // 小号 内间距 横向
113
+
114
+ @btn-middle-font-size: @small-font-size; // 中号 文字大小
115
+ @btn-middle-height: 28px; // 中号 高度
116
+ @btn-middle-min-width: 60px; // 中号 最小宽度
117
+ @btn-middle-padding-vertical: 5px; // 中号 内间距 纵向
118
+ @btn-middle-padding-horizontal: 8px; // 中号 内间距 纵向
119
+
120
+ @btn-large-font-size: @large-font-size; // 大号 文字大小
121
+ @btn-large-height: 32px; // 大号 高度
122
+ @btn-large-min-width: 80px; // 大号 最小宽度
123
+ @btn-large-padding-vertical: 6px; // 大号 内间距 纵向
124
+ @btn-large-padding-horizontal: 8px; // 大号 内间距 横向
125
+ @btn-transition-fn: cubic-bezier(0.075, 0.82, 0.165, 1);
126
+ /* ----------- Button ——————---- end */
127
+
128
+ /* ----------- Collapse ——————---- start */
129
+ @collapse-border-width: 1px;
130
+ @collapse-border-color: @strong-border-color-1;
131
+ @collapse-icon-margin-right: 6px;
132
+ @collapse-header-font-color: @primary-text-color;
133
+ @collapse-header-font-size: @font-size;
134
+ @collapse-content-font-color: @primary-text-color;
135
+ @collapse-content-font-size: @font-size;
136
+ @collapse-content-padding: 10px 0px 0px 20px;
137
+ @collapse-disabled-color: @disabled-color;
138
+
139
+ /* ----------- Collapse ——————---- end */
140
+
141
+ /* ----------- Switch ——————---- start */
142
+ @switch-small-font-size: @small-font-size;
143
+ @switch-small-line-height: 14px;
144
+ @switch-small-height: 14px;
145
+ @switch-small-min-width: 28px;
146
+ @switch-small-border-radius: 7px;
147
+ @switch-large-font-size: @small-font-size;
148
+ @switch-large-line-height: 20px;
149
+ @switch-large-height: 20px;
150
+ @switch-large-min-width: 40px;
151
+ @switch-large-border-radius: 10px;
152
+ @switch-on-color: @theme-color;
153
+ @switch-off-color: #999;
154
+ @switch-disabled-bg: @disabled-color;
155
+ @switch-loading-color: @ongoing-color;
156
+ @switch-font-color: @white;
157
+ @switch-inner-small-font-size: @small-font-size;
158
+ @switch-inner-margin: 0 5px 0 16px;
159
+ @switch-inner-checked-margin: 0 16px 0 5px;
160
+ @switch-inner-large-margin: 0 5px 0 21px;
161
+ @switch-inner-large-checked-margin: 0 21px 0 5px;
162
+ /* ----------- Switch ——————---- end */
163
+
164
+ /* ----------- Input ——————---- start */
165
+ @input-placeholder-color: @third-text-color;
166
+ @input-font-color: @secondary-text-color;
167
+ @input-focus-color: @primary-text-color;
168
+ @input-background-color: @white;
169
+ @input-border-width: 1px;
170
+ @input-width: 230px;
171
+
172
+ @input-small-font-size: @small-font-size; // 小号 文字大小
173
+ @input-small-height: 20px; // 小号 高度
174
+ @input-small-padding-vertical: 3px; // 小号 内间距 纵向
175
+ @input-small-padding-horizontal: 9px; // 小号 内间距 横向
176
+
177
+ @input-middle-font-size: @middle-font-size; // 中号 文字大小
178
+ @input-middle-height: 30px; // 中号 高度
179
+ @input-middle-padding-vertical: 5px; // 中号 内间距 纵向
180
+ @input-middle-padding-horizontal: 9px; // 中号 内间距 纵向
181
+
182
+ @input-large-font-size: @large-font-size; // 大号 文字大小
183
+ @input-large-height: 36px; // 大号 高度
184
+ @input-large-padding-vertical: 8px; // 大号 内间距 纵向
185
+ @input-large-padding-horizontal: 9px; // 大号 内间距 横向
186
+ /* ----------- Input ——————---- end */
187
+
188
+ /* ----------- InputNumber ——————---- start */
189
+ @inputNumber-embedStepBtn-bg-color: #f6f7f9;
190
+ /* ----------- InputNumber ——————---- end */
191
+
192
+ /* ----------- checkbox ——————---- start */
193
+ @checkbox-font-size: @small-font-size; //默认字体大小
194
+ @checkbox-font-color: @primary-text-color;
195
+ @checkbox-border-color: @strong-border-color;
196
+ @checkbox-checked-border-color: @theme-color-active-dark;
197
+ @checkbox-checked-font-color: @theme-color-active-dark;
198
+ @checkbox-bg-color: @bg;
199
+ @checkbox-disabled-bg-color: @disabled-color;
200
+ @checkbox-small-size-height: 32px; // 小尺寸复选框
201
+ @checkbox-middle-size-height: 36px; // 中尺寸复选框
202
+ @checkbox-large-size-height: 40px; // 大尺寸复选框
203
+ @checkbox-border-width: 1px; // 边框类型边框大小
204
+ @checkbox-group-margin-right: 8px; // 按钮组的间距
205
+ @checkbox-default-padding: 0; // 默认类型复选框内边距
206
+ @checkbox-default-input-margin-right: 8px; // 勾选输入框与右侧内容间距
207
+ @checkbox-default-input-height: 16px; // 勾选输入框高度
208
+ @checkbox-default-input-width: 16px; // 勾选输入框宽度
209
+ @checkbox-default-input-border-radius: 4px; // 勾选输入框圆角
210
+ @checkbox-default-input-border-width: 1px; // 勾选输入框边框大小
211
+ @checkbox-default-input-icon-color: #fff; // 勾选输入框边勾勾图标颜色
212
+ @checkbox-default-input-icon-size: 12px; // 勾选输入框勾勾图标大小
213
+ @checkbox-square-padding: 0 20px; // 边框类型内边距
214
+ @checkbox-square-triangle-height: 18px; // 边框类型右下角三角高度
215
+ @checkbox-square-triangle-width: 18px; // 边框类型右下角三角宽度
216
+ @checkbox-square-input-icon-color: #fff; // 边框类型三角内勾选输入框勾勾图标颜色
217
+ @checkbox-square-input-icon-size: 9px; // 边框类型三角内勾选输入框勾勾图标大小
218
+ /* ----------- checkbox ——————---- end */
219
+
220
+ /* ----------- Radio ——————---- start */
221
+ @radio-font-size: @small-font-size;
222
+ @radio-font-color: @primary-text-color;
223
+ @radio-border-width: 1px;
224
+ @radio-margin-right: 8px;
225
+ @radio-transition-fn: cubic-bezier(0.075, 0.82, 0.165, 1);
226
+ @radio-circle-size: 13px;
227
+ @radio-square-height: 32px;
228
+ @radio-square-padding: 0 20px;
229
+ @radio-button-height: 24px;
230
+ @radio-button-padding: 0 18px;
231
+ /* ----------- Radio ——————---- end */
232
+
233
+ /* ----------- icon ——————---- start */
234
+ @icon-css-prefix: kdicon;
235
+ /* ----------- icon ——————---- end */
236
+
237
+ /* ----------- Popconfirm ——————---- start */
238
+ @popconfirm-icon-size: 17px;
239
+ @popconfirm-min-width: 164px;
240
+ @popconfirm-max-width: 500px;
241
+ @popconfirm-min-height: 98px;
242
+ @popconfirm-max-height: 400px;
243
+ @popconfirm-title-line-height: 21px;
244
+ @popconfirm-color: @primary-text-color;
245
+ @popconfirm-font-size: @small-font-size;
246
+ @popconfirm-title-font-size: @middle-font-size;
247
+ @popconfirm-vertical-gap: 16px;
248
+ @popconfirm-horizontal-gap: 16px;
249
+ @popconfirm-background-color: @white;
250
+ @popconfirm-box-shadow-blur: 6px;
251
+ @popconfirm-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
252
+ @popconfirm-duration: 0.2s;
253
+ /* ----------- Popconfirm ——————---- end */
254
+
255
+ /* ----------- Popover ——————---- start */
256
+ @popover-min-width: 164px;
257
+ @popover-max-width: 500px;
258
+ @popover-min-height: 98px;
259
+ @popover-max-height: 400px;
260
+ @popover-title-line-height: 21px;
261
+ @popover-color: @primary-text-color;
262
+ @popover-font-size: @small-font-size;
263
+ @popover-title-font-size: @middle-font-size;
264
+ @popover-vertical-gap: 16px;
265
+ @popover-horizontal-gap: 16px;
266
+ @popover-background-color: @white;
267
+ @popover-box-shadow-blur: 6px;
268
+ @popover-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
269
+ @popover-duration: 0.2s;
270
+ /* ----------- Popover ——————---- end */
271
+
272
+ /* ----------- Progress ——————---- start */
273
+ @progress-remaining-color: #e5e5e5;
274
+ @progress-default-color: @ongoing-color;
275
+ @progress-success-color: @success-color;
276
+ @progress-failure-color: @error-color;
277
+ @progress-border-radius: 100px;
278
+ @progress-line-stroke-width: 8px;
279
+ @progress-line-text-width: 3em;
280
+ @progress-line-icon-font-size: 16px;
281
+ @progress-line-text-font-size: 16px;
282
+ @progress-line-special-text-font-size: 16px;
283
+ @progress-line-text-margin-left: 8px;
284
+ @progress-circle-stroke-width: 4px;
285
+ @progress-transition-fn: cubic-bezier(0.66, 0, 0.34, 1);
286
+ @progress-circle-text-font-size: 28px;
287
+ @progress-circle-percent-line-height: 48px;
288
+ @progress-circle-unit-line-height: 18px;
289
+ @progress-circle-unit-font-size: 12px;
290
+ @progress-circle-unit-margin-top: 18px;
291
+ @progress-circle-icon-font-size: 48px;
292
+ /* ----------- Progress ——————---- end */
293
+
294
+ /* ----------- Pagination ——————---- start */
295
+ @pagination-size: 24px;
296
+ @pagination-nicety-size: 30px;
297
+ @pagination-button-gap: 8px;
298
+ @pagination-hover-color: @theme-color;
299
+ @pagination-font-size: @small-font-size;
300
+ @pagination-icon-size: @large-font-size;
301
+ @pagination-font-color: @secondary-text-color;
302
+ @pagination-button-color: @secondary-text-color;
303
+ @pagination-button-disabled-color: @disabled-border-color;
304
+ @pagination-button-disabled-background-color: @disabled-contain-bg;
305
+ /* ----------- Pagination ——————---- end */
306
+
307
+ /* ----------- Timeline ——————---- start */
308
+ @timeline-width: 1px;
309
+ @timeline-dot-size: 12px;
310
+ @timeline-line-height: 18px;
311
+ @timeline-color: @weak-border-color;
312
+ @timeline-dot-border-width: 2px;
313
+ @timeline-dot-color: @theme-color;
314
+ @timeline-dot-bg: @white;
315
+ @timeline-item-padding-bottom: 26px;
316
+ /* ----------- Timeline ——————---- end */
317
+
318
+ /* ----------- Tabs ——————---- start */
319
+ @tabs-font-color: @secondary-text-color;
320
+ @tabs-border-color: @strong-border-color;
321
+ @tabPane-font-size: @font-size;
322
+ @tabPane-font-color-active: @theme-color;
323
+ @tabPane-font-color-hover: @theme-color;
324
+ @tabPane-font-color-disabled: @disabled-color;
325
+ @tab-line-color-active: @theme-color;
326
+ @tabs-card-bg: @disabled-contain-bg;
327
+ @tabs-height: 48px;
328
+ @tabs-border-width: 1px;
329
+ @tab-pane-height: 48px;
330
+ @tab-pane-line-height: 48px;
331
+ @tab-pane-margin-right: 24px;
332
+ @tab-transition-fn: cubic-bezier(0.42, 0, 1, 1);
333
+ /* ----------- Tabs ——————---- end */
334
+
335
+ /* ----------- Select ——————---- start */
336
+ @select-dropdown-bg: @bg;
337
+ @select-item-active-bg: #F5F5F5;
338
+ @select-dropdown-height: 22px;
339
+ @select-list-font-size: 12px;// 下拉列表文字大小
340
+ @select-large-font-size: 16px; // 大号字体
341
+ @select-middle-font-size: 14px; // 中号高度
342
+ @select-small-font-size: 12px; // 小号高度
343
+ @select-dropdown-line-height: 22px;
344
+ @select-item-selected-color: #276FF5;
345
+ @select-item-selected-bg: #F2F9FF;
346
+ @select-font-color: #212121;
347
+ @select-large-height: 36px; // 大号高度 lh:28px
348
+ @select-middle-height: 30px; // 中号高度lh:22px
349
+ @select-small-height: 20px; // 小号高度lh:12px
350
+ @select-large-line-height: 28px;
351
+ @select-middle-line-height: 22px;
352
+ @select-small-line-height: 12px;
353
+
354
+ /* ----------- Select ——————---- end */
355
+ /* ----------- Rate ——————---- start */
356
+ @rate-selected-color: #fdc200;
357
+ @rate-not-selected-color: #d9d9d9;
358
+ @rate-icon-margin: 10px;
359
+ @rate-small-font-size: @small-font-size;
360
+ @rate-middle-font-size: @middle-font-size;
361
+ @rate-large-font-size: @large-font-size;
362
+ /* ----------- Rate ——————---- end */
363
+
364
+ /* ----------- Dropdown ——————---- start */
365
+ @dropdown-menu-min-width: 136px;
366
+ @dropdown-menu-max-width: 320px;
367
+ @dropdown-menu-max-height: 336px;
368
+ @dropdown-menu-gap: 8px;
369
+ @dropdown-line-height: 18px;
370
+ @dropdown-color: @primary-text-color;
371
+ @dropdown-divided-color: @weak-border-color;
372
+ @dropdown-hover-bg-color: @disabled-contain-bg;
373
+ @dropdown-active-bg-color: @theme-color-active-light;
374
+ @dropdown-font-size: @small-font-size;
375
+ @dropdown-item-vertical-gap: 7px;
376
+ @dropdown-item-horizontal-gap: 12px;
377
+ @dropdown-box-shadow-blur: 10px;
378
+ @dropdown-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
379
+ @dropdown-duration: 0.2s;
380
+ /* ----------- Dropdown ——————---- end */
381
+
382
+ /* ----------- Tooltip ——————---- start */
383
+ @tooltip-width: 267px;
384
+ @tooltip-line-height: 18px;
385
+ @tooltip-color: @primary-text-color;
386
+ @tooltip-font-size: @small-font-size;
387
+ @tooltip-vertical-gap: 8px;
388
+ @tooltip-horizontal-gap: 12px;
389
+ @tooltip-background-color: @white;
390
+ @tooltip-box-shadow-blur: 6px;
391
+ /* ----------- Tooltip ——————---- end */
392
+
393
+ /* ----------- Transfer ——————---- start */
394
+ @transfer-disabled-bg: @disabled-contain-bg;
395
+ @transfer-border-color: @strong-border-color;
396
+ @transfer-padding-base: 14px;
397
+ @transfer-font-size-base: 12px;
398
+ @transfer-list-item-height: 32px;
399
+ @transfer-list-content-height: @transfer-list-item-height * 10;
400
+ @transfer-list-item-hover-bg: @hover-color;
401
+ @transfer-list-item-checked: @theme-color;
402
+ @transfer-list-item-disabled: @disabled-color;
403
+ @transfer-header-bg: #f5f5f5;
404
+ @transfer-header-height: 36px;
405
+ @transfer-search-height: 32px;
406
+ @transfer-search-prefix-icon-color: @theme-color;
407
+ @transfer-search-suffix-icon-color: #bbb;
408
+ @transfer-pagination-height: 36px;
409
+ /* ----------- Transfer ——————---- end */
410
+
411
+ /* ----------- Alert ——————---- start */
412
+ @success-alert-bg-color: @success-bg-color; // 反馈浮层成功提示的背景色
413
+ @warning-alert-bg-color: @warning-bg-color; // 反馈浮层警告提示的背景色
414
+ @error-alert-bg-color: @error-bg-color; // 反馈浮层错误提示的背景色
415
+ @info-alert-bg-color: @ongoing-bg-color; // 反馈浮层一般提示的背景色
416
+ @alert-transition-fn: cubic-bezier(0.32, 0.94, 0.6, 1);
417
+ /* ----------- Alert ——————---- end */
418
+
419
+ /* ----------- Split-Panel ——————---- start */
420
+ @split-panel-trigger-border-color: #ccc;
421
+ @split-panel-trigger-arrow-color: #a7b5d3;
422
+ @split-panel-trigger-arrow-hover-color: @theme-color;
423
+ @split-panel-trigger-line-width: 1px;
424
+ @split-panel-trigger-line-color: @split-panel-trigger-border-color;
425
+ /* ----------- Split-Panel ——————---- end */
426
+
427
+ /* ----------- Modal ——————---- start */
428
+ @confirm-modal-title-icon-bg: @ongoing-bg-color; // 提示弹窗的背景色
429
+ @warning-modal-title-icon-bg: @warning-bg-color; // 警告弹窗的背景色
430
+ @error-modal-title-icon-bg: @error-bg-color; // 反馈浮层错误提示的背景色
431
+ /* ----------- Modal ——————---- end */
432
+
433
+ /* ----------- Steps ——————---- start */
434
+ @steps-transition-fn: cubic-bezier(0.48, 0.04, 0.52, 0.96);
435
+ /* ----------- Steps ——————---- end */
436
+ /* ----------- Tag ——————---- start */
437
+ @tag-font-size: 12px;
438
+ @tag-border-radius: 10px;
439
+ @tag-height: 18px;
440
+ @tag-process-color: @ongoing-color;
441
+ @tag-success-color: @success-color;
442
+ @tag-warning-color: @warning-color;
443
+ @tag-error-color: @error-color;
444
+ @tag-end-color: @end-color;
445
+ @tag-expired-color: @disabled-color;
446
+ /* ----------- Tag ——————---- end */
447
+
448
+ // color palettes
449
+ @blue-base: #1890ff;
450
+
451
+
452
+ @keyframes loadingcircle {
453
+ 100% {
454
+ transform: rotate(360deg);
455
+ }
456
+ }
457
+
458
+ @keyframes waveEffect {
459
+ 100% {
460
+ box-shadow: 0 0 0 6px @theme-color;
461
+ }
462
+ }
463
+
464
+ @keyframes fadeEffect {
465
+ 100% {
466
+ opacity: 0;
467
+ }
468
+ }
469
+
470
+ @keyframes kdRadioEffect {
471
+ 0% {
472
+ transform: translateY(-50%) scale(0.5);
473
+ opacity: 0;
474
+ }
475
+ 100% {
476
+ transform: translateY(-50%) scale(1);
477
+ opacity: 1;
478
+ }
479
+ }
480
+ @keyframes kdSlideDownIn {
481
+ 0% {
482
+ transform: scaleY(0.8);
483
+ transform-origin: 50% 0%;
484
+ opacity: 0;
485
+ }
486
+ 100% {
487
+ transform: scaleY(1);
488
+ transform-origin: 50% 0%;
489
+ opacity: 1;
490
+ }
491
+ }
492
+
493
+ @keyframes kdSlideDownOut {
494
+ 0% {
495
+ transform: scaleY(1);
496
+ transform-origin: 50% 0%;
497
+ opacity: 1;
498
+ }
499
+ 100% {
500
+ transform: scaleY(0.9);
501
+ transform-origin: 50% 0%;
502
+ opacity: 0;
503
+ }
504
+ }
505
+
506
+ @keyframes kdSlideUpIn {
507
+ 0% {
508
+ transform-origin: 50% 100%;
509
+ opacity: 0;
510
+ }
511
+ 5% {
512
+ transform: scaleY(0.8);
513
+ }
514
+ 100% {
515
+ transform: scaleY(1);
516
+ transform-origin: 50% 100%;
517
+ opacity: 1;
518
+ }
519
+ }
520
+
521
+ @keyframes kdSlideUpOut {
522
+ 0% {
523
+ transform: scaleY(1);
524
+ transform-origin: 50% 100%;
525
+ opacity: 1;
526
+ }
527
+ 100% {
528
+ transform: scaleY(0.9);
529
+ transform-origin: 50% 100%;
530
+ opacity: 0;
531
+ }
532
+ }
533
+
534
+
535
+
536
+ /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
537
+
538
+ /* normalize.css 和现有产品的结合版本, 根据兼容性进行了调整 */
539
+ /* Document
540
+ ========================================================================== */
541
+
542
+ /* Sections
543
+ ========================================================================== */
544
+
545
+ /**
546
+ * Remove the margin in all browsers.
547
+ */
548
+ html,body {
549
+ height: 100%;
550
+ padding: 0;
551
+ margin: 0;
552
+ font-size:12px;
553
+
554
+ }
555
+
556
+ html,body,input, textarea, select, button{
557
+ font-family:"Microsoft YaHei","PingFangSC-Regular","Helvetica Neue", Helvetica, Arial,"Hiragino Sans GB","WenQuanYi Micro Hei", sans-serif;
558
+ }
559
+
560
+ body {
561
+ box-sizing: border-box;
562
+ }
563
+
564
+ /**
565
+ * Remove the gray background on active links in IE 10.
566
+ */
567
+
568
+ a {
569
+ background-color: transparent;
570
+ }
571
+
572
+
573
+ /* Forms
574
+ ========================================================================== */
575
+
576
+ /**
577
+ */
578
+ input {
579
+ padding: 0;
580
+ margin: 0;
581
+ }
582
+ /**
583
+ * 1. Change the font styles in all browsers.
584
+ * 2. Remove the margin in Firefox and Safari.
585
+ */
586
+
587
+ button,
588
+ input,
589
+ optgroup,
590
+ select,
591
+ textarea {
592
+ margin: 0; /* 2 */
593
+ }
594
+
595
+ /**
596
+ * Show the overflow in IE.
597
+ * 1. Show the overflow in Edge.
598
+ */
599
+
600
+ button,
601
+ input { /* 1 */
602
+ overflow: visible;
603
+ }
604
+
605
+ /**
606
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
607
+ * 1. Remove the inheritance of text transform in Firefox.
608
+ */
609
+
610
+ button,
611
+ select { /* 1 */
612
+ text-transform: none;
613
+ }
614
+
615
+ /**
616
+ * Correct the inability to style clickable types in iOS and Safari.
617
+ */
618
+
619
+ button,
620
+ [type="button"],
621
+ [type="reset"],
622
+ [type="submit"] {
623
+ -webkit-appearance: button;
624
+ }
625
+
626
+ /**
627
+ * Remove the inner border and padding in Firefox.
628
+ */
629
+
630
+ button::-moz-focus-inner,
631
+ [type="button"]::-moz-focus-inner,
632
+ [type="reset"]::-moz-focus-inner,
633
+ [type="submit"]::-moz-focus-inner {
634
+ border-style: none;
635
+ padding: 0;
636
+ }
637
+
638
+ /**
639
+ * Restore the focus styles unset by the previous rule.
640
+ */
641
+
642
+ button:-moz-focusring,
643
+ [type="button"]:-moz-focusring,
644
+ [type="reset"]:-moz-focusring,
645
+ [type="submit"]:-moz-focusring {
646
+ outline: 1px dotted ButtonText;
647
+ }
648
+
649
+ /**
650
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
651
+ */
652
+
653
+ progress {
654
+ vertical-align: baseline;
655
+ }
656
+
657
+ /**
658
+ * Remove the default vertical scrollbar in IE 10+.
659
+ */
660
+
661
+ textarea {
662
+ overflow: auto;
663
+ }
664
+
665
+ /**
666
+ * 1. Add the correct box sizing in IE 10.
667
+ * 2. Remove the padding in IE 10.
668
+ */
669
+
670
+ [type="checkbox"],
671
+ [type="radio"] {
672
+ box-sizing: border-box; /* 1 */
673
+ padding: 0; /* 2 */
674
+ }
675
+
676
+ /**
677
+ * Correct the cursor style of increment and decrement buttons in Chrome.
678
+ */
679
+
680
+ [type="number"]::-webkit-inner-spin-button,
681
+ [type="number"]::-webkit-outer-spin-button {
682
+ height: auto;
683
+ }
684
+
685
+ /**
686
+ * 1. Correct the odd appearance in Chrome and Safari.
687
+ * 2. Correct the outline style in Safari.
688
+ */
689
+
690
+ [type="search"] {
691
+ -webkit-appearance: textfield; /* 1 */
692
+ outline-offset: -2px; /* 2 */
693
+ }
694
+
695
+ /**
696
+ * Remove the inner padding in Chrome and Safari on macOS.
697
+ */
698
+
699
+ [type="search"]::-webkit-search-decoration {
700
+ -webkit-appearance: none;
701
+ }
702
+
703
+
704
+ /* Misc
705
+ ========================================================================== */
706
+
707
+ /**
708
+ * Add the correct display in IE 10+.
709
+ */
710
+
711
+ template {
712
+ display: none;
713
+ }
714
+
715
+ /**
716
+ * Add the correct display in IE 10.
717
+ */
718
+
719
+ [hidden] {
720
+ display: none;
721
+ }
722
+
723
+
724
+ // Mixins
725
+ //----------------------------------------
726
+
727
+
728
+ /* 多行显示省略号 */
729
+ .multilpleEllipsis(@n: n) {
730
+ overflow: hidden;
731
+ text-overflow: ellipsis;
732
+ display: -webkit-box;
733
+ -webkit-line-clamp: @n;
734
+ -webkit-box-orient: vertical;
735
+ }
736
+
737
+ /* 单行显示省略号 */
738
+ .ellipsis() {
739
+ white-space: nowrap;
740
+ overflow: hidden;
741
+ text-overflow: ellipsis;
742
+ }
743
+
744
+
745
+ .overlay(@bgcolor, @isUseMaskZindex) {
746
+ position: fixed;
747
+ background-color: @bgcolor;
748
+ z-index: if(boolean(@isUseMaskZindex), @zIndex-masker, auto);
749
+ .overall-postion()
750
+ }
751
+
752
+ .overall-postion {
753
+ left: 0;
754
+ right: 0;
755
+ top: 0;
756
+ bottom: 0;
757
+ }
758
+
759
+ .static-overlay(@bgcolor, @isUseMaskZindex) {
760
+ width: 100%;
761
+ height: 100%;
762
+ background-color: @bgcolor;
763
+ z-index: if(boolean(@isUseMaskZindex), @zIndex-masker, auto);
764
+ }
765
+
766
+
767
+ @font-variant: tabular-nums;
768
+ @font-feature-settings: 'tnum';
769
+
770
+ .reset-component() {
771
+ box-sizing: border-box;
772
+ margin: 0;
773
+ padding: 0;
774
+ font-variant: @font-variant;
775
+ list-style: none;
776
+ font-feature-settings: @font-feature-settings;
777
+ }
778
+
779
779