bkui-vue 1.0.3-beta.24 → 1.0.3-beta.26

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 (205) hide show
  1. package/dist/style.css +1 -1
  2. package/dist/style.variable.css +1 -1
  3. package/lib/affix/affix.css +1 -1
  4. package/lib/affix/affix.less +2 -2
  5. package/lib/affix/affix.variable.css +3 -3
  6. package/lib/alert/alert.css +21 -21
  7. package/lib/alert/alert.less +17 -16
  8. package/lib/alert/alert.variable.css +23 -23
  9. package/lib/backtop/backtop.css +11 -11
  10. package/lib/backtop/backtop.less +3 -3
  11. package/lib/backtop/backtop.variable.css +13 -13
  12. package/lib/badge/badge.css +32 -32
  13. package/lib/badge/badge.less +5 -5
  14. package/lib/badge/badge.variable.css +34 -34
  15. package/lib/breadcrumb/breadcrumb.css +31 -31
  16. package/lib/breadcrumb/breadcrumb.less +8 -8
  17. package/lib/breadcrumb/breadcrumb.variable.css +33 -33
  18. package/lib/button/button.css +69 -69
  19. package/lib/button/button.less +3 -5
  20. package/lib/button/button.variable.css +71 -71
  21. package/lib/card/card.css +31 -31
  22. package/lib/card/card.less +4 -4
  23. package/lib/card/card.variable.css +33 -33
  24. package/lib/cascader/cascader.css +63 -63
  25. package/lib/cascader/cascader.less +12 -11
  26. package/lib/cascader/cascader.variable.css +65 -65
  27. package/lib/checkbox/checkbox.css +21 -21
  28. package/lib/checkbox/checkbox.less +8 -8
  29. package/lib/checkbox/checkbox.variable.css +23 -23
  30. package/lib/code-diff/code-diff.css +97 -97
  31. package/lib/code-diff/code-diff.less +3 -4
  32. package/lib/code-diff/code-diff.variable.css +99 -99
  33. package/lib/collapse/collapse.css +30 -30
  34. package/lib/collapse/collapse.less +25 -24
  35. package/lib/collapse/collapse.variable.css +32 -32
  36. package/lib/collapse-transition/collapse-transition.css +32 -32
  37. package/lib/collapse-transition/collapse-transition.less +59 -48
  38. package/lib/collapse-transition/collapse-transition.variable.css +34 -34
  39. package/lib/color-picker/color-picker.css +57 -57
  40. package/lib/color-picker/color-picker.less +36 -30
  41. package/lib/color-picker/color-picker.variable.css +59 -59
  42. package/lib/config-provider/config-provider.variable.css +2 -2
  43. package/lib/container/container.css +19 -19
  44. package/lib/container/container.less +3 -3
  45. package/lib/container/container.variable.css +21 -21
  46. package/lib/date-picker/date-picker.css +92 -92
  47. package/lib/date-picker/date-picker.less +55 -54
  48. package/lib/date-picker/date-picker.variable.css +94 -94
  49. package/lib/dialog/dialog.css +51 -51
  50. package/lib/dialog/dialog.less +1 -1
  51. package/lib/dialog/dialog.variable.css +53 -53
  52. package/lib/divider/divider.css +8 -8
  53. package/lib/divider/divider.less +5 -8
  54. package/lib/divider/divider.variable.css +10 -10
  55. package/lib/dropdown/dropdown.css +15 -15
  56. package/lib/dropdown/dropdown.less +6 -6
  57. package/lib/dropdown/dropdown.variable.css +17 -17
  58. package/lib/exception/exception.css +13 -13
  59. package/lib/exception/exception.less +6 -6
  60. package/lib/exception/exception.variable.css +15 -15
  61. package/lib/fixed-navbar/fixed-navbar.css +9 -9
  62. package/lib/fixed-navbar/fixed-navbar.less +1 -2
  63. package/lib/fixed-navbar/fixed-navbar.variable.css +11 -11
  64. package/lib/form/form.css +63 -63
  65. package/lib/form/form.less +14 -16
  66. package/lib/form/form.variable.css +65 -65
  67. package/lib/image/image-viewer.css +23 -23
  68. package/lib/image/image-viewer.less +24 -25
  69. package/lib/image/image-viewer.variable.css +25 -25
  70. package/lib/image/image.css +29 -29
  71. package/lib/image/image.less +6 -8
  72. package/lib/image/image.variable.css +31 -31
  73. package/lib/info-box/info-box.css +10 -10
  74. package/lib/info-box/info-box.less +1 -2
  75. package/lib/info-box/info-box.variable.css +12 -12
  76. package/lib/input/input.css +102 -104
  77. package/lib/input/input.less +27 -33
  78. package/lib/input/input.variable.css +104 -106
  79. package/lib/link/link.css +18 -18
  80. package/lib/link/link.less +1 -3
  81. package/lib/link/link.variable.css +20 -20
  82. package/lib/loading/loading.css +94 -94
  83. package/lib/loading/loading.less +4 -4
  84. package/lib/loading/loading.variable.css +96 -96
  85. package/lib/menu/menu.css +38 -38
  86. package/lib/menu/menu.less +10 -10
  87. package/lib/menu/menu.variable.css +40 -40
  88. package/lib/menu/submenu.css +1 -1
  89. package/lib/menu/submenu.less +1 -1
  90. package/lib/menu/submenu.variable.css +3 -3
  91. package/lib/message/message.css +59 -59
  92. package/lib/message/message.less +25 -24
  93. package/lib/message/message.variable.css +61 -61
  94. package/lib/modal/modal.css +26 -26
  95. package/lib/modal/modal.less +8 -12
  96. package/lib/modal/modal.variable.css +28 -28
  97. package/lib/navigation/navigation.css +25 -25
  98. package/lib/navigation/navigation.less +9 -9
  99. package/lib/navigation/navigation.variable.css +27 -27
  100. package/lib/notify/notify.css +17 -17
  101. package/lib/notify/notify.less +8 -6
  102. package/lib/notify/notify.variable.css +19 -19
  103. package/lib/pagination/pagination.css +60 -60
  104. package/lib/pagination/pagination.less +24 -25
  105. package/lib/pagination/pagination.variable.css +62 -62
  106. package/lib/pop-confirm/pop-confirm.css +10 -10
  107. package/lib/pop-confirm/pop-confirm.less +14 -11
  108. package/lib/pop-confirm/pop-confirm.variable.css +12 -12
  109. package/lib/popover/popover.css +5 -5
  110. package/lib/popover/popover.less +5 -6
  111. package/lib/popover/popover.variable.css +7 -7
  112. package/lib/process/process.css +36 -33
  113. package/lib/process/process.less +8 -7
  114. package/lib/process/process.variable.css +38 -35
  115. package/lib/progress/progress.css +33 -33
  116. package/lib/progress/progress.less +6 -5
  117. package/lib/progress/progress.variable.css +35 -35
  118. package/lib/radio/radio.css +51 -51
  119. package/lib/radio/radio.less +13 -20
  120. package/lib/radio/radio.variable.css +53 -53
  121. package/lib/rate/rate.css +2 -2
  122. package/lib/rate/rate.less +1 -1
  123. package/lib/rate/rate.variable.css +4 -4
  124. package/lib/rate/star.css +7 -7
  125. package/lib/rate/star.less +1 -1
  126. package/lib/rate/star.variable.css +9 -9
  127. package/lib/resize-layout/resize-layout.css +42 -42
  128. package/lib/resize-layout/resize-layout.less +17 -10
  129. package/lib/resize-layout/resize-layout.variable.css +44 -44
  130. package/lib/search-select/search-select.css +15 -15
  131. package/lib/search-select/search-select.variable.css +17 -17
  132. package/lib/select/select.css +87 -87
  133. package/lib/select/select.less +27 -22
  134. package/lib/select/select.variable.css +89 -89
  135. package/lib/sideslider/sideslider.css +14 -14
  136. package/lib/sideslider/sideslider.less +9 -13
  137. package/lib/sideslider/sideslider.variable.css +16 -16
  138. package/lib/slider/slider.css +31 -31
  139. package/lib/slider/slider.less +8 -8
  140. package/lib/slider/slider.variable.css +33 -33
  141. package/lib/steps/steps.css +134 -134
  142. package/lib/steps/steps.less +44 -48
  143. package/lib/steps/steps.variable.css +136 -136
  144. package/lib/styles/mixins/animate.css +4 -4
  145. package/lib/styles/mixins/animate.less +3 -3
  146. package/lib/styles/mixins/animate.variable.css +6 -6
  147. package/lib/styles/mixins/mixins.css +15 -15
  148. package/lib/styles/mixins/mixins.variable.css +15 -15
  149. package/lib/styles/mixins/popper.css +11 -11
  150. package/lib/styles/mixins/popper.less +6 -6
  151. package/lib/styles/mixins/popper.variable.css +13 -13
  152. package/lib/styles/mixins/scroll.css +5 -5
  153. package/lib/styles/mixins/scroll.less +4 -4
  154. package/lib/styles/mixins/scroll.variable.css +7 -7
  155. package/lib/styles/reset.css +6 -6
  156. package/lib/styles/reset.less +4 -5
  157. package/lib/styles/reset.variable.css +8 -8
  158. package/lib/styles/themes/themes copy.less +167 -0
  159. package/lib/styles/themes/themes.less +3 -10
  160. package/lib/swiper/swiper.css +15 -15
  161. package/lib/swiper/swiper.less +8 -8
  162. package/lib/swiper/swiper.variable.css +17 -17
  163. package/lib/switcher/switcher.css +57 -57
  164. package/lib/switcher/switcher.less +14 -22
  165. package/lib/switcher/switcher.variable.css +59 -59
  166. package/lib/tab/tab.css +78 -78
  167. package/lib/tab/tab.less +40 -39
  168. package/lib/tab/tab.variable.css +80 -80
  169. package/lib/table/plugins/head-filter.css +13 -13
  170. package/lib/table/plugins/head-filter.less +3 -3
  171. package/lib/table/plugins/head-filter.variable.css +15 -15
  172. package/lib/table/plugins/head-sort.css +5 -5
  173. package/lib/table/plugins/head-sort.less +2 -2
  174. package/lib/table/plugins/head-sort.variable.css +7 -7
  175. package/lib/table/plugins/settings.css +26 -26
  176. package/lib/table/plugins/settings.less +1 -3
  177. package/lib/table/plugins/settings.variable.css +28 -28
  178. package/lib/table/table.css +380 -380
  179. package/lib/table/table.less +10 -14
  180. package/lib/table/table.variable.css +382 -382
  181. package/lib/tag/tag.css +51 -51
  182. package/lib/tag/tag.less +34 -34
  183. package/lib/tag/tag.variable.css +53 -53
  184. package/lib/tag-input/tag-input.css +38 -38
  185. package/lib/tag-input/tag-input.less +3 -3
  186. package/lib/tag-input/tag-input.variable.css +40 -40
  187. package/lib/time-picker/time-picker.css +40 -40
  188. package/lib/time-picker/time-picker.less +76 -44
  189. package/lib/time-picker/time-picker.variable.css +42 -42
  190. package/lib/timeline/timeline.css +69 -69
  191. package/lib/timeline/timeline.less +6 -12
  192. package/lib/timeline/timeline.variable.css +71 -71
  193. package/lib/transfer/transfer.css +89 -89
  194. package/lib/transfer/transfer.less +1 -1
  195. package/lib/transfer/transfer.variable.css +91 -91
  196. package/lib/tree/tree.css +49 -49
  197. package/lib/tree/tree.less +6 -7
  198. package/lib/tree/tree.variable.css +51 -51
  199. package/lib/upload/upload.css +98 -98
  200. package/lib/upload/upload.less +68 -69
  201. package/lib/upload/upload.variable.css +100 -100
  202. package/lib/virtual-render/virtual-render.css +9 -9
  203. package/lib/virtual-render/virtual-render.less +1 -1
  204. package/lib/virtual-render/virtual-render.variable.css +11 -11
  205. package/package.json +1 -1
package/lib/loading/loading.variable.css CHANGED
@@ -12,13 +12,13 @@
12
12
  --whitesmoke-color: #fafbfd;
13
13
  --disable-color: #dcdee5;
14
14
  --disable-bg-color: #f9fafd;
15
- --border-color: #dcdee5;
16
15
  --font-size-base: 12px;
17
16
  --font-size-medium: 14px;
18
17
  --font-size-large: 16px;
19
18
  --line-height-base: 16px;
20
19
  --line-height-medium: 16px;
21
20
  --line-height-large: 18px;
21
+ --border-color: #dcdee5;
22
22
  --component-size-small: 26px;
23
23
  --component-size-base: 32px;
24
24
  --component-size-large: 40px;
@@ -111,7 +111,7 @@
111
111
  --table-border-color: #dcdee5;
112
112
  --table-head-bg-color: #fafbfd;
113
113
  --table-head-font-color: #313238;
114
- --table-body-font-color: #63656E;
114
+ --table-body-font-color: #63656e;
115
115
  --table-row-hover-bg-color: #f5f7fa;
116
116
  --table-row-active-bg-color: #f0f1f5;
117
117
  --cascader-panel-border-color: #dcdee5;
@@ -140,12 +140,12 @@
140
140
  background-color: transparent;
141
141
  }
142
142
  }
143
- .bk-transition .bk-fade-enter-active,
144
- .bk-transition .bk-fade-leave-active {
143
+ :where(.bk-transition) .bk-fade-enter-active,
144
+ :where(.bk-transition) .bk-fade-leave-active {
145
145
  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
146
146
  }
147
- .bk-transition .bk-fade-enter,
148
- .bk-transition .bk-fade-leave-to {
147
+ :where(.bk-transition) .bk-fade-enter,
148
+ :where(.bk-transition) .bk-fade-leave-to {
149
149
  opacity: 0;
150
150
  }
151
151
  .clearfix-style::after {
@@ -156,7 +156,7 @@
156
156
  content: '';
157
157
  visibility: hidden;
158
158
  }
159
- .bk-popper {
159
+ :where(.bk-popper) {
160
160
  display: none;
161
161
  padding: 7px 14px;
162
162
  font-size: 12px;
@@ -164,62 +164,62 @@
164
164
  background: #333;
165
165
  border-radius: 4px;
166
166
  }
167
- .bk-popper.light {
167
+ :where(.bk-popper).light {
168
168
  color: #63656e;
169
169
  background: #fff;
170
170
  box-shadow: #dcdee5 0 0 6px 0;
171
171
  }
172
- .bk-popper .bk-popper-arrow,
173
- .bk-popper .bk-popper-arrow::before {
172
+ :where(.bk-popper) .bk-popper-arrow,
173
+ :where(.bk-popper) .bk-popper-arrow::before {
174
174
  position: absolute;
175
175
  width: 8px;
176
176
  height: 8px;
177
177
  background: inherit;
178
178
  }
179
- .bk-popper .bk-popper-arrow {
179
+ :where(.bk-popper) .bk-popper-arrow {
180
180
  visibility: hidden;
181
181
  }
182
- .bk-popper .bk-popper-arrow::before {
182
+ :where(.bk-popper) .bk-popper-arrow::before {
183
183
  content: '';
184
184
  visibility: visible;
185
185
  transform: rotate(45deg);
186
186
  }
187
- .bk-popper[data-show] {
187
+ :where(.bk-popper)[data-show] {
188
188
  display: block;
189
189
  }
190
- .bk-popper[data-popper-placement^='top'] > .bk-popper-arrow {
190
+ :where(.bk-popper[data-popper-placement^='top'] > .bk-popper-arrow) {
191
191
  bottom: -4px;
192
192
  }
193
- .bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow {
193
+ :where(.bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow) {
194
194
  top: -4px;
195
195
  }
196
- .bk-popper[data-popper-placement^='left'] > .bk-popper-arrow {
196
+ :where(.bk-popper[data-popper-placement^='left'] > .bk-popper-arrow) {
197
197
  right: -4px;
198
198
  }
199
- .bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
199
+ :where(.bk-popper[data-popper-placement^='right'] > .bk-popper-arrow) {
200
200
  left: -4px;
201
201
  }
202
- .bk-loading-wrapper {
202
+ :where(.bk-loading-wrapper) {
203
203
  position: static;
204
204
  vertical-align: middle;
205
205
  }
206
- .bk-loading-wrapper:not(.bk-nested-loading):not(.bk-directive-loading) {
206
+ :where(.bk-loading-wrapper):not(.bk-nested-loading):not(.bk-directive-loading) {
207
207
  display: inline-flex;
208
208
  }
209
- .bk-loading-wrapper.bk-directive-loading {
209
+ :where(.bk-loading-wrapper).bk-directive-loading {
210
210
  width: 100%;
211
211
  height: 100%;
212
212
  }
213
- .bk-loading-wrapper.bk-directive-loading,
214
- .bk-loading-wrapper.bk-nested-loading {
213
+ :where(.bk-loading-wrapper).bk-directive-loading,
214
+ :where(.bk-loading-wrapper).bk-nested-loading {
215
215
  position: relative;
216
216
  }
217
- .bk-loading-wrapper.bk-directive-loading.is-block,
218
- .bk-loading-wrapper.bk-nested-loading.is-block {
217
+ :where(.bk-loading-wrapper).bk-directive-loading.is-block,
218
+ :where(.bk-loading-wrapper).bk-nested-loading.is-block {
219
219
  display: block;
220
220
  }
221
- .bk-loading-wrapper.bk-directive-loading .bk-loading-indicator,
222
- .bk-loading-wrapper.bk-nested-loading .bk-loading-indicator {
221
+ :where(.bk-loading-wrapper).bk-directive-loading .bk-loading-indicator,
222
+ :where(.bk-loading-wrapper).bk-nested-loading .bk-loading-indicator {
223
223
  position: absolute;
224
224
  top: 50%;
225
225
  left: 50%;
@@ -227,7 +227,7 @@
227
227
  text-align: center;
228
228
  transform: translate(-50%, -50%);
229
229
  }
230
- .bk-loading-wrapper .dot {
230
+ :where(.bk-loading-wrapper) .dot {
231
231
  display: inline-flex;
232
232
  width: 14px;
233
233
  height: 14px;
@@ -239,7 +239,7 @@
239
239
  animation-name: loading-scale-animate;
240
240
  animation-direction: normal;
241
241
  }
242
- .bk-loading-wrapper .oval {
242
+ :where(.bk-loading-wrapper) .oval {
243
243
  position: absolute;
244
244
  width: 6px;
245
245
  height: 8px;
@@ -250,191 +250,191 @@
250
250
  animation-name: fade;
251
251
  transform-origin: center 24px;
252
252
  }
253
- .bk-loading-wrapper .bk-loading-mask {
253
+ :where(.bk-loading-wrapper) .bk-loading-mask {
254
254
  position: absolute;
255
255
  top: 0;
256
256
  left: 0;
257
257
  width: 100%;
258
258
  height: 100%;
259
259
  }
260
- .bk-loading-wrapper .bk-loading-indicator {
260
+ :where(.bk-loading-wrapper) .bk-loading-indicator {
261
261
  display: flex;
262
262
  line-height: 1;
263
263
  text-align: center;
264
264
  flex-direction: column;
265
265
  }
266
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .oval,
267
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot,
268
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-1,
269
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-2,
270
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-3,
271
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-4 {
266
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .oval,
267
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot,
268
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot-1,
269
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot-2,
270
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot-3,
271
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-success .dot-4 {
272
272
  background-color: #2dcb56;
273
273
  }
274
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .oval,
275
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot,
276
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-1,
277
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-2,
278
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-3,
279
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-4 {
274
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .oval,
275
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot,
276
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot-1,
277
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot-2,
278
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot-3,
279
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-danger .dot-4 {
280
280
  background-color: #ea3636;
281
281
  }
282
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .oval,
283
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot,
284
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-1,
285
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-2,
286
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-3,
287
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-4 {
282
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .oval,
283
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot,
284
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot-1,
285
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot-2,
286
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot-3,
287
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-warning .dot-4 {
288
288
  background-color: #ff9c01;
289
289
  }
290
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .oval,
291
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot,
292
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-1,
293
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-2,
294
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-3,
295
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-4 {
290
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .oval,
291
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot,
292
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot-1,
293
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot-2,
294
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot-3,
295
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-primary .dot-4 {
296
296
  background-color: #3a84ff;
297
297
  }
298
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .oval,
299
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot,
300
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-1,
301
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-2,
302
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-3,
303
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-4 {
298
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .oval,
299
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot,
300
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot-1,
301
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot-2,
302
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot-3,
303
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-white .dot-4 {
304
304
  background-color: white;
305
305
  }
306
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .oval,
307
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot,
308
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-1,
309
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-2,
310
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-3,
311
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-4 {
306
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .oval,
307
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot,
308
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot-1,
309
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot-2,
310
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot-3,
311
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-default .dot-4 {
312
312
  background-color: #c4c6cc;
313
313
  }
314
- .bk-loading-wrapper .bk-loading-indicator .dot-1 {
314
+ :where(.bk-loading-wrapper) .bk-loading-indicator .dot-1 {
315
315
  background-color: #ea3636;
316
316
  animation-delay: 0.1s;
317
317
  }
318
- .bk-loading-wrapper .bk-loading-indicator .dot-2 {
318
+ :where(.bk-loading-wrapper) .bk-loading-indicator .dot-2 {
319
319
  background-color: #ff9c01;
320
320
  animation-delay: 0.25s;
321
321
  }
322
- .bk-loading-wrapper .bk-loading-indicator .dot-3 {
322
+ :where(.bk-loading-wrapper) .bk-loading-indicator .dot-3 {
323
323
  background-color: #2dcb56;
324
324
  animation-delay: 0.4s;
325
325
  }
326
- .bk-loading-wrapper .bk-loading-indicator .dot-4 {
326
+ :where(.bk-loading-wrapper) .bk-loading-indicator .dot-4 {
327
327
  background-color: #3a84ff;
328
328
  animation-delay: 0.55s;
329
329
  margin-right: 0px;
330
330
  }
331
- .bk-loading-wrapper .bk-loading-indicator .oval-1 {
331
+ :where(.bk-loading-wrapper) .bk-loading-indicator .oval-1 {
332
332
  transform: rotate(135deg);
333
333
  animation-delay: -0.45s;
334
334
  }
335
- .bk-loading-wrapper .bk-loading-indicator .oval-2 {
335
+ :where(.bk-loading-wrapper) .bk-loading-indicator .oval-2 {
336
336
  transform: rotate(90deg);
337
337
  animation-delay: -0.6s;
338
338
  }
339
- .bk-loading-wrapper .bk-loading-indicator .oval-3 {
339
+ :where(.bk-loading-wrapper) .bk-loading-indicator .oval-3 {
340
340
  transform: rotate(45deg);
341
341
  animation-delay: -0.75s;
342
342
  }
343
- .bk-loading-wrapper .bk-loading-indicator .oval-4 {
343
+ :where(.bk-loading-wrapper) .bk-loading-indicator .oval-4 {
344
344
  transform: rotate(0deg);
345
345
  animation-delay: -0.9s;
346
346
  }
347
- .bk-loading-wrapper .bk-loading-indicator .oval-5 {
347
+ :where(.bk-loading-wrapper) .bk-loading-indicator .oval-5 {
348
348
  transform: rotate(-45deg);
349
349
  animation-delay: -1.05s;
350
350
  }
351
- .bk-loading-wrapper .bk-loading-indicator .oval-6 {
351
+ :where(.bk-loading-wrapper) .bk-loading-indicator .oval-6 {
352
352
  transform: rotate(-90deg);
353
353
  animation-delay: -1.2s;
354
354
  }
355
- .bk-loading-wrapper .bk-loading-indicator .oval-7 {
355
+ :where(.bk-loading-wrapper) .bk-loading-indicator .oval-7 {
356
356
  transform: rotate(-135deg);
357
357
  animation-delay: -1.35s;
358
358
  }
359
- .bk-loading-wrapper .bk-loading-indicator .oval-8 {
359
+ :where(.bk-loading-wrapper) .bk-loading-indicator .oval-8 {
360
360
  transform: rotate(-180deg);
361
361
  animation-delay: -1.5s;
362
362
  }
363
- .bk-loading-wrapper .bk-loading-indicator .bk-normal-indicator {
363
+ :where(.bk-loading-wrapper) .bk-loading-indicator .bk-normal-indicator {
364
364
  display: inline-flex;
365
365
  justify-content: center;
366
366
  }
367
- .bk-loading-wrapper .bk-loading-indicator .bk-spin-indicator {
367
+ :where(.bk-loading-wrapper) .bk-loading-indicator .bk-spin-indicator {
368
368
  position: relative;
369
369
  display: inline-flex;
370
370
  justify-content: center;
371
371
  width: 48px;
372
372
  height: 48px;
373
373
  }
374
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .bk-spin-indicator {
374
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .bk-spin-indicator {
375
375
  height: 16px;
376
376
  width: 16px;
377
377
  }
378
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .dot {
378
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .dot {
379
379
  width: 3px;
380
380
  height: 3px;
381
381
  margin-right: 3px;
382
382
  }
383
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .dot.dot-4 {
383
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .dot.dot-4 {
384
384
  margin-right: 0;
385
385
  }
386
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .oval {
386
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .oval {
387
387
  width: 2px;
388
388
  height: 3px;
389
389
  border-radius: 3px;
390
390
  transform-origin: center 8px;
391
391
  }
392
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .bk-loading-title {
392
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-mini .bk-loading-title {
393
393
  font-size: 14px;
394
394
  }
395
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-spin-indicator {
395
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .bk-spin-indicator {
396
396
  height: 32px;
397
397
  width: 32px;
398
398
  }
399
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .dot {
399
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .dot {
400
400
  width: 6px;
401
401
  height: 6px;
402
402
  margin-right: 6px;
403
403
  }
404
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .dot.dot-4 {
404
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .dot.dot-4 {
405
405
  margin-right: 0;
406
406
  }
407
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .oval {
407
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .oval {
408
408
  width: 4px;
409
409
  height: 5px;
410
410
  border-radius: 5px;
411
411
  transform-origin: center 16px;
412
412
  }
413
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-loading-title {
413
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-small .bk-loading-title {
414
414
  font-size: 12px;
415
415
  }
416
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-spin-indicator {
416
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .bk-spin-indicator {
417
417
  height: 68px;
418
418
  width: 68px;
419
419
  }
420
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .dot {
420
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .dot {
421
421
  width: 20px;
422
422
  height: 20px;
423
423
  margin-right: 12px;
424
424
  }
425
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .dot.dot-4 {
425
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .dot.dot-4 {
426
426
  margin-right: 0;
427
427
  }
428
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .oval {
428
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .oval {
429
429
  width: 8px;
430
430
  height: 12px;
431
431
  border-radius: 12px;
432
432
  transform-origin: center 34px;
433
433
  }
434
- .bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-loading-title {
434
+ :where(.bk-loading-wrapper) .bk-loading-indicator.bk-loading-size-large .bk-loading-title {
435
435
  font-size: 14px;
436
436
  }
437
- .bk-loading-wrapper .bk-loading-indicator .bk-loading-title {
437
+ :where(.bk-loading-wrapper) .bk-loading-indicator .bk-loading-title {
438
438
  margin-top: 8px;
439
439
  font-size: 14px;
440
440
  line-height: normal;
package/lib/menu/menu.css CHANGED
@@ -11,12 +11,12 @@
11
11
  background-color: transparent;
12
12
  }
13
13
  }
14
- .bk-transition .bk-fade-enter-active,
15
- .bk-transition .bk-fade-leave-active {
14
+ :where(.bk-transition) .bk-fade-enter-active,
15
+ :where(.bk-transition) .bk-fade-leave-active {
16
16
  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
17
17
  }
18
- .bk-transition .bk-fade-enter,
19
- .bk-transition .bk-fade-leave-to {
18
+ :where(.bk-transition) .bk-fade-enter,
19
+ :where(.bk-transition) .bk-fade-leave-to {
20
20
  opacity: 0;
21
21
  }
22
22
  .clearfix-style::after {
@@ -27,7 +27,7 @@
27
27
  content: '';
28
28
  visibility: hidden;
29
29
  }
30
- .bk-popper {
30
+ :where(.bk-popper) {
31
31
  display: none;
32
32
  padding: 7px 14px;
33
33
  font-size: 12px;
@@ -35,39 +35,39 @@
35
35
  background: #333;
36
36
  border-radius: 4px;
37
37
  }
38
- .bk-popper.light {
38
+ :where(.bk-popper).light {
39
39
  color: #63656e;
40
40
  background: #fff;
41
41
  box-shadow: #dcdee5 0 0 6px 0;
42
42
  }
43
- .bk-popper .bk-popper-arrow,
44
- .bk-popper .bk-popper-arrow::before {
43
+ :where(.bk-popper) .bk-popper-arrow,
44
+ :where(.bk-popper) .bk-popper-arrow::before {
45
45
  position: absolute;
46
46
  width: 8px;
47
47
  height: 8px;
48
48
  background: inherit;
49
49
  }
50
- .bk-popper .bk-popper-arrow {
50
+ :where(.bk-popper) .bk-popper-arrow {
51
51
  visibility: hidden;
52
52
  }
53
- .bk-popper .bk-popper-arrow::before {
53
+ :where(.bk-popper) .bk-popper-arrow::before {
54
54
  content: '';
55
55
  visibility: visible;
56
56
  transform: rotate(45deg);
57
57
  }
58
- .bk-popper[data-show] {
58
+ :where(.bk-popper)[data-show] {
59
59
  display: block;
60
60
  }
61
- .bk-popper[data-popper-placement^='top'] > .bk-popper-arrow {
61
+ :where(.bk-popper[data-popper-placement^='top'] > .bk-popper-arrow) {
62
62
  bottom: -4px;
63
63
  }
64
- .bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow {
64
+ :where(.bk-popper[data-popper-placement^='bottom'] > .bk-popper-arrow) {
65
65
  top: -4px;
66
66
  }
67
- .bk-popper[data-popper-placement^='left'] > .bk-popper-arrow {
67
+ :where(.bk-popper[data-popper-placement^='left'] > .bk-popper-arrow) {
68
68
  right: -4px;
69
69
  }
70
- .bk-popper[data-popper-placement^='right'] > .bk-popper-arrow {
70
+ :where(.bk-popper[data-popper-placement^='right'] > .bk-popper-arrow) {
71
71
  left: -4px;
72
72
  }
73
73
  .collapse {
@@ -76,17 +76,17 @@
76
76
  .open {
77
77
  background: #151d2c;
78
78
  }
79
- .bk-menu {
79
+ :where(.bk-menu) {
80
80
  display: flex;
81
81
  width: 260px;
82
82
  background-color: #182132;
83
83
  flex-direction: column;
84
84
  transition: width 0.3s ease-out;
85
85
  }
86
- .bk-menu.is-collapse {
86
+ :where(.bk-menu).is-collapse {
87
87
  width: 60px;
88
88
  }
89
- .bk-menu-submenu {
89
+ :where(.bk-menu) .bk-menu-submenu {
90
90
  display: flex;
91
91
  flex-direction: column;
92
92
  overflow: hidden;
@@ -95,24 +95,24 @@
95
95
  align-items: center;
96
96
  transition: width 0.3s ease-out;
97
97
  }
98
- .bk-menu-submenu.is-opened {
98
+ :where(.bk-menu) .bk-menu-submenu.is-opened {
99
99
  background: #151d2c;
100
100
  }
101
- .bk-menu-submenu:hover {
101
+ :where(.bk-menu) .bk-menu-submenu:hover {
102
102
  color: white;
103
103
  cursor: pointer;
104
104
  }
105
- .bk-menu-submenu .submenu-header {
105
+ :where(.bk-menu) .bk-menu-submenu .submenu-header {
106
106
  display: flex;
107
107
  width: 100%;
108
108
  height: 40px;
109
109
  align-items: center;
110
110
  }
111
- .bk-menu-submenu .submenu-header.is-collapse {
111
+ :where(.bk-menu) .bk-menu-submenu .submenu-header.is-collapse {
112
112
  color: white;
113
113
  background: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
114
114
  }
115
- .bk-menu-submenu .submenu-header-icon {
115
+ :where(.bk-menu) .bk-menu-submenu .submenu-header-icon {
116
116
  display: flex;
117
117
  height: 100%;
118
118
  font-size: 18px;
@@ -120,7 +120,7 @@
120
120
  align-items: center;
121
121
  justify-content: center;
122
122
  }
123
- .bk-menu-submenu .submenu-header-icon .menu-icon {
123
+ :where(.bk-menu) .bk-menu-submenu .submenu-header-icon .menu-icon {
124
124
  display: flex;
125
125
  width: 16px;
126
126
  height: 16px;
@@ -129,14 +129,14 @@
129
129
  justify-content: center;
130
130
  color: #b0bdd5;
131
131
  }
132
- .bk-menu-submenu .submenu-header-content {
132
+ :where(.bk-menu) .bk-menu-submenu .submenu-header-content {
133
133
  display: flex;
134
134
  height: 100%;
135
135
  align-items: center;
136
136
  flex: 1;
137
137
  color: #acb9d1;
138
138
  }
139
- .bk-menu-submenu .submenu-header-collapse {
139
+ :where(.bk-menu) .bk-menu-submenu .submenu-header-collapse {
140
140
  display: flex;
141
141
  width: 16px;
142
142
  height: 16px;
@@ -148,10 +148,10 @@
148
148
  transform: rotate(-90deg);
149
149
  transition: transform 0.3s ease-out;
150
150
  }
151
- .bk-menu-submenu .submenu-header-collapse.is-collapse {
151
+ :where(.bk-menu) .bk-menu-submenu .submenu-header-collapse.is-collapse {
152
152
  transform: rotate(0deg);
153
153
  }
154
- .bk-menu-submenu .submenu-list {
154
+ :where(.bk-menu) .bk-menu-submenu .submenu-list {
155
155
  display: flex;
156
156
  width: 100%;
157
157
  padding: 0;
@@ -161,7 +161,7 @@
161
161
  /* stylelint-disable-next-line declaration-no-important */
162
162
  transition-property: all !important;
163
163
  }
164
- .bk-menu-item {
164
+ :where(.bk-menu) .bk-menu-item {
165
165
  display: flex;
166
166
  width: 100%;
167
167
  height: 40px;
@@ -175,15 +175,15 @@
175
175
  align-items: center;
176
176
  transition: width 0.3s ease-in-out;
177
177
  }
178
- .bk-menu-item:hover {
178
+ :where(.bk-menu) .bk-menu-item:hover {
179
179
  color: white;
180
180
  cursor: pointer;
181
181
  }
182
- .bk-menu-item.is-active {
182
+ :where(.bk-menu) .bk-menu-item.is-active {
183
183
  color: white;
184
184
  background: linear-gradient(90deg, #3f87ff 0%, #3a84ff 100%);
185
185
  }
186
- .bk-menu-item .item-icon {
186
+ :where(.bk-menu) .bk-menu-item .item-icon {
187
187
  display: flex;
188
188
  height: 100%;
189
189
  font-size: 18px;
@@ -191,7 +191,7 @@
191
191
  align-items: center;
192
192
  justify-content: center;
193
193
  }
194
- .bk-menu-item .item-icon .default-icon {
194
+ :where(.bk-menu) .bk-menu-item .item-icon .default-icon {
195
195
  display: inline-block;
196
196
  width: 3px;
197
197
  height: 3px;
@@ -199,17 +199,17 @@
199
199
  background-color: white;
200
200
  border-radius: 50%;
201
201
  }
202
- .bk-menu-item .item-content {
202
+ :where(.bk-menu) .bk-menu-item .item-content {
203
203
  display: flex;
204
204
  height: 100%;
205
205
  align-items: center;
206
206
  flex: 1;
207
207
  }
208
- .bk-menu-group {
208
+ :where(.bk-menu) .bk-menu-group {
209
209
  display: flex;
210
210
  flex-direction: column;
211
211
  }
212
- .bk-menu-group .group-name {
212
+ :where(.bk-menu) .bk-menu-group .group-name {
213
213
  display: flex;
214
214
  height: 40px;
215
215
  margin: 0 18px;
@@ -222,12 +222,12 @@
222
222
  flex-wrap: nowrap;
223
223
  align-items: center;
224
224
  }
225
- .bk-menu-group .group-wrap {
225
+ :where(.bk-menu) .bk-menu-group .group-wrap {
226
226
  display: flex;
227
227
  flex-direction: column;
228
228
  padding: 0;
229
229
  margin: 0;
230
230
  }
231
- .bk-menu .collapse-transition {
231
+ :where(.bk-menu) .collapse-transition {
232
232
  transition: all 0.3s ease-in-out;
233
233
  }