bkui-vue 2.0.1 → 2.0.2-beta.10

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 (42) hide show
  1. package/dist/index.cjs.js +23 -23
  2. package/dist/index.esm.js +5684 -5650
  3. package/dist/index.umd.js +27 -27
  4. package/dist/style.css +1 -1
  5. package/dist/style.variable.css +1 -1
  6. package/lib/cascader/index.js +1669 -181
  7. package/lib/color-picker/index.js +1613 -170
  8. package/lib/components.d.ts +1 -2
  9. package/lib/components.js +1 -2
  10. package/lib/date-picker/date-picker.css +220 -4
  11. package/lib/date-picker/date-picker.less +5 -5
  12. package/lib/date-picker/date-picker.variable.css +237 -21
  13. package/lib/date-picker/index.js +1882 -470
  14. package/lib/directives/index.js +228 -111
  15. package/lib/form/index.js +1570 -162
  16. package/lib/image/index.js +1468 -164
  17. package/lib/index.d.ts +0 -1
  18. package/lib/index.js +1 -2
  19. package/lib/input/index.js +1301 -13
  20. package/lib/pop-confirm/index.d.ts +16 -2
  21. package/lib/pop-confirm/index.js +13 -5
  22. package/lib/pop-confirm/pop-confirm.d.ts +5 -1
  23. package/lib/popover/index.js +1356 -68
  24. package/lib/search-select/index.js +1329 -108
  25. package/lib/select/index.js +1237 -16
  26. package/lib/slider/index.js +2 -1
  27. package/lib/tab/index.js +1277 -10
  28. package/lib/table/index.js +1346 -125
  29. package/lib/tag-input/index.js +1278 -16
  30. package/lib/tree/index.d.ts +4 -0
  31. package/lib/tree/index.js +47 -23
  32. package/lib/tree/props.d.ts +1 -0
  33. package/lib/tree/tree.css +18 -0
  34. package/lib/tree/tree.d.ts +2 -0
  35. package/lib/tree/tree.less +24 -0
  36. package/lib/tree/tree.variable.css +18 -0
  37. package/lib/tree/use-node-action.d.ts +1 -1
  38. package/package.json +1 -1
  39. package/lib/plugin-popover/index.d.ts +0 -27
  40. package/lib/plugin-popover/index.js +0 -65
  41. package/lib/plugins/index.d.ts +0 -1
  42. package/lib/plugins/index.js +0 -64
@@ -32,9 +32,8 @@ export { default as Navigation } from './navigation';
32
32
  export { default as Notify } from './notify';
33
33
  export { default as OverflowTitle } from './overflow-title';
34
34
  export { default as Pagination } from './pagination';
35
- export { default as $bkPopover } from './plugin-popover';
36
35
  export { default as PopConfirm } from './pop-confirm';
37
- export { default as Popover } from './popover';
36
+ export { default as Popover, $bkPopover } from './popover';
38
37
  export { default as Popover2 } from './popover2';
39
38
  export { default as Process } from './process';
40
39
  export { default as Progress } from './progress';
package/lib/components.js CHANGED
@@ -56,9 +56,8 @@ export { default as Navigation } from './navigation';
56
56
  export { default as Notify } from './notify';
57
57
  export { default as OverflowTitle } from './overflow-title';
58
58
  export { default as Pagination } from './pagination';
59
- export { default as $bkPopover } from './plugin-popover';
60
59
  export { default as PopConfirm } from './pop-confirm';
61
- export { default as Popover } from './popover';
60
+ export { default as Popover, $bkPopover } from './popover';
62
61
  export { default as Popover2 } from './popover2';
63
62
  export { default as Process } from './process';
64
63
  export { default as Progress } from './progress';
@@ -1,3 +1,219 @@
1
+ .bk-time-picker-header {
2
+ height: 46px;
3
+ font-size: 14px;
4
+ font-weight: 700;
5
+ line-height: 46px;
6
+ color: #63656e;
7
+ text-align: center;
8
+ border-bottom: 1px solid #dcdee5;
9
+ }
10
+ .bk-time-picker-cells:after {
11
+ position: absolute;
12
+ right: 0;
13
+ left: 0;
14
+ z-index: 1;
15
+ height: 32px;
16
+ padding-top: 6px;
17
+ margin-top: 0;
18
+ color: #3a84ff;
19
+ text-align: left;
20
+ pointer-events: none;
21
+ background-color: rgba(58, 132, 255, 0.16);
22
+ content: '';
23
+ box-sizing: border-box;
24
+ mix-blend-mode: multiply;
25
+ }
26
+ .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before,
27
+ .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):before {
28
+ position: absolute;
29
+ top: 55px;
30
+ left: 85px;
31
+ z-index: 1;
32
+ width: 2px;
33
+ padding-top: 2px;
34
+ background-color: #3a84ff;
35
+ border-radius: 50%;
36
+ content: '';
37
+ }
38
+ .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after,
39
+ .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):after {
40
+ position: absolute;
41
+ top: calc(55px + 5px);
42
+ left: 85px;
43
+ z-index: 1;
44
+ width: 2px;
45
+ padding-top: 2px;
46
+ background-color: #3a84ff;
47
+ border-radius: 50%;
48
+ content: '';
49
+ }
50
+ .bk-time-picker-cells-title-wrapper {
51
+ width: 100%;
52
+ height: 42px;
53
+ line-height: 42px;
54
+ }
55
+ .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title {
56
+ position: relative;
57
+ float: left;
58
+ width: 33.33%;
59
+ font-size: 14px;
60
+ font-weight: 700;
61
+ color: #63656e;
62
+ text-align: center;
63
+ list-style: none;
64
+ }
65
+ .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title.active {
66
+ color: #3a84ff;
67
+ }
68
+ .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before {
69
+ position: absolute;
70
+ top: 55px;
71
+ left: 133px;
72
+ z-index: 1;
73
+ width: 2px;
74
+ padding-top: 2px;
75
+ background-color: #3a84ff;
76
+ border-radius: 50%;
77
+ content: '';
78
+ }
79
+ .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after {
80
+ position: absolute;
81
+ top: calc(55px + 5px);
82
+ left: 133px;
83
+ z-index: 1;
84
+ width: 2px;
85
+ padding-top: 2px;
86
+ background-color: #3a84ff;
87
+ border-radius: 50%;
88
+ content: '';
89
+ }
90
+ .bk-time-picker-cells-list {
91
+ position: relative;
92
+ float: left;
93
+ width: 33.33%;
94
+ max-height: 200px;
95
+ overflow: hidden;
96
+ }
97
+ .bk-time-picker-cells-list:hover {
98
+ overflow-y: auto;
99
+ }
100
+ .bk-time-picker-cells-list:first-child {
101
+ border-radius: 2px 0 0 2px;
102
+ }
103
+ .bk-time-picker-cells-list:last-child {
104
+ border-radius: 0 2px 2px 0;
105
+ }
106
+ .bk-time-picker-cells-list::-webkit-scrollbar {
107
+ width: 0;
108
+ height: 0;
109
+ background-color: rgba(204, 204, 204, 0);
110
+ }
111
+ .bk-time-picker-cells-list::-webkit-scrollbar-thumb {
112
+ width: 0;
113
+ height: 0;
114
+ background-color: transparent;
115
+ }
116
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul {
117
+ width: 100%;
118
+ padding: 0 0 168px 0;
119
+ margin: 0;
120
+ list-style: none;
121
+ }
122
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell {
123
+ position: relative;
124
+ width: 100%;
125
+ height: 32px;
126
+ padding: 0;
127
+ margin: 0;
128
+ font-size: 12px;
129
+ line-height: 32px;
130
+ color: #63656e;
131
+ text-align: center;
132
+ list-style: none;
133
+ cursor: pointer;
134
+ box-sizing: content-box;
135
+ transition: background 0.2s ease-in-out;
136
+ user-select: none;
137
+ }
138
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell:hover {
139
+ color: #3a84ff;
140
+ }
141
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled {
142
+ color: #c4c6cc;
143
+ cursor: not-allowed;
144
+ }
145
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled:hover {
146
+ color: #c4c6cc;
147
+ cursor: not-allowed;
148
+ background-color: #fff;
149
+ }
150
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected,
151
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected:hover {
152
+ color: #3a84ff;
153
+ }
154
+ .bk-time-picker-header {
155
+ height: 46px;
156
+ font-size: 14px;
157
+ font-weight: 700;
158
+ line-height: 46px;
159
+ color: #63656e;
160
+ text-align: center;
161
+ border-bottom: 1px solid #dcdee5;
162
+ }
163
+ .bk-time-picker-with-range .bk-picker-panel-content {
164
+ position: relative;
165
+ float: left;
166
+ }
167
+ .bk-time-picker-with-range .bk-picker-panel-content:after {
168
+ position: absolute;
169
+ top: 45px;
170
+ right: 0;
171
+ bottom: 0;
172
+ z-index: 1;
173
+ display: block;
174
+ width: 1px;
175
+ background: #e8eaec;
176
+ content: '';
177
+ }
178
+ .bk-time-picker-with-range .bk-picker-panel-content-right {
179
+ float: right;
180
+ }
181
+ .bk-time-picker-with-range .bk-picker-panel-content-right:after {
182
+ right: auto;
183
+ left: 0;
184
+ }
185
+ .bk-time-picker-with-range .bk-time-picker-cells-list:first-child {
186
+ border-radius: 0;
187
+ }
188
+ .bk-time-picker-with-range .bk-time-picker-cells-list:last-child {
189
+ border-radius: 0;
190
+ }
191
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells {
192
+ min-width: 216px;
193
+ position: relative;
194
+ }
195
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds {
196
+ min-width: 216px;
197
+ }
198
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list {
199
+ width: 72px;
200
+ }
201
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list ul li {
202
+ padding: 0;
203
+ }
204
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list {
205
+ width: 108px;
206
+ max-height: 200px;
207
+ }
208
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:first-child {
209
+ border-radius: 0;
210
+ }
211
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:last-child {
212
+ border-radius: 0;
213
+ }
214
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list ul {
215
+ padding: 0 0 168px 0;
216
+ }
1
217
  .bk-date-picker {
2
218
  display: inline-block;
3
219
  width: 261px;
@@ -16,6 +232,7 @@
16
232
  position: relative;
17
233
  }
18
234
  .bk-date-picker-rel .bk-date-picker-editor {
235
+ box-sizing: border-box;
19
236
  display: block;
20
237
  width: 100%;
21
238
  height: 32px;
@@ -27,7 +244,6 @@
27
244
  border: 1px solid #c4c6cc;
28
245
  border-radius: 2px;
29
246
  outline: none;
30
- box-sizing: border-box;
31
247
  }
32
248
  .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border {
33
249
  border-color: transparent transparent #c4c6cc transparent;
@@ -106,13 +322,13 @@
106
322
  .bk-date-picker-dropdown {
107
323
  position: absolute;
108
324
  z-index: 900;
325
+ box-sizing: border-box;
109
326
  padding: 5px 0 0 0;
110
327
  overflow: auto;
111
328
  background-color: #fff;
112
329
  border: 1px solid #dcdee5;
113
330
  border-radius: 2px;
114
331
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
115
- box-sizing: border-box;
116
332
  }
117
333
  .bk-date-picker .bk-select-dropdown {
118
334
  max-height: none;
@@ -187,6 +403,7 @@
187
403
  }
188
404
  .bk-picker-confirm {
189
405
  display: flex;
406
+ justify-content: flex-end;
190
407
  height: 42px;
191
408
  padding: 0 20px;
192
409
  clear: both;
@@ -195,7 +412,6 @@
195
412
  text-align: right;
196
413
  background-color: #fafbfd;
197
414
  border-top: 1px solid #dcdee5;
198
- justify-content: flex-end;
199
415
  }
200
416
  .bk-picker-confirm a {
201
417
  color: #979ba5;
@@ -326,10 +542,10 @@ span.bk-date-picker-cells-cell-disabled:hover {
326
542
  bottom: 0;
327
543
  left: 0;
328
544
  display: block;
545
+ content: '';
329
546
  background: #e1ecff;
330
547
  border: 0;
331
548
  border-radius: 0;
332
- content: '';
333
549
  }
334
550
  .bk-date-picker-cells-cell-range em {
335
551
  position: relative;
@@ -1,5 +1,5 @@
1
1
  @import '../styles/themes/themes.less';
2
-
2
+ @import '../time-picker/time-picker.less';
3
3
  .@{bk-prefix}-date-picker {
4
4
  display: inline-block;
5
5
  width: 261px;
@@ -22,6 +22,7 @@
22
22
  position: relative;
23
23
 
24
24
  .@{bk-prefix}-date-picker-editor {
25
+ box-sizing: border-box;
25
26
  display: block;
26
27
  width: 100%;
27
28
  height: 32px;
@@ -33,7 +34,6 @@
33
34
  border: 1px solid @light-gray;
34
35
  border-radius: 2px;
35
36
  outline: none;
36
- box-sizing: border-box;
37
37
 
38
38
  &.only-bottom-border {
39
39
  border-color: transparent transparent @light-gray transparent;
@@ -129,13 +129,13 @@
129
129
  .@{bk-prefix}-date-picker-dropdown {
130
130
  position: absolute;
131
131
  z-index: 900;
132
+ box-sizing: border-box;
132
133
  padding: 5px 0 0 0;
133
134
  overflow: auto;
134
135
  background-color: @date-picker-dropdown-bg;
135
136
  border: 1px solid @disable-color;
136
137
  border-radius: 2px;
137
138
  box-shadow: 0 3px 10px rgba(0, 0, 0, .1);
138
- box-sizing: border-box;
139
139
  }
140
140
 
141
141
  .@{bk-prefix}-date-picker .@{bk-prefix}-select-dropdown {
@@ -225,6 +225,7 @@
225
225
 
226
226
  .@{bk-prefix}-picker-confirm {
227
227
  display: flex;
228
+ justify-content: flex-end;
228
229
  height: 42px;
229
230
  padding: 0 20px;
230
231
  clear: both;
@@ -233,7 +234,6 @@
233
234
  text-align: right;
234
235
  background-color: #fafbfd;
235
236
  border-top: 1px solid #dcdee5;
236
- justify-content: flex-end;
237
237
 
238
238
  a {
239
239
  color: #979ba5;
@@ -392,10 +392,10 @@ span.@{bk-prefix}-date-picker-cells-cell-disabled:hover {
392
392
  bottom: 0;
393
393
  left: 0;
394
394
  display: block;
395
+ content: '';
395
396
  background: #e1ecff;
396
397
  border: 0;
397
398
  border-radius: 0;
398
- content: '';
399
399
  }
400
400
 
401
401
  em {
@@ -128,6 +128,222 @@
128
128
  --select-active-color: #e1ecff;
129
129
  --select-hover-color: #f5f7fa;
130
130
  }
131
+ .bk-time-picker-header {
132
+ height: 46px;
133
+ font-size: 14px;
134
+ font-weight: 700;
135
+ line-height: 46px;
136
+ color: #63656e;
137
+ text-align: center;
138
+ border-bottom: 1px solid #dcdee5;
139
+ }
140
+ .bk-time-picker-cells:after {
141
+ position: absolute;
142
+ right: 0;
143
+ left: 0;
144
+ z-index: 1;
145
+ height: 32px;
146
+ padding-top: 6px;
147
+ margin-top: 0;
148
+ color: #3a84ff;
149
+ text-align: left;
150
+ pointer-events: none;
151
+ background-color: rgba(58, 132, 255, 0.16);
152
+ content: '';
153
+ box-sizing: border-box;
154
+ mix-blend-mode: multiply;
155
+ }
156
+ .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before,
157
+ .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):before {
158
+ position: absolute;
159
+ top: 55px;
160
+ left: 85px;
161
+ z-index: 1;
162
+ width: 2px;
163
+ padding-top: 2px;
164
+ background-color: #3a84ff;
165
+ border-radius: 50%;
166
+ content: '';
167
+ }
168
+ .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after,
169
+ .bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):after {
170
+ position: absolute;
171
+ top: calc(55px + 5px);
172
+ left: 85px;
173
+ z-index: 1;
174
+ width: 2px;
175
+ padding-top: 2px;
176
+ background-color: #3a84ff;
177
+ border-radius: 50%;
178
+ content: '';
179
+ }
180
+ .bk-time-picker-cells-title-wrapper {
181
+ width: 100%;
182
+ height: 42px;
183
+ line-height: 42px;
184
+ }
185
+ .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title {
186
+ position: relative;
187
+ float: left;
188
+ width: 33.33%;
189
+ font-size: 14px;
190
+ font-weight: 700;
191
+ color: #63656e;
192
+ text-align: center;
193
+ list-style: none;
194
+ }
195
+ .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title.active {
196
+ color: #3a84ff;
197
+ }
198
+ .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before {
199
+ position: absolute;
200
+ top: 55px;
201
+ left: 133px;
202
+ z-index: 1;
203
+ width: 2px;
204
+ padding-top: 2px;
205
+ background-color: #3a84ff;
206
+ border-radius: 50%;
207
+ content: '';
208
+ }
209
+ .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after {
210
+ position: absolute;
211
+ top: calc(55px + 5px);
212
+ left: 133px;
213
+ z-index: 1;
214
+ width: 2px;
215
+ padding-top: 2px;
216
+ background-color: #3a84ff;
217
+ border-radius: 50%;
218
+ content: '';
219
+ }
220
+ .bk-time-picker-cells-list {
221
+ position: relative;
222
+ float: left;
223
+ width: 33.33%;
224
+ max-height: 200px;
225
+ overflow: hidden;
226
+ }
227
+ .bk-time-picker-cells-list:hover {
228
+ overflow-y: auto;
229
+ }
230
+ .bk-time-picker-cells-list:first-child {
231
+ border-radius: 2px 0 0 2px;
232
+ }
233
+ .bk-time-picker-cells-list:last-child {
234
+ border-radius: 0 2px 2px 0;
235
+ }
236
+ .bk-time-picker-cells-list::-webkit-scrollbar {
237
+ width: 0;
238
+ height: 0;
239
+ background-color: rgba(204, 204, 204, 0);
240
+ }
241
+ .bk-time-picker-cells-list::-webkit-scrollbar-thumb {
242
+ width: 0;
243
+ height: 0;
244
+ background-color: transparent;
245
+ }
246
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul {
247
+ width: 100%;
248
+ padding: 0 0 168px 0;
249
+ margin: 0;
250
+ list-style: none;
251
+ }
252
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell {
253
+ position: relative;
254
+ width: 100%;
255
+ height: 32px;
256
+ padding: 0;
257
+ margin: 0;
258
+ font-size: 12px;
259
+ line-height: 32px;
260
+ color: #63656e;
261
+ text-align: center;
262
+ list-style: none;
263
+ cursor: pointer;
264
+ box-sizing: content-box;
265
+ transition: background 0.2s ease-in-out;
266
+ user-select: none;
267
+ }
268
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell:hover {
269
+ color: #3a84ff;
270
+ }
271
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled {
272
+ color: #c4c6cc;
273
+ cursor: not-allowed;
274
+ }
275
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled:hover {
276
+ color: #c4c6cc;
277
+ cursor: not-allowed;
278
+ background-color: #fff;
279
+ }
280
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected,
281
+ .bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected:hover {
282
+ color: #3a84ff;
283
+ }
284
+ .bk-time-picker-header {
285
+ height: 46px;
286
+ font-size: 14px;
287
+ font-weight: 700;
288
+ line-height: 46px;
289
+ color: #63656e;
290
+ text-align: center;
291
+ border-bottom: 1px solid #dcdee5;
292
+ }
293
+ .bk-time-picker-with-range .bk-picker-panel-content {
294
+ position: relative;
295
+ float: left;
296
+ }
297
+ .bk-time-picker-with-range .bk-picker-panel-content:after {
298
+ position: absolute;
299
+ top: 45px;
300
+ right: 0;
301
+ bottom: 0;
302
+ z-index: 1;
303
+ display: block;
304
+ width: 1px;
305
+ background: #e8eaec;
306
+ content: '';
307
+ }
308
+ .bk-time-picker-with-range .bk-picker-panel-content-right {
309
+ float: right;
310
+ }
311
+ .bk-time-picker-with-range .bk-picker-panel-content-right:after {
312
+ right: auto;
313
+ left: 0;
314
+ }
315
+ .bk-time-picker-with-range .bk-time-picker-cells-list:first-child {
316
+ border-radius: 0;
317
+ }
318
+ .bk-time-picker-with-range .bk-time-picker-cells-list:last-child {
319
+ border-radius: 0;
320
+ }
321
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells {
322
+ min-width: 216px;
323
+ position: relative;
324
+ }
325
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds {
326
+ min-width: 216px;
327
+ }
328
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list {
329
+ width: 72px;
330
+ }
331
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list ul li {
332
+ padding: 0;
333
+ }
334
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list {
335
+ width: 108px;
336
+ max-height: 200px;
337
+ }
338
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:first-child {
339
+ border-radius: 0;
340
+ }
341
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:last-child {
342
+ border-radius: 0;
343
+ }
344
+ .bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list ul {
345
+ padding: 0 0 168px 0;
346
+ }
131
347
  .bk-date-picker {
132
348
  display: inline-block;
133
349
  width: 261px;
@@ -146,45 +362,45 @@
146
362
  position: relative;
147
363
  }
148
364
  .bk-date-picker-rel .bk-date-picker-editor {
365
+ box-sizing: border-box;
149
366
  display: block;
150
367
  width: 100%;
151
368
  height: 32px;
152
369
  padding: 0 10px 0 30px;
153
370
  font-size: 12px;
154
371
  line-height: 32px;
155
- color: var(--default-color);
372
+ color: #63656e;
156
373
  cursor: pointer;
157
- border: 1px solid var(--light-gray);
374
+ border: 1px solid #c4c6cc;
158
375
  border-radius: 2px;
159
376
  outline: none;
160
- box-sizing: border-box;
161
377
  }
162
378
  .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border {
163
- border-color: transparent transparent var(--light-gray) transparent;
379
+ border-color: transparent transparent #c4c6cc transparent;
164
380
  }
165
381
  .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border:focus {
166
- border-color: transparent transparent var(--primary-color) transparent;
382
+ border-color: transparent transparent #3a84ff transparent;
167
383
  box-shadow: none;
168
384
  }
169
385
  .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border[disabled],
170
386
  .bk-date-picker-rel .bk-date-picker-editor.only-bottom-border.readonly {
171
- border-color: transparent transparent var(--disable-color) transparent;
387
+ border-color: transparent transparent #dcdee5 transparent;
172
388
  }
173
389
  .bk-date-picker-rel .bk-date-picker-editor:focus {
174
- border: 1px solid var(--primary-color);
390
+ border: 1px solid #3a84ff;
175
391
  }
176
392
  .bk-date-picker-rel .bk-date-picker-editor::placeholder {
177
- color: var(--light-gray);
393
+ color: #c4c6cc;
178
394
  }
179
395
  .bk-date-picker-rel .bk-date-picker-editor[disabled] {
180
- color: var(--light-gray);
396
+ color: #c4c6cc;
181
397
  cursor: not-allowed;
182
- background-color: var(--date-picker-disabled-bg);
183
- border-color: var(--light-gray);
398
+ background-color: #fafbfd;
399
+ border-color: #c4c6cc;
184
400
  }
185
401
  .bk-date-picker-rel .bk-date-picker-editor.readonly {
186
- background-color: var(--date-picker-disabled-bg);
187
- border-color: var(--light-gray);
402
+ background-color: #fafbfd;
403
+ border-color: #c4c6cc;
188
404
  }
189
405
  .bk-date-picker-rel .bk-date-picker-editor.medium-font {
190
406
  font-size: 14px;
@@ -198,12 +414,12 @@
198
414
  right: 10px;
199
415
  padding: 5px 0;
200
416
  font-size: 14px;
201
- color: var(--light-gray);
417
+ color: #c4c6cc;
202
418
  cursor: pointer;
203
419
  transform: translateY(-50%);
204
420
  }
205
421
  .bk-date-picker-rel .clear-action:hover {
206
- color: var(--gray-color);
422
+ color: #979ba5;
207
423
  }
208
424
  .bk-date-picker-rel .icon-wrapper {
209
425
  position: absolute;
@@ -212,7 +428,7 @@
212
428
  display: inline-block;
213
429
  width: 32px;
214
430
  height: 32px;
215
- color: var(--light-gray);
431
+ color: #c4c6cc;
216
432
  cursor: pointer;
217
433
  background-color: transparent;
218
434
  }
@@ -236,13 +452,13 @@
236
452
  .bk-date-picker-dropdown {
237
453
  position: absolute;
238
454
  z-index: 900;
455
+ box-sizing: border-box;
239
456
  padding: 5px 0 0 0;
240
457
  overflow: auto;
241
- background-color: var(--date-picker-dropdown-bg);
242
- border: 1px solid var(--disable-color);
458
+ background-color: #fff;
459
+ border: 1px solid #dcdee5;
243
460
  border-radius: 2px;
244
461
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
245
- box-sizing: border-box;
246
462
  }
247
463
  .bk-date-picker .bk-select-dropdown {
248
464
  max-height: none;
@@ -317,6 +533,7 @@
317
533
  }
318
534
  .bk-picker-confirm {
319
535
  display: flex;
536
+ justify-content: flex-end;
320
537
  height: 42px;
321
538
  padding: 0 20px;
322
539
  clear: both;
@@ -325,7 +542,6 @@
325
542
  text-align: right;
326
543
  background-color: #fafbfd;
327
544
  border-top: 1px solid #dcdee5;
328
- justify-content: flex-end;
329
545
  }
330
546
  .bk-picker-confirm a {
331
547
  color: #979ba5;
@@ -456,10 +672,10 @@ span.bk-date-picker-cells-cell-disabled:hover {
456
672
  bottom: 0;
457
673
  left: 0;
458
674
  display: block;
675
+ content: '';
459
676
  background: #e1ecff;
460
677
  border: 0;
461
678
  border-radius: 0;
462
- content: '';
463
679
  }
464
680
  .bk-date-picker-cells-cell-range em {
465
681
  position: relative;