@chaoswise/business 0.0.18 → 1.0.1

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 (91) hide show
  1. package/config/babel/index.js +2 -29
  2. package/config/swc.js +5 -0
  3. package/lib/AggregateSearch/CLSPL/SPLStagy.js +17 -7
  4. package/lib/AggregateSearch/CLSPL/index.js +17 -5
  5. package/lib/AggregateSearch/components/CloseAllIcon/index.js +1 -1
  6. package/lib/AggregateSearch/components/DropDown/config.js +54 -0
  7. package/lib/AggregateSearch/components/DropDown/index.js +57 -76
  8. package/lib/AggregateSearch/components/DropDown/index.less +18 -17
  9. package/lib/AggregateSearch/components/SwitchBtn/index.js +9 -7
  10. package/lib/AggregateSearch/index.js +47 -37
  11. package/lib/AggregateSearch/index.less +2 -1
  12. package/lib/AggregateSearch/utils/index.js +1 -1
  13. package/lib/ContentEditableSearch/components/CloseAllIcon/index.js +13 -0
  14. package/lib/ContentEditableSearch/components/CloseAllIcon/index.less +11 -0
  15. package/lib/ContentEditableSearch/index.js +157 -0
  16. package/lib/ContentEditableSearch/index.less +65 -0
  17. package/lib/ContentEditableSearch/utils/index.js +98 -0
  18. package/lib/PropertyControlViewer/components/DoAppIcon/CustomIcon/index.js +1 -1
  19. package/lib/PropertyControlViewer/components/DoCiUnitBitmap.js +1 -1
  20. package/lib/PropertyControlViewer/components/DoCommon.js +20 -17
  21. package/lib/PropertyControlViewer/components/DoQuote/components/QuoteView.js +3 -3
  22. package/lib/PropertyControlViewer/components/DoSelect.js +1 -1
  23. package/lib/PropertyControlViewer/components/DoUser.js +15 -19
  24. package/lib/PropertyControlViewer/components/TagShowMoreList/index.js +8 -3
  25. package/lib/PropertyControlViewer/config/utils.js +58 -59
  26. package/lib/PropertyControlViewer/index.js +83 -15
  27. package/lib/PropertyControlViewer/index.less +1 -0
  28. package/lib/Watermark/index.js +35 -16
  29. package/lib/index.js +2 -1
  30. package/lib/locales/en_US.json +1 -0
  31. package/lib/locales/index.js +42 -0
  32. package/lib/locales/intl.js +75 -0
  33. package/lib/locales/withLocale.js +37 -0
  34. package/lib/locales/zh_CN.json +1 -0
  35. package/lib/locales/zh_TW.json +1 -0
  36. package/package.json +12 -7
  37. package/config/babel/antdComs.js +0 -51
  38. package/config/babel/formily.js +0 -22
  39. package/config/city/citys.js +0 -1964
  40. package/config/theme/CWTheme.js +0 -427
  41. package/config/theme/chart.dark.js +0 -394
  42. package/config/theme/chart.light.js +0 -3
  43. package/config/theme/common.less +0 -161
  44. package/config/theme/dark.js +0 -784
  45. package/config/theme/dark.less +0 -80
  46. package/config/theme/default.js +0 -717
  47. package/config/theme/default.less +0 -144
  48. package/config/theme/style/color/bezierEasing.less +0 -110
  49. package/config/theme/style/color/colorPalette.less +0 -85
  50. package/config/theme/style/color/colors.less +0 -162
  51. package/config/theme/style/color/tinyColor.less +0 -1184
  52. package/config/theme/style/compact.less +0 -4
  53. package/config/theme/style/components.less +0 -65
  54. package/config/theme/style/core/base.less +0 -10
  55. package/config/theme/style/core/global.less +0 -491
  56. package/config/theme/style/core/iconfont.less +0 -22
  57. package/config/theme/style/core/index.less +0 -5
  58. package/config/theme/style/core/motion/fade.less +0 -34
  59. package/config/theme/style/core/motion/move.less +0 -129
  60. package/config/theme/style/core/motion/other.less +0 -51
  61. package/config/theme/style/core/motion/slide.less +0 -129
  62. package/config/theme/style/core/motion/zoom.less +0 -179
  63. package/config/theme/style/core/motion.less +0 -22
  64. package/config/theme/style/css.js +0 -3
  65. package/config/theme/style/dark.less +0 -4
  66. package/config/theme/style/default.css +0 -1784
  67. package/config/theme/style/default.less +0 -4
  68. package/config/theme/style/index-pure.less +0 -2
  69. package/config/theme/style/index.css +0 -1784
  70. package/config/theme/style/index.d.ts +0 -1
  71. package/config/theme/style/index.js +0 -3
  72. package/config/theme/style/index.less +0 -3
  73. package/config/theme/style/mixins/box.less +0 -7
  74. package/config/theme/style/mixins/clearfix.less +0 -16
  75. package/config/theme/style/mixins/compatibility.less +0 -13
  76. package/config/theme/style/mixins/customize.less +0 -181
  77. package/config/theme/style/mixins/iconfont.less +0 -28
  78. package/config/theme/style/mixins/index.less +0 -14
  79. package/config/theme/style/mixins/modal-mask.less +0 -30
  80. package/config/theme/style/mixins/motion.less +0 -33
  81. package/config/theme/style/mixins/operation-unit.less +0 -16
  82. package/config/theme/style/mixins/reset.less +0 -11
  83. package/config/theme/style/mixins/rounded-arrow.less +0 -44
  84. package/config/theme/style/mixins/size.less +0 -10
  85. package/config/theme/style/mixins/typography.less +0 -58
  86. package/config/theme/style/themes/compact.less +0 -295
  87. package/config/theme/style/themes/dark.less +0 -457
  88. package/config/theme/style/themes/default.less +0 -1080
  89. package/config/theme/style/themes/index.less +0 -7
  90. package/config/theme/style/themes/variable.less +0 -1135
  91. package/config/theme/style/variable.less +0 -4
@@ -1,1080 +0,0 @@
1
- /* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
2
- @import '../color/colors';
3
-
4
- @theme: default;
5
-
6
- // The prefix to use on all css classes from ant.
7
- @ant-prefix: ant;
8
-
9
- // An override for the html selector for theme prefixes
10
- @html-selector: html;
11
-
12
- // [CSS-VARIABLE-REPLACE-BEGIN: html-variables]
13
- // [CSS-VARIABLE-REPLACE-END: html-variables]
14
-
15
- // -------- Colors -----------
16
- // >>> Primary
17
- @primary-color: @blue-6;
18
- @primary-color-hover: color(~`colorPalette('@{primary-color}', 5) `);
19
- @primary-color-active: color(~`colorPalette('@{primary-color}', 7) `);
20
- @primary-color-outline: fade(@primary-color, @outline-fade);
21
-
22
- @processing-color: @blue-6;
23
-
24
- // >>> Info
25
- @info-color: @primary-color;
26
- @info-color-deprecated-bg: color(~`colorPalette('@{info-color}', 1) `);
27
- @info-color-deprecated-border: color(~`colorPalette('@{info-color}', 3) `);
28
-
29
- // >>> Success
30
- @success-color: @green-6;
31
- @success-color-hover: color(~`colorPalette('@{success-color}', 5) `);
32
- @success-color-active: color(~`colorPalette('@{success-color}', 7) `);
33
- @success-color-outline: fade(@success-color, @outline-fade);
34
- @success-color-deprecated-bg: color(~`colorPalette('@{success-color}', 1) `);
35
- @success-color-deprecated-border: color(~`colorPalette('@{success-color}', 3) `);
36
-
37
- // >>> Warning
38
- @warning-color: @gold-6;
39
- @warning-color-hover: color(~`colorPalette('@{warning-color}', 5) `);
40
- @warning-color-active: color(~`colorPalette('@{warning-color}', 7) `);
41
- @warning-color-outline: fade(@warning-color, @outline-fade);
42
- @warning-color-deprecated-bg: color(~`colorPalette('@{warning-color}', 1) `);
43
- @warning-color-deprecated-border: color(~`colorPalette('@{warning-color}', 3) `);
44
-
45
- // >>> Error
46
- @error-color: @red-5;
47
- @error-color-hover: color(~`colorPalette('@{error-color}', 5) `);
48
- @error-color-active: color(~`colorPalette('@{error-color}', 7) `);
49
- @error-color-outline: fade(@error-color, @outline-fade);
50
- @error-color-deprecated-bg: color(~`colorPalette('@{error-color}', 1) `);
51
- @error-color-deprecated-border: color(~`colorPalette('@{error-color}', 3) `);
52
-
53
- @highlight-color: @red-5;
54
- @normal-color: #d9d9d9;
55
- @white: #fff;
56
- @black: #000;
57
-
58
- // Color used by default to control hover and active backgrounds and for
59
- // alert info backgrounds.
60
- @primary-1: color(~`colorPalette('@{primary-color}', 1) `); // replace tint(@primary-color, 90%)
61
- @primary-2: color(~`colorPalette('@{primary-color}', 2) `); // replace tint(@primary-color, 80%)
62
- @primary-3: color(~`colorPalette('@{primary-color}', 3) `); // unused
63
- @primary-4: color(~`colorPalette('@{primary-color}', 4) `); // unused
64
- @primary-5: color(
65
- ~`colorPalette('@{primary-color}', 5) `
66
- ); // color used to control the text color in many active and hover states, replace tint(@primary-color, 20%)
67
- @primary-6: @primary-color; // color used to control the text color of active buttons, don't use, use @primary-color
68
- @primary-7: color(~`colorPalette('@{primary-color}', 7) `); // replace shade(@primary-color, 5%)
69
- @primary-8: color(~`colorPalette('@{primary-color}', 8) `); // unused
70
- @primary-9: color(~`colorPalette('@{primary-color}', 9) `); // unused
71
- @primary-10: color(~`colorPalette('@{primary-color}', 10) `); // unused
72
-
73
- // Base Scaffolding Variables
74
- // ---
75
-
76
- // Background color for `<body>`
77
- @body-background: #fff;
78
- // Base background color for most components
79
- @component-background: #fff;
80
- // Popover background color
81
- @popover-background: @component-background;
82
- @popover-customize-border-color: @border-color-split;
83
- @font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
84
- 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
85
- 'Noto Color Emoji';
86
- @code-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;
87
- @text-color: fade(@black, 85%);
88
- @text-color-secondary: fade(@black, 45%);
89
- @text-color-inverse: @white;
90
- @icon-color: inherit;
91
- @icon-color-hover: fade(@black, 75%);
92
- @heading-color: fade(@black, 85%);
93
- @text-color-dark: fade(@white, 85%);
94
- @text-color-secondary-dark: fade(@white, 65%);
95
- @text-selection-bg: @primary-color;
96
- @font-variant-base: tabular-nums;
97
- @font-feature-settings-base: 'tnum';
98
- @font-size-base: 14px;
99
- @font-size-lg: @font-size-base + 2px;
100
- @font-size-sm: 12px;
101
- @heading-1-size: ceil(@font-size-base * 2.71);
102
- @heading-2-size: ceil(@font-size-base * 2.14);
103
- @heading-3-size: ceil(@font-size-base * 1.71);
104
- @heading-4-size: ceil(@font-size-base * 1.42);
105
- @heading-5-size: ceil(@font-size-base * 1.14);
106
- // https://github.com/ant-design/ant-design/issues/20210
107
- @line-height-base: 1.5715;
108
- @border-radius-base: 2px;
109
- @border-radius-sm: @border-radius-base;
110
-
111
- // control border
112
- @control-border-radius: @border-radius-base;
113
-
114
- // arrow border
115
- @arrow-border-radius: 2px;
116
-
117
- // vertical paddings
118
- @padding-lg: 24px; // containers
119
- @padding-md: 16px; // small containers and buttons
120
- @padding-sm: 12px; // Form controls and items
121
- @padding-xs: 8px; // small items
122
- @padding-xss: 4px; // more small
123
-
124
- // vertical padding for all form controls
125
- @control-padding-horizontal: @padding-sm;
126
- @control-padding-horizontal-sm: @padding-xs;
127
-
128
- // vertical margins
129
- @margin-lg: 24px; // containers
130
- @margin-md: 16px; // small containers and buttons
131
- @margin-sm: 12px; // Form controls and items
132
- @margin-xs: 8px; // small items
133
- @margin-xss: 4px; // more small
134
-
135
- // height rules
136
- @height-base: 32px;
137
- @height-lg: 40px;
138
- @height-sm: 24px;
139
-
140
- // The background colors for active and hover states for things like
141
- // list items or table cells.
142
- @item-active-bg: @primary-1;
143
- @item-hover-bg: #f5f5f5;
144
-
145
- // ICONFONT
146
- @iconfont-css-prefix: anticon;
147
-
148
- // LINK
149
- @link-color: @primary-color;
150
- @link-hover-color: color(~`colorPalette('@{link-color}', 5) `);
151
- @link-active-color: color(~`colorPalette('@{link-color}', 7) `);
152
- @link-decoration: none;
153
- @link-hover-decoration: none;
154
- @link-focus-decoration: none;
155
- @link-focus-outline: 0;
156
-
157
- // Animation
158
- @ease-base-out: cubic-bezier(0.7, 0.3, 0.1, 1);
159
- @ease-base-in: cubic-bezier(0.9, 0, 0.3, 0.7);
160
- @ease-out: cubic-bezier(0.215, 0.61, 0.355, 1);
161
- @ease-in: cubic-bezier(0.55, 0.055, 0.675, 0.19);
162
- @ease-in-out: cubic-bezier(0.645, 0.045, 0.355, 1);
163
- @ease-out-back: cubic-bezier(0.12, 0.4, 0.29, 1.46);
164
- @ease-in-back: cubic-bezier(0.71, -0.46, 0.88, 0.6);
165
- @ease-in-out-back: cubic-bezier(0.71, -0.46, 0.29, 1.46);
166
- @ease-out-circ: cubic-bezier(0.08, 0.82, 0.17, 1);
167
- @ease-in-circ: cubic-bezier(0.6, 0.04, 0.98, 0.34);
168
- @ease-in-out-circ: cubic-bezier(0.78, 0.14, 0.15, 0.86);
169
- @ease-out-quint: cubic-bezier(0.23, 1, 0.32, 1);
170
- @ease-in-quint: cubic-bezier(0.755, 0.05, 0.855, 0.06);
171
- @ease-in-out-quint: cubic-bezier(0.86, 0, 0.07, 1);
172
-
173
- // Border color
174
- @border-color-base: hsv(0, 0, 85%); // base border outline a component
175
- @border-color-split: hsv(0, 0, 94%); // split border inside a component
176
- @border-color-inverse: @white;
177
- @border-width-base: 1px; // width of the border for a component
178
- @border-style-base: solid; // style of a components border
179
-
180
- // Outline
181
- @outline-blur-size: 0;
182
- @outline-width: 2px;
183
- @outline-color: @primary-color; // No use anymore
184
- @outline-fade: 20%;
185
-
186
- @background-color-light: hsv(0, 0, 98%); // background of header and selected item
187
- @background-color-base: hsv(0, 0, 96%); // Default grey background color
188
-
189
- // Disabled states
190
- @disabled-color: fade(#000, 25%);
191
- @disabled-bg: @background-color-base;
192
- @disabled-active-bg: tint(@black, 90%);
193
- @disabled-color-dark: fade(#fff, 35%);
194
-
195
- // Shadow
196
- @shadow-color: rgba(0, 0, 0, 0.15);
197
- @shadow-color-inverse: @component-background;
198
- @box-shadow-base: @shadow-2;
199
- @shadow-1-up: 0 -6px 16px -8px rgba(0, 0, 0, 0.08), 0 -9px 28px 0 rgba(0, 0, 0, 0.05),
200
- 0 -12px 48px 16px rgba(0, 0, 0, 0.03);
201
- @shadow-1-down: 0 6px 16px -8px rgba(0, 0, 0, 0.08), 0 9px 28px 0 rgba(0, 0, 0, 0.05),
202
- 0 12px 48px 16px rgba(0, 0, 0, 0.03);
203
- @shadow-1-left: -6px 0 16px -8px rgba(0, 0, 0, 0.08), -9px 0 28px 0 rgba(0, 0, 0, 0.05),
204
- -12px 0 48px 16px rgba(0, 0, 0, 0.03);
205
- @shadow-1-right: 6px 0 16px -8px rgba(0, 0, 0, 0.08), 9px 0 28px 0 rgba(0, 0, 0, 0.05),
206
- 12px 0 48px 16px rgba(0, 0, 0, 0.03);
207
- @shadow-2: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),
208
- 0 9px 28px 8px rgba(0, 0, 0, 0.05);
209
-
210
- // Buttons
211
- @btn-font-weight: 400;
212
- @btn-border-radius-base: @border-radius-base;
213
- @btn-border-radius-sm: @border-radius-base;
214
- @btn-border-width: @border-width-base;
215
- @btn-border-style: @border-style-base;
216
- @btn-shadow: 0 2px 0 rgba(0, 0, 0, 0.015);
217
- @btn-primary-shadow: 0 2px 0 rgba(0, 0, 0, 0.045);
218
- @btn-text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.12);
219
-
220
- @btn-primary-color: #fff;
221
- @btn-primary-bg: @primary-color;
222
-
223
- @btn-default-color: @text-color;
224
- @btn-default-bg: @component-background;
225
- @btn-default-border: @border-color-base;
226
-
227
- @btn-danger-color: #fff;
228
- @btn-danger-bg: @error-color;
229
- @btn-danger-border: @error-color;
230
-
231
- @btn-disable-color: @disabled-color;
232
- @btn-disable-bg: @disabled-bg;
233
- @btn-disable-border: @border-color-base;
234
-
235
- @btn-default-ghost-color: @component-background;
236
- @btn-default-ghost-bg: transparent;
237
- @btn-default-ghost-border: @component-background;
238
-
239
- @btn-font-size-lg: @font-size-lg;
240
- @btn-font-size-sm: @font-size-base;
241
- @btn-padding-horizontal-base: @padding-md - 1px;
242
- @btn-padding-horizontal-lg: @btn-padding-horizontal-base;
243
- @btn-padding-horizontal-sm: @padding-xs - 1px;
244
-
245
- @btn-height-base: @height-base;
246
- @btn-height-lg: @height-lg;
247
- @btn-height-sm: @height-sm;
248
-
249
- @btn-line-height: @line-height-base;
250
-
251
- @btn-circle-size: @btn-height-base;
252
- @btn-circle-size-lg: @btn-height-lg;
253
- @btn-circle-size-sm: @btn-height-sm;
254
-
255
- @btn-square-size: @btn-height-base;
256
- @btn-square-size-lg: @btn-height-lg;
257
- @btn-square-size-sm: @btn-height-sm;
258
- @btn-square-only-icon-size: @font-size-base + 2px;
259
- @btn-square-only-icon-size-sm: @font-size-base;
260
- @btn-square-only-icon-size-lg: @btn-font-size-lg + 2px;
261
-
262
- @btn-group-border: @primary-5;
263
-
264
- @btn-link-hover-bg: transparent;
265
- @btn-text-hover-bg: rgba(0, 0, 0, 0.018);
266
-
267
- // Checkbox
268
- @checkbox-size: 16px;
269
- @checkbox-color: @primary-color;
270
- @checkbox-check-color: #fff;
271
- @checkbox-check-bg: @checkbox-check-color;
272
- @checkbox-border-width: @border-width-base;
273
- @checkbox-border-radius: @border-radius-base;
274
- @checkbox-group-item-margin-right: 8px;
275
-
276
- // Descriptions
277
- @descriptions-bg: #fafafa;
278
- @descriptions-title-margin-bottom: 20px;
279
- @descriptions-default-padding: @padding-md @padding-lg;
280
- @descriptions-middle-padding: @padding-sm @padding-lg;
281
- @descriptions-small-padding: @padding-xs @padding-md;
282
- @descriptions-item-padding-bottom: @padding-md;
283
- @descriptions-item-trailing-colon: true;
284
- @descriptions-item-label-colon-margin-right: 8px;
285
- @descriptions-item-label-colon-margin-left: 2px;
286
- @descriptions-extra-color: @text-color;
287
-
288
- // Divider
289
- @divider-text-padding: 1em;
290
- @divider-orientation-margin: 5%;
291
- @divider-color: rgba(0, 0, 0, 6%);
292
- @divider-vertical-gutter: 8px;
293
-
294
- // Dropdown
295
- @dropdown-selected-color: @primary-color;
296
- @dropdown-menu-submenu-disabled-bg: @component-background;
297
- @dropdown-selected-bg: @item-active-bg;
298
-
299
- // Empty
300
- @empty-font-size: @font-size-base;
301
-
302
- // Radio
303
- @radio-size: 16px;
304
- @radio-top: 0.2em;
305
- @radio-border-width: 1px;
306
- @radio-dot-size: @radio-size - 8px;
307
- @radio-dot-color: @primary-color;
308
- @radio-dot-disabled-color: fade(@black, 20%);
309
- @radio-solid-checked-color: @component-background;
310
-
311
- // Radio buttons
312
- @radio-button-bg: @btn-default-bg;
313
- @radio-button-checked-bg: @btn-default-bg;
314
- @radio-button-color: @btn-default-color;
315
- @radio-button-hover-color: @primary-5;
316
- @radio-button-active-color: @primary-7;
317
- @radio-button-padding-horizontal: @padding-md - 1px;
318
- @radio-disabled-button-checked-bg: @disabled-active-bg;
319
- @radio-disabled-button-checked-color: @disabled-color;
320
- @radio-wrapper-margin-right: 8px;
321
-
322
- // Media queries breakpoints
323
- // @screen-xs and @screen-xs-min is not used in Grid
324
- // smallest break point is @screen-md
325
- @screen-xs: 480px;
326
- @screen-xs-min: @screen-xs;
327
- // 👆 Extra small screen / phone
328
-
329
- // 👇 Small screen / tablet
330
- @screen-sm: 576px;
331
- @screen-sm-min: @screen-sm;
332
-
333
- // Medium screen / desktop
334
- @screen-md: 768px;
335
- @screen-md-min: @screen-md;
336
-
337
- // Large screen / wide desktop
338
- @screen-lg: 992px;
339
- @screen-lg-min: @screen-lg;
340
-
341
- // Extra large screen / full hd
342
- @screen-xl: 1200px;
343
- @screen-xl-min: @screen-xl;
344
-
345
- // Extra extra large screen / large desktop
346
- @screen-xxl: 1600px;
347
- @screen-xxl-min: @screen-xxl;
348
-
349
- // provide a maximum
350
- @screen-xs-max: (@screen-sm-min - 1px);
351
- @screen-sm-max: (@screen-md-min - 1px);
352
- @screen-md-max: (@screen-lg-min - 1px);
353
- @screen-lg-max: (@screen-xl-min - 1px);
354
- @screen-xl-max: (@screen-xxl-min - 1px);
355
-
356
- // Grid system
357
- @grid-columns: 24;
358
-
359
- // Layout
360
- @layout-body-background: #f0f2f5;
361
- @layout-header-background: #001529;
362
- @layout-header-height: 64px;
363
- @layout-header-padding: 0 50px;
364
- @layout-header-color: @text-color;
365
- @layout-footer-padding: 24px 50px;
366
- @layout-footer-background: @layout-body-background;
367
- @layout-sider-background: @layout-header-background;
368
- @layout-trigger-height: 48px;
369
- @layout-trigger-background: #002140;
370
- @layout-trigger-color: #fff;
371
- @layout-zero-trigger-width: 36px;
372
- @layout-zero-trigger-height: 42px;
373
- // Layout light theme
374
- @layout-sider-background-light: #fff;
375
- @layout-trigger-background-light: #fff;
376
- @layout-trigger-color-light: @text-color;
377
-
378
- // z-index list, order by `z-index`
379
- @zindex-badge: auto;
380
- @zindex-table-fixed: 2;
381
- @zindex-affix: 10;
382
- @zindex-back-top: 10;
383
- @zindex-picker-panel: 10;
384
- @zindex-popup-close: 10;
385
- @zindex-modal: 1000;
386
- @zindex-modal-mask: 1000;
387
- @zindex-message: 1010;
388
- @zindex-notification: 1010;
389
- @zindex-popover: 1030;
390
- @zindex-dropdown: 1050;
391
- @zindex-picker: 1050;
392
- @zindex-popoconfirm: 1060;
393
- @zindex-tooltip: 1070;
394
- @zindex-image: 1080;
395
-
396
- // Animation
397
- @animation-duration-slow: 0.3s; // Modal
398
- @animation-duration-base: 0.2s;
399
- @animation-duration-fast: 0.1s; // Tooltip
400
-
401
- //CollapsePanel
402
- @collapse-panel-border-radius: @border-radius-base;
403
-
404
- //Dropdown
405
- @dropdown-menu-bg: @component-background;
406
- @dropdown-vertical-padding: 5px;
407
- @dropdown-edge-child-vertical-padding: 4px;
408
- @dropdown-font-size: @font-size-base;
409
- @dropdown-line-height: 22px;
410
-
411
- // Form
412
- // ---
413
- @label-required-color: @highlight-color;
414
- @label-color: @heading-color;
415
- @form-warning-input-bg: @input-bg;
416
- @form-item-margin-bottom: 24px;
417
- @form-item-trailing-colon: true;
418
- @form-vertical-label-padding: 0 0 8px;
419
- @form-vertical-label-margin: 0;
420
- @form-item-label-font-size: @font-size-base;
421
- @form-item-label-height: @input-height-base;
422
- @form-item-label-colon-margin-right: 8px;
423
- @form-item-label-colon-margin-left: 2px;
424
- @form-error-input-bg: @input-bg;
425
-
426
- // Input
427
- // ---
428
- @input-height-base: @height-base;
429
- @input-height-lg: @height-lg;
430
- @input-height-sm: @height-sm;
431
- @input-padding-horizontal: @control-padding-horizontal - 1px;
432
- @input-padding-horizontal-base: @input-padding-horizontal;
433
- @input-padding-horizontal-sm: @control-padding-horizontal-sm - 1px;
434
- @input-padding-horizontal-lg: @input-padding-horizontal;
435
- @input-padding-vertical-base: max(
436
- (round(((@input-height-base - @font-size-base * @line-height-base) / 2) * 10) / 10) -
437
- @border-width-base,
438
- 3px
439
- );
440
- @input-padding-vertical-sm: max(
441
- (round(((@input-height-sm - @font-size-base * @line-height-base) / 2) * 10) / 10) -
442
- @border-width-base,
443
- 0
444
- );
445
- @input-padding-vertical-lg: (
446
- ceil(((@input-height-lg - @font-size-lg * @line-height-base) / 2) * 10) / 10
447
- ) - @border-width-base;
448
- @input-placeholder-color: hsv(0, 0, 75%);
449
- @input-color: @text-color;
450
- @input-icon-color: @input-color;
451
- @input-border-color: @border-color-base;
452
- @input-bg: @component-background;
453
- @input-number-hover-border-color: @input-hover-border-color;
454
- @input-number-handler-active-bg: #f4f4f4;
455
- @input-number-handler-hover-bg: @primary-5;
456
- @input-number-handler-bg: @component-background;
457
- @input-number-handler-border-color: @border-color-base;
458
- @input-addon-bg: @background-color-light;
459
- @input-hover-border-color: @primary-5;
460
- @input-disabled-bg: @disabled-bg;
461
- @input-outline-offset: 0 0;
462
- @input-icon-hover-color: fade(@black, 85%);
463
- @input-disabled-color: @disabled-color;
464
-
465
- // Mentions
466
- // ---
467
- @mentions-dropdown-bg: @component-background;
468
- @mentions-dropdown-menu-item-hover-bg: @mentions-dropdown-bg;
469
-
470
- // Select
471
- // ---
472
- @select-border-color: @border-color-base;
473
- @select-item-selected-color: @text-color;
474
- @select-item-selected-font-weight: 600;
475
- @select-dropdown-bg: @component-background;
476
- @select-item-selected-bg: @primary-1;
477
- @select-item-active-bg: @item-hover-bg;
478
- @select-dropdown-vertical-padding: @dropdown-vertical-padding;
479
- @select-dropdown-font-size: @dropdown-font-size;
480
- @select-dropdown-line-height: @dropdown-line-height;
481
- @select-dropdown-height: 32px;
482
- @select-background: @component-background;
483
- @select-clear-background: @select-background;
484
- @select-selection-item-bg: @background-color-base;
485
- @select-selection-item-border-color: @border-color-split;
486
- @select-single-item-height-lg: 40px;
487
- @select-multiple-item-height: @input-height-base - @input-padding-vertical-base * 2; // Normal 24px
488
- @select-multiple-item-height-lg: 32px;
489
- @select-multiple-item-spacing-half: ceil((@input-padding-vertical-base / 2));
490
- @select-multiple-disabled-background: @input-disabled-bg;
491
- @select-multiple-item-disabled-color: #bfbfbf;
492
- @select-multiple-item-disabled-border-color: @select-border-color;
493
-
494
- // Cascader
495
- // ---
496
- @cascader-bg: @component-background;
497
- @cascader-item-selected-bg: @primary-1;
498
- @cascader-menu-bg: @component-background;
499
- @cascader-menu-border-color-split: @border-color-split;
500
-
501
- // Cascader
502
- // ----
503
- @cascader-dropdown-vertical-padding: @dropdown-vertical-padding;
504
- @cascader-dropdown-edge-child-vertical-padding: @dropdown-edge-child-vertical-padding;
505
- @cascader-dropdown-font-size: @dropdown-font-size;
506
- @cascader-dropdown-line-height: @dropdown-line-height;
507
-
508
- // Anchor
509
- // ---
510
- @anchor-bg: transparent;
511
- @anchor-border-color: @border-color-split;
512
- @anchor-link-top: 4px;
513
- @anchor-link-left: 16px;
514
- @anchor-link-padding: @anchor-link-top 0 @anchor-link-top @anchor-link-left;
515
-
516
- // Tooltip
517
- // ---
518
- // Tooltip max width
519
- @tooltip-max-width: 250px;
520
- // Tooltip text color
521
- @tooltip-color: #fff;
522
- // Tooltip background color
523
- @tooltip-bg: rgba(0, 0, 0, 0.75);
524
- // Tooltip arrow width
525
- @tooltip-arrow-width: 8px * sqrt(2);
526
- // Tooltip distance with trigger
527
- @tooltip-distance: @tooltip-arrow-width - 1px + 4px;
528
- // Tooltip arrow color
529
- @tooltip-arrow-color: @tooltip-bg;
530
- @tooltip-border-radius: @border-radius-base;
531
-
532
- // Popover
533
- // ---
534
- // Popover body background color
535
- @popover-bg: @component-background;
536
- // Popover text color
537
- @popover-color: @text-color;
538
- // Popover maximum width
539
- @popover-min-width: 177px;
540
- @popover-min-height: 32px;
541
- // Popover arrow width
542
- @popover-arrow-width: @tooltip-arrow-width;
543
- // Popover arrow color
544
- @popover-arrow-color: @popover-bg;
545
- // Popover outer arrow width
546
- // Popover outer arrow color
547
- @popover-arrow-outer-color: @popover-bg;
548
- // Popover distance with trigger
549
- @popover-distance: @popover-arrow-width + 4px;
550
- @popover-padding-horizontal: @padding-md;
551
-
552
- // Modal
553
- // --
554
- @modal-header-padding-vertical: @padding-md;
555
- @modal-header-padding-horizontal: @padding-lg;
556
- @modal-body-padding: @padding-lg;
557
- @modal-header-bg: @component-background;
558
- @modal-header-padding: @modal-header-padding-vertical @modal-header-padding-horizontal;
559
- @modal-header-border-width: @border-width-base;
560
- @modal-header-border-style: @border-style-base;
561
- @modal-header-title-line-height: 22px;
562
- @modal-header-title-font-size: @font-size-lg;
563
- @modal-header-border-color-split: @border-color-split;
564
- @modal-header-close-size: 56px;
565
- @modal-content-bg: @component-background;
566
- @modal-heading-color: @heading-color;
567
- @modal-close-color: @text-color-secondary;
568
- @modal-footer-bg: transparent;
569
- @modal-footer-border-color-split: @border-color-split;
570
- @modal-footer-border-style: @border-style-base;
571
- @modal-footer-padding-vertical: 10px;
572
- @modal-footer-padding-horizontal: 16px;
573
- @modal-footer-border-width: @border-width-base;
574
- @modal-mask-bg: fade(@black, 45%);
575
- @modal-confirm-body-padding: 32px 32px 24px;
576
- @modal-confirm-title-font-size: @font-size-lg;
577
-
578
- // Progress
579
- // --
580
- @progress-default-color: @processing-color;
581
- @progress-remaining-color: @background-color-base;
582
- @progress-info-text-color: @progress-text-color;
583
- @progress-radius: 100px;
584
- @progress-steps-item-bg: #f3f3f3;
585
- @progress-text-font-size: 1em;
586
- @progress-text-color: @text-color; // This is for circle text color, should be renamed better
587
- @progress-circle-text-font-size: 1em;
588
- // Menu
589
- // ---
590
- @menu-inline-toplevel-item-height: 40px;
591
- @menu-item-height: 40px;
592
- @menu-item-group-height: @line-height-base;
593
- @menu-collapsed-width: 80px;
594
- @menu-bg: @component-background;
595
- @menu-popup-bg: @component-background;
596
- @menu-item-color: @text-color;
597
- @menu-inline-submenu-bg: @background-color-light;
598
- @menu-highlight-color: @primary-color;
599
- @menu-highlight-danger-color: @error-color;
600
- @menu-item-active-bg: @primary-1;
601
- @menu-item-active-danger-bg: @red-1;
602
- @menu-item-active-border-width: 3px;
603
- @menu-item-group-title-color: @text-color-secondary;
604
- @menu-item-vertical-margin: 4px;
605
- @menu-item-font-size: @font-size-base;
606
- @menu-item-boundary-margin: 8px;
607
- @menu-item-padding-horizontal: 20px;
608
- @menu-item-padding: 0 @menu-item-padding-horizontal;
609
- @menu-horizontal-line-height: 46px;
610
- @menu-icon-margin-right: 10px;
611
- @menu-icon-size: @menu-item-font-size;
612
- @menu-icon-size-lg: @font-size-lg;
613
- @menu-item-group-title-font-size: @menu-item-font-size;
614
-
615
- // dark theme
616
- @menu-dark-color: @text-color-secondary-dark;
617
- @menu-dark-danger-color: @error-color;
618
- @menu-dark-bg: @layout-header-background;
619
- @menu-dark-arrow-color: #fff;
620
- @menu-dark-inline-submenu-bg: #000c17;
621
- @menu-dark-highlight-color: #fff;
622
- @menu-dark-item-active-bg: @primary-color;
623
- @menu-dark-item-active-danger-bg: @error-color;
624
- @menu-dark-selected-item-icon-color: @white;
625
- @menu-dark-selected-item-text-color: @white;
626
- @menu-dark-item-hover-bg: transparent;
627
- // Spin
628
- // ---
629
- @spin-dot-size-sm: 14px;
630
- @spin-dot-size: 20px;
631
- @spin-dot-size-lg: 32px;
632
-
633
- // Table
634
- // --
635
- @table-bg: @component-background;
636
- @table-header-bg: @background-color-light;
637
- @table-header-color: @heading-color;
638
- @table-header-sort-bg: @background-color-base;
639
- @table-body-sort-bg: #fafafa;
640
- @table-row-hover-bg: @background-color-light;
641
- @table-selected-row-color: inherit;
642
- @table-selected-row-bg: @primary-1;
643
- @table-body-selected-sort-bg: @table-selected-row-bg;
644
- @table-selected-row-hover-bg: darken(@table-selected-row-bg, 2%);
645
- @table-expanded-row-bg: #fbfbfb;
646
- @table-padding-vertical: 16px;
647
- @table-padding-horizontal: 16px;
648
- @table-padding-vertical-md: (@table-padding-vertical * 3 / 4);
649
- @table-padding-horizontal-md: (@table-padding-horizontal / 2);
650
- @table-padding-vertical-sm: (@table-padding-vertical / 2);
651
- @table-padding-horizontal-sm: (@table-padding-horizontal / 2);
652
- @table-border-color: @border-color-split;
653
- @table-border-radius-base: @border-radius-base;
654
- @table-footer-bg: @background-color-light;
655
- @table-footer-color: @heading-color;
656
- @table-header-bg-sm: @table-header-bg;
657
- @table-font-size: @font-size-base;
658
- @table-font-size-md: @table-font-size;
659
- @table-font-size-sm: @table-font-size;
660
- @table-header-cell-split-color: rgba(0, 0, 0, 0.06);
661
- // Sorter
662
- // Legacy: `table-header-sort-active-bg` is used for hover not real active
663
- @table-header-sort-active-bg: rgba(0, 0, 0, 0.04);
664
- @table-fixed-header-sort-active-bg: hsv(0, 0, 96%);
665
-
666
- // Filter
667
- @table-header-filter-active-bg: rgba(0, 0, 0, 0.04);
668
- @table-filter-btns-bg: inherit;
669
- @table-filter-dropdown-bg: @component-background;
670
- @table-expand-icon-bg: @component-background;
671
- @table-selection-column-width: 32px;
672
- // Sticky
673
- @table-sticky-scroll-bar-bg: fade(#000, 35%);
674
- @table-sticky-scroll-bar-radius: 4px;
675
-
676
- // Tag
677
- // --
678
- @tag-border-radius: @border-radius-base;
679
- @tag-default-bg: @background-color-light;
680
- @tag-default-color: @text-color;
681
- @tag-font-size: @font-size-sm;
682
- @tag-line-height: 20px;
683
-
684
- // TimePicker
685
- // ---
686
- @picker-bg: @component-background;
687
- @picker-basic-cell-hover-color: @item-hover-bg;
688
- @picker-basic-cell-active-with-range-color: @primary-1;
689
- @picker-basic-cell-hover-with-range-color: lighten(@primary-color, 35%);
690
- @picker-basic-cell-disabled-bg: rgba(0, 0, 0, 0.04);
691
- @picker-border-color: @border-color-split;
692
- @picker-date-hover-range-border-color: lighten(@primary-color, 20%);
693
- @picker-date-hover-range-color: @picker-basic-cell-hover-with-range-color;
694
- @picker-time-panel-column-width: 56px;
695
- @picker-time-panel-column-height: 224px;
696
- @picker-time-panel-cell-height: 28px;
697
- @picker-panel-cell-height: 24px;
698
- @picker-panel-cell-width: 36px;
699
- @picker-text-height: 40px;
700
- @picker-panel-without-time-cell-height: 66px;
701
-
702
- // Calendar
703
- // ---
704
- @calendar-bg: @component-background;
705
- @calendar-input-bg: @input-bg;
706
- @calendar-border-color: @border-color-inverse;
707
- @calendar-item-active-bg: @item-active-bg;
708
- @calendar-column-active-bg: fade(@calendar-item-active-bg, 20%);
709
- @calendar-full-bg: @calendar-bg;
710
- @calendar-full-panel-bg: @calendar-full-bg;
711
-
712
- // Carousel
713
- // ---
714
- @carousel-dot-width: 16px;
715
- @carousel-dot-height: 3px;
716
- @carousel-dot-active-width: 24px;
717
-
718
- // Badge
719
- // ---
720
- @badge-height: 20px;
721
- @badge-height-sm: 14px;
722
- @badge-dot-size: 6px;
723
- @badge-font-size: @font-size-sm;
724
- @badge-font-size-sm: @font-size-sm;
725
- @badge-font-weight: normal;
726
- @badge-status-size: 6px;
727
- @badge-text-color: @component-background;
728
- @badge-color: @highlight-color;
729
-
730
- // Rate
731
- // ---
732
- @rate-star-color: @yellow-6;
733
- @rate-star-bg: @border-color-split;
734
- @rate-star-size: 20px;
735
- @rate-star-hover-scale: scale(1.1);
736
-
737
- // Card
738
- // ---
739
- @card-head-color: @heading-color;
740
- @card-head-background: transparent;
741
- @card-head-font-size: @font-size-lg;
742
- @card-head-font-size-sm: @font-size-base;
743
- @card-head-padding: 16px;
744
- @card-head-padding-sm: (@card-head-padding / 2);
745
- @card-head-height: 48px;
746
- @card-head-height-sm: 36px;
747
- @card-inner-head-padding: 12px;
748
- @card-padding-base: 24px;
749
- @card-padding-base-sm: (@card-padding-base / 2);
750
- @card-actions-background: @component-background;
751
- @card-actions-li-margin: 12px 0;
752
- @card-skeleton-bg: #cfd8dc;
753
- @card-background: @component-background;
754
- @card-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12),
755
- 0 5px 12px 4px rgba(0, 0, 0, 0.09);
756
- @card-radius: @border-radius-base;
757
- @card-head-tabs-margin-bottom: -17px;
758
- @card-head-extra-color: @text-color;
759
-
760
- // Comment
761
- // ---
762
- @comment-bg: inherit;
763
- @comment-padding-base: @padding-md 0;
764
- @comment-nest-indent: 44px;
765
- @comment-font-size-base: @font-size-base;
766
- @comment-font-size-sm: @font-size-sm;
767
- @comment-author-name-color: @text-color-secondary;
768
- @comment-author-time-color: #ccc;
769
- @comment-action-color: @text-color-secondary;
770
- @comment-action-hover-color: #595959;
771
- @comment-actions-margin-bottom: inherit;
772
- @comment-actions-margin-top: @margin-sm;
773
- @comment-content-detail-p-margin-bottom: inherit;
774
-
775
- // Tabs
776
- // ---
777
- @tabs-card-head-background: @background-color-light;
778
- @tabs-card-height: 40px;
779
- @tabs-card-active-color: @primary-color;
780
- @tabs-card-horizontal-padding: (
781
- (@tabs-card-height - floor(@font-size-base * @line-height-base)) / 2
782
- ) - @border-width-base @padding-md;
783
- @tabs-card-horizontal-padding-sm: 6px @padding-md;
784
- @tabs-card-horizontal-padding-lg: 7px @padding-md 6px;
785
- @tabs-title-font-size: @font-size-base;
786
- @tabs-title-font-size-lg: @font-size-lg;
787
- @tabs-title-font-size-sm: @font-size-base;
788
- @tabs-ink-bar-color: @primary-color;
789
- @tabs-bar-margin: 0 0 @margin-md 0;
790
- @tabs-horizontal-gutter: 32px;
791
- @tabs-horizontal-margin: 0 0 0 @tabs-horizontal-gutter;
792
- @tabs-horizontal-margin-rtl: 0 0 0 32px;
793
- @tabs-horizontal-padding: @padding-sm 0;
794
- @tabs-horizontal-padding-lg: @padding-md 0;
795
- @tabs-horizontal-padding-sm: @padding-xs 0;
796
- @tabs-vertical-padding: @padding-xs @padding-lg;
797
- @tabs-vertical-margin: @margin-md 0 0 0;
798
- @tabs-scrolling-size: 32px;
799
- @tabs-highlight-color: @primary-color;
800
- @tabs-hover-color: @primary-5;
801
- @tabs-active-color: @primary-7;
802
- @tabs-card-gutter: 2px;
803
- @tabs-card-tab-active-border-top: 2px solid transparent;
804
-
805
- // BackTop
806
- // ---
807
- @back-top-color: #fff;
808
- @back-top-bg: @text-color-secondary;
809
- @back-top-hover-bg: @text-color;
810
-
811
- // Avatar
812
- // ---
813
- @avatar-size-base: 32px;
814
- @avatar-size-lg: 40px;
815
- @avatar-size-sm: 24px;
816
- @avatar-font-size-base: 18px;
817
- @avatar-font-size-lg: 24px;
818
- @avatar-font-size-sm: 14px;
819
- @avatar-bg: #ccc;
820
- @avatar-color: #fff;
821
- @avatar-border-radius: @border-radius-base;
822
- @avatar-group-overlapping: -8px;
823
- @avatar-group-space: 3px;
824
- @avatar-group-border-color: #fff;
825
-
826
- // Switch
827
- // ---
828
- @switch-height: 22px;
829
- @switch-sm-height: 16px;
830
- @switch-min-width: 44px;
831
- @switch-sm-min-width: 28px;
832
- @switch-disabled-opacity: 0.4;
833
- @switch-color: @primary-color;
834
- @switch-bg: @component-background;
835
- @switch-shadow-color: fade(#00230b, 20%);
836
- @switch-padding: 2px;
837
- @switch-inner-margin-min: ceil(@switch-height * 0.3);
838
- @switch-inner-margin-max: ceil(@switch-height * 1.1);
839
- @switch-sm-inner-margin-min: ceil(@switch-sm-height * 0.3);
840
- @switch-sm-inner-margin-max: ceil(@switch-sm-height * 1.1);
841
-
842
- // Pagination
843
- // ---
844
- @pagination-item-bg: @component-background;
845
- @pagination-item-size: @height-base;
846
- @pagination-item-size-sm: 24px;
847
- @pagination-font-family: @font-family;
848
- @pagination-font-weight-active: 500;
849
- @pagination-item-bg-active: @component-background;
850
- @pagination-item-link-bg: @component-background;
851
- @pagination-item-disabled-color-active: @disabled-color;
852
- @pagination-item-disabled-bg-active: @disabled-active-bg;
853
- @pagination-item-input-bg: @component-background;
854
- @pagination-mini-options-size-changer-top: 0px;
855
-
856
- // PageHeader
857
- // ---
858
- @page-header-padding: @padding-lg;
859
- @page-header-padding-vertical: @padding-md;
860
- @page-header-padding-breadcrumb: @padding-sm;
861
- @page-header-content-padding-vertical: @padding-sm;
862
- @page-header-back-color: #000;
863
- @page-header-ghost-bg: inherit;
864
- @page-header-heading-title: @heading-4-size;
865
- @page-header-heading-sub-title: 14px;
866
- @page-header-tabs-tab-font-size: 16px;
867
-
868
- // Breadcrumb
869
- // ---
870
- @breadcrumb-base-color: @text-color-secondary;
871
- @breadcrumb-last-item-color: @text-color;
872
- @breadcrumb-font-size: @font-size-base;
873
- @breadcrumb-icon-font-size: @font-size-base;
874
- @breadcrumb-link-color: @text-color-secondary;
875
- @breadcrumb-link-color-hover: @text-color;
876
- @breadcrumb-separator-color: @text-color-secondary;
877
- @breadcrumb-separator-margin: 0 @padding-xs;
878
-
879
- // Slider
880
- // ---
881
- @slider-margin: 10px 6px 10px;
882
- @slider-rail-background-color: @background-color-base;
883
- @slider-rail-background-color-hover: #e1e1e1;
884
- @slider-track-background-color: @primary-3;
885
- @slider-track-background-color-hover: @primary-4;
886
- @slider-handle-border-width: 2px;
887
- @slider-handle-background-color: @component-background;
888
- @slider-handle-color: @primary-3;
889
- @slider-handle-color-hover: @primary-4;
890
- @slider-handle-color-focus: tint(@primary-color, 20%);
891
- @slider-handle-color-focus-shadow: fade(@primary-color, 12%);
892
- @slider-handle-color-tooltip-open: @primary-color;
893
- @slider-handle-size: 14px;
894
- @slider-handle-margin-top: -5px;
895
- @slider-handle-shadow: 0;
896
- @slider-dot-border-color: @border-color-split;
897
- @slider-dot-border-color-active: tint(@primary-color, 50%);
898
- @slider-disabled-color: @disabled-color;
899
- @slider-disabled-background-color: @component-background;
900
-
901
- // Tree
902
- // ---
903
- @tree-bg: @component-background;
904
- @tree-title-height: 24px;
905
- @tree-child-padding: 18px;
906
- @tree-directory-selected-color: #fff;
907
- @tree-directory-selected-bg: @primary-color;
908
- @tree-node-hover-bg: @item-hover-bg;
909
- @tree-node-selected-bg: @primary-2;
910
-
911
- // Collapse
912
- // ---
913
- @collapse-header-padding: @padding-sm @padding-md;
914
- @collapse-header-padding-extra: 40px;
915
- @collapse-header-bg: @background-color-light;
916
- @collapse-content-padding: @padding-md;
917
- @collapse-content-bg: @component-background;
918
- @collapse-header-arrow-left: 16px;
919
-
920
- // Skeleton
921
- // ---
922
- @skeleton-color: rgba(190, 190, 190, 0.2);
923
- @skeleton-to-color: shade(@skeleton-color, 5%);
924
- @skeleton-paragraph-margin-top: 28px;
925
- @skeleton-paragraph-li-margin-top: @margin-md;
926
- @skeleton-paragraph-li-height: 16px;
927
- @skeleton-title-height: 16px;
928
- @skeleton-title-paragraph-margin-top: @margin-lg;
929
-
930
- // Transfer
931
- // ---
932
- @transfer-header-height: 40px;
933
- @transfer-item-height: @height-base;
934
- @transfer-disabled-bg: @disabled-bg;
935
- @transfer-list-height: 200px;
936
- @transfer-item-hover-bg: @item-hover-bg;
937
- @transfer-item-selected-hover-bg: darken(@item-active-bg, 2%);
938
- @transfer-item-padding-vertical: 6px;
939
- @transfer-list-search-icon-top: 12px;
940
-
941
- // Message
942
- // ---
943
- @message-notice-content-padding: 10px 16px;
944
- @message-notice-content-bg: @component-background;
945
- // Motion
946
- // ---
947
- @wave-animation-width: 6px;
948
-
949
- // Alert
950
- // ---
951
- @alert-success-border-color: ~`colorPalette('@{success-color}', 3) `;
952
- @alert-success-bg-color: ~`colorPalette('@{success-color}', 1) `;
953
- @alert-success-icon-color: @success-color;
954
- @alert-info-border-color: ~`colorPalette('@{info-color}', 3) `;
955
- @alert-info-bg-color: ~`colorPalette('@{info-color}', 1) `;
956
- @alert-info-icon-color: @info-color;
957
- @alert-warning-border-color: ~`colorPalette('@{warning-color}', 3) `;
958
- @alert-warning-bg-color: ~`colorPalette('@{warning-color}', 1) `;
959
- @alert-warning-icon-color: @warning-color;
960
- @alert-error-border-color: ~`colorPalette('@{error-color}', 3) `;
961
- @alert-error-bg-color: ~`colorPalette('@{error-color}', 1) `;
962
- @alert-error-icon-color: @error-color;
963
- @alert-message-color: @heading-color;
964
- @alert-text-color: @text-color;
965
- @alert-close-color: @text-color-secondary;
966
- @alert-close-hover-color: @icon-color-hover;
967
- @alert-no-icon-padding-vertical: @padding-xs;
968
- @alert-with-description-no-icon-padding-vertical: @padding-md - 1px;
969
- @alert-with-description-padding-vertical: @padding-md - 1px;
970
- @alert-with-description-padding: @alert-with-description-padding-vertical 15px
971
- @alert-with-description-no-icon-padding-vertical @alert-with-description-icon-size;
972
- @alert-icon-top: 8px + @font-size-base * (@line-height-base / 2) - (@font-size-base / 2);
973
- @alert-with-description-icon-size: 24px;
974
-
975
- // List
976
- // ---
977
- @list-header-background: transparent;
978
- @list-footer-background: transparent;
979
- @list-empty-text-padding: @padding-md;
980
- @list-item-padding: @padding-sm 0;
981
- @list-item-padding-sm: @padding-xs @padding-md;
982
- @list-item-padding-lg: 16px 24px;
983
- @list-item-meta-margin-bottom: @padding-md;
984
- @list-item-meta-avatar-margin-right: @padding-md;
985
- @list-item-meta-title-margin-bottom: @padding-sm;
986
- @list-customize-card-bg: @component-background;
987
- @list-item-meta-description-font-size: @font-size-base;
988
-
989
- // Statistic
990
- // ---
991
- @statistic-title-font-size: @font-size-base;
992
- @statistic-content-font-size: 24px;
993
- @statistic-unit-font-size: 24px;
994
- @statistic-font-family: @font-family;
995
-
996
- // Drawer
997
- // ---
998
- @drawer-header-padding: @padding-md @padding-lg;
999
- @drawer-body-padding: @padding-lg;
1000
- @drawer-bg: @component-background;
1001
- @drawer-footer-padding-vertical: @modal-footer-padding-vertical;
1002
- @drawer-footer-padding-horizontal: @modal-footer-padding-horizontal;
1003
- @drawer-header-close-size: 56px;
1004
- @drawer-title-font-size: @font-size-lg;
1005
- @drawer-title-line-height: 22px;
1006
-
1007
- // Timeline
1008
- // ---
1009
- @timeline-width: 2px;
1010
- @timeline-color: @border-color-split;
1011
- @timeline-dot-border-width: 2px;
1012
- @timeline-dot-color: @primary-color;
1013
- @timeline-dot-bg: @component-background;
1014
- @timeline-item-padding-bottom: 20px;
1015
-
1016
- // Typography
1017
- // ---
1018
- @typography-title-font-weight: 600;
1019
- @typography-title-margin-top: 1.2em;
1020
- @typography-title-margin-bottom: 0.5em;
1021
-
1022
- // Upload
1023
- // ---
1024
- @upload-actions-color: @text-color-secondary;
1025
-
1026
- // Steps
1027
- // ---
1028
- @process-tail-color: @border-color-split;
1029
- @steps-nav-arrow-color: fade(@black, 25%);
1030
- @steps-background: @component-background;
1031
- @steps-icon-size: 32px;
1032
- @steps-icon-custom-size: @steps-icon-size;
1033
- @steps-icon-custom-top: 0px;
1034
- @steps-icon-custom-font-size: 24px;
1035
- @steps-icon-top: -0.5px;
1036
- @steps-icon-font-size: @font-size-lg;
1037
- @steps-icon-margin: 0 8px 0 0;
1038
- @steps-title-line-height: @height-base;
1039
- @steps-small-icon-size: 24px;
1040
- @steps-small-icon-margin: 0 8px 0 0;
1041
- @steps-dot-size: 8px;
1042
- @steps-dot-top: 2px;
1043
- @steps-current-dot-size: 10px;
1044
- @steps-description-max-width: 140px;
1045
- @steps-nav-content-max-width: auto;
1046
- @steps-vertical-icon-width: 16px;
1047
- @steps-vertical-tail-width: 16px;
1048
- @steps-vertical-tail-width-sm: 12px;
1049
-
1050
- // Notification
1051
- // ---
1052
- @notification-bg: @component-background;
1053
- @notification-padding-vertical: 16px;
1054
- @notification-padding-horizontal: 24px;
1055
-
1056
- // Result
1057
- // ---
1058
- @result-title-font-size: 24px;
1059
- @result-subtitle-font-size: @font-size-base;
1060
- @result-icon-font-size: 72px;
1061
- @result-extra-margin: 24px 0 0 0;
1062
-
1063
- // Image
1064
- // ---
1065
- @image-size-base: 48px;
1066
- @image-font-size-base: 24px;
1067
- @image-bg: #f5f5f5;
1068
- @image-color: #fff;
1069
- @image-mask-font-size: 16px;
1070
- @image-preview-operation-size: 18px;
1071
- @image-preview-operation-color: @text-color-dark;
1072
- @image-preview-operation-disabled-color: fade(@image-preview-operation-color, 25%);
1073
-
1074
- // Segmented
1075
- // ---
1076
- @segmented-bg: fade(@black, 4%);
1077
- @segmented-hover-bg: fade(@black, 6%);
1078
- @segmented-selected-bg: @white;
1079
- @segmented-label-color: fade(@black, 65%);
1080
- @segmented-label-hover-color: #262626;