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

package/lib/time-picker/time-picker.variable.css

@@ -12,13 +12,13 @@
   --whitesmoke-color: #fafbfd;
   --disable-color: #dcdee5;
   --disable-bg-color: #f9fafd;
+  --border-color: #dcdee5;
   --font-size-base: 12px;
   --font-size-medium: 14px;
   --font-size-large: 16px;
   --line-height-base: 16px;
   --line-height-medium: 16px;
   --line-height-large: 18px;
-  --border-color: #dcdee5;
   --component-size-small: 26px;
   --component-size-base: 32px;
   --component-size-large: 40px;
@@ -111,7 +111,7 @@
   --table-border-color: #dcdee5;
   --table-head-bg-color: #fafbfd;
   --table-head-font-color: #313238;
-  --table-body-font-color: #63656e;
+  --table-body-font-color: #63656E;
   --table-row-hover-bg-color: #f5f7fa;
   --table-row-active-bg-color: #f0f1f5;
   --cascader-panel-border-color: #dcdee5;
@@ -127,7 +127,7 @@
   --select-active-color: #e1ecff;
   --select-hover-color: #f5f7fa;
 }
-:where(.bk-time-picker-header) {
+.bk-time-picker-header {
   height: 46px;
   font-size: 14px;
   font-weight: 700;
@@ -136,7 +136,7 @@
   text-align: center;
   border-bottom: 1px solid #dcdee5;
 }
-:where(.bk-time-picker-cells):after {
+.bk-time-picker-cells:after {
   position: absolute;
   right: 0;
   left: 0;
@@ -152,8 +152,8 @@
   box-sizing: border-box;
   mix-blend-mode: multiply;
 }
-:where(.bk-time-picker-cells-with-seconds) .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before,
-:where(.bk-time-picker-cells-with-seconds) .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):before {
+.bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before,
+.bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):before {
   position: absolute;
   top: 55px;
   left: 85px;
@@ -164,8 +164,8 @@
   border-radius: 50%;
   content: '';
 }
-:where(.bk-time-picker-cells-with-seconds) .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after,
-:where(.bk-time-picker-cells-with-seconds) .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):after {
+.bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after,
+.bk-time-picker-cells-with-seconds .bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(2):after {
   position: absolute;
   top: calc(55px + 5px);
   left: 85px;
@@ -176,12 +176,12 @@
   border-radius: 50%;
   content: '';
 }
-:where(.bk-time-picker-cells-title-wrapper) {
+.bk-time-picker-cells-title-wrapper {
   width: 100%;
   height: 42px;
   line-height: 42px;
 }
-:where(.bk-time-picker-cells-title-wrapper) .bk-time-picker-cells-title {
+.bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title {
   position: relative;
   float: left;
   width: 33.33%;
@@ -191,10 +191,10 @@
   text-align: center;
   list-style: none;
 }
-:where(.bk-time-picker-cells-title-wrapper) .bk-time-picker-cells-title.active {
+.bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title.active {
   color: #3a84ff;
 }
-:where(.bk-time-picker-cells-title-wrapper) .bk-time-picker-cells-title:nth-of-type(1):before {
+.bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):before {
   position: absolute;
   top: 55px;
   left: 133px;
@@ -205,7 +205,7 @@
   border-radius: 50%;
   content: '';
 }
-:where(.bk-time-picker-cells-title-wrapper) .bk-time-picker-cells-title:nth-of-type(1):after {
+.bk-time-picker-cells-title-wrapper .bk-time-picker-cells-title:nth-of-type(1):after {
   position: absolute;
   top: calc(55px + 5px);
   left: 133px;
@@ -216,39 +216,39 @@
   border-radius: 50%;
   content: '';
 }
-:where(.bk-time-picker-cells-list) {
+.bk-time-picker-cells-list {
   position: relative;
   float: left;
   width: 33.33%;
   max-height: 200px;
   overflow: hidden;
 }
-:where(.bk-time-picker-cells-list:hover) {
+.bk-time-picker-cells-list:hover {
   overflow-y: auto;
 }
-:where(.bk-time-picker-cells-list:first-child) {
+.bk-time-picker-cells-list:first-child {
   border-radius: 2px 0 0 2px;
 }
-:where(.bk-time-picker-cells-list:last-child) {
+.bk-time-picker-cells-list:last-child {
   border-radius: 0 2px 2px 0;
 }
-:where(.bk-time-picker-cells-list::-webkit-scrollbar) {
+.bk-time-picker-cells-list::-webkit-scrollbar {
   width: 0;
   height: 0;
   background-color: rgba(204, 204, 204, 0);
 }
-:where(.bk-time-picker-cells-list::-webkit-scrollbar-thumb) {
+.bk-time-picker-cells-list::-webkit-scrollbar-thumb {
   width: 0;
   height: 0;
   background-color: transparent;
 }
-:where(.bk-time-picker-cells-list) .bk-time-picker-cells-ul {
+.bk-time-picker-cells-list .bk-time-picker-cells-ul {
   width: 100%;
   padding: 0 0 168px 0;
   margin: 0;
   list-style: none;
 }
-:where(.bk-time-picker-cells-list) .bk-time-picker-cells-ul .bk-time-picker-cells-cell {
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell {
   position: relative;
   width: 100%;
   height: 32px;
@@ -264,23 +264,23 @@
   transition: background 0.2s ease-in-out;
   user-select: none;
 }
-:where(.bk-time-picker-cells-list) .bk-time-picker-cells-ul .bk-time-picker-cells-cell:hover {
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell:hover {
   color: #3a84ff;
 }
-:where(.bk-time-picker-cells-list) .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled {
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled {
   color: #c4c6cc;
   cursor: not-allowed;
 }
-:where(.bk-time-picker-cells-list) .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled:hover {
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-disabled:hover {
   color: #c4c6cc;
   cursor: not-allowed;
   background-color: #fff;
 }
-:where(.bk-time-picker-cells-list) .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected,
-:where(.bk-time-picker-cells-list) .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected:hover {
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected,
+.bk-time-picker-cells-list .bk-time-picker-cells-ul .bk-time-picker-cells-cell-selected:hover {
   color: #3a84ff;
 }
-:where(.bk-time-picker-header) {
+.bk-time-picker-header {
   height: 46px;
   font-size: 14px;
   font-weight: 700;
@@ -289,11 +289,11 @@
   text-align: center;
   border-bottom: 1px solid #dcdee5;
 }
-:where(.bk-time-picker-with-range) .bk-picker-panel-content {
+.bk-time-picker-with-range .bk-picker-panel-content {
   position: relative;
   float: left;
 }
-:where(.bk-time-picker-with-range) .bk-picker-panel-content:after {
+.bk-time-picker-with-range .bk-picker-panel-content:after {
   position: absolute;
   top: 45px;
   right: 0;
@@ -304,42 +304,42 @@
   background: #e8eaec;
   content: '';
 }
-:where(.bk-time-picker-with-range) .bk-picker-panel-content-right {
+.bk-time-picker-with-range .bk-picker-panel-content-right {
   float: right;
 }
-:where(.bk-time-picker-with-range) .bk-picker-panel-content-right:after {
+.bk-time-picker-with-range .bk-picker-panel-content-right:after {
   right: auto;
   left: 0;
 }
-:where(.bk-time-picker-with-range) .bk-time-picker-cells-list:first-child {
+.bk-time-picker-with-range .bk-time-picker-cells-list:first-child {
   border-radius: 0;
 }
-:where(.bk-time-picker-with-range) .bk-time-picker-cells-list:last-child {
+.bk-time-picker-with-range .bk-time-picker-cells-list:last-child {
   border-radius: 0;
 }
-:where(.bk-picker-panel-content) .bk-picker-panel-content .bk-time-picker-cells {
-  position: relative;
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells {
   min-width: 216px;
+  position: relative;
 }
-:where(.bk-picker-panel-content) .bk-picker-panel-content .bk-time-picker-cells-with-seconds {
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds {
   min-width: 216px;
 }
-:where(.bk-picker-panel-content) .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list {
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list {
   width: 72px;
 }
-:where(.bk-picker-panel-content) .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list ul li {
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-with-seconds .bk-time-picker-cells-list ul li {
   padding: 0;
 }
-:where(.bk-picker-panel-content) .bk-picker-panel-content .bk-time-picker-cells-list {
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list {
   width: 108px;
   max-height: 200px;
 }
-:where(.bk-picker-panel-content) .bk-picker-panel-content .bk-time-picker-cells-list:first-child {
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:first-child {
   border-radius: 0;
 }
-:where(.bk-picker-panel-content) .bk-picker-panel-content .bk-time-picker-cells-list:last-child {
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list:last-child {
   border-radius: 0;
 }
-:where(.bk-picker-panel-content) .bk-picker-panel-content .bk-time-picker-cells-list ul {
+.bk-picker-panel-content .bk-picker-panel-content .bk-time-picker-cells-list ul {
   padding: 0 0 168px 0;
 }

package/lib/timeline/index.js

@@ -1,7 +1,6 @@
-import "../styles/reset.css";
-import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__ from "../shared";
+import * as __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__ from "../shared";
 import * as __WEBPACK_EXTERNAL_MODULE_vue__ from "vue";
-import * as __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__ from "../config-provider";
+import * as __WEBPACK_EXTERNAL_MODULE__config_provider_9d0186d9__ from "../config-provider";
 /******/ // The require scope
 /******/ var __webpack_require__ = {};
 /******/ 
@@ -34,7 +33,7 @@ __webpack_require__.d(__webpack_exports__, {
 ;// CONCATENATED MODULE: external "../shared"
 var x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var y = x => () => x
-const shared_namespaceObject = x({ ["PropTypes"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.PropTypes, ["classes"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.classes, ["withInstall"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_shared_edbdfb03__.withInstall });
+const external_shared_namespaceObject = x({ ["PropTypes"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.PropTypes, ["classes"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.classes, ["withInstall"]: () => __WEBPACK_EXTERNAL_MODULE__shared_65459f0a__.withInstall });
 ;// CONCATENATED MODULE: ../../node_modules/@babel/runtime/helpers/esm/typeof.js
 function _typeof(o) {
   "@babel/helpers - typeof";
@@ -50,9 +49,9 @@ var external_vue_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
 var external_vue_y = x => () => x
 const external_vue_namespaceObject = external_vue_x({ ["createVNode"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.createVNode, ["defineComponent"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.defineComponent, ["onMounted"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.onMounted, ["ref"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.ref, ["watch"]: () => __WEBPACK_EXTERNAL_MODULE_vue__.watch });
 ;// CONCATENATED MODULE: external "../config-provider"
-var config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
-var config_provider_y = x => () => x
-const config_provider_namespaceObject = config_provider_x({ ["usePrefix"]: () => __WEBPACK_EXTERNAL_MODULE_bkui_vue_lib_config_provider_fe8577a3__.usePrefix });
+var external_config_provider_x = y => { var x = {}; __webpack_require__.d(x, y); return x; }
+var external_config_provider_y = x => () => x
+const external_config_provider_namespaceObject = external_config_provider_x({ ["usePrefix"]: () => __WEBPACK_EXTERNAL_MODULE__config_provider_9d0186d9__.usePrefix });
 ;// CONCATENATED MODULE: ../../packages/timeline/src/timeline.tsx
 
 
@@ -85,9 +84,9 @@ const config_provider_namespaceObject = config_provider_x({ ["usePrefix"]: () =>
 
 
 var timelineProps = {
-  list: shared_namespaceObject.PropTypes.array.def([]),
-  titleAble: shared_namespaceObject.PropTypes.bool.def(false),
-  extCls: shared_namespaceObject.PropTypes.string
+  list: external_shared_namespaceObject.PropTypes.array.def([]),
+  titleAble: external_shared_namespaceObject.PropTypes.bool.def(false),
+  extCls: external_shared_namespaceObject.PropTypes.string
 };
 /* harmony default export */ const timeline = ((0,external_vue_namespaceObject.defineComponent)({
   name: 'Timeline',
@@ -145,7 +144,7 @@ var timelineProps = {
     }, {
       deep: true
     });
-    var _usePrefix = (0,config_provider_namespaceObject.usePrefix)(),
+    var _usePrefix = (0,external_config_provider_namespaceObject.usePrefix)(),
       resolveClassName = _usePrefix.resolveClassName;
     return {
       defaultTimelines: defaultTimelines,
@@ -170,7 +169,7 @@ var timelineProps = {
       var timelineFilledCls = item.filled ? "".concat(timelineClsPrefix, "-filled") : '';
       var timelinesColorsCls = item.color && dotColors.includes(item.color) ? "".concat(timelineClsPrefix, "-").concat(item.color) : '';
       var timelineCustomIcon = isIcon(item) ? "".concat(timelineClsPrefix, "-custom") : '';
-      var timelinesCls = (0,shared_namespaceObject.classes)({}, "".concat(timelineClsPrefix, " ").concat(timelineThemeCls, " ").concat(timelineSizeCls, " ").concat(timelinesColorsCls, " ").concat(timelineFilledCls, " ").concat(timelineCustomIcon));
+      var timelinesCls = (0,external_shared_namespaceObject.classes)({}, "".concat(timelineClsPrefix, " ").concat(timelineThemeCls, " ").concat(timelineSizeCls, " ").concat(timelinesColorsCls, " ").concat(timelineFilledCls, " ").concat(timelineCustomIcon));
       return timelinesCls;
     };
     var getContent = function getContent(item) {
@@ -236,7 +235,7 @@ var timelineProps = {
  */
 
 
-var BkTimeline = (0,shared_namespaceObject.withInstall)(timeline);
+var BkTimeline = (0,external_shared_namespaceObject.withInstall)(timeline);
 /* harmony default export */ const src = (BkTimeline);
 var __webpack_exports__default = __webpack_exports__["default"];
 export { __webpack_exports__default as default };

package/lib/timeline/timeline.css

@@ -1,7 +1,7 @@
 * {
   box-sizing: border-box;
 }
-:where(.bk-timeline) {
+.bk-timeline {
   padding: 0;
   margin: 16px 0 0;
   font-style: normal;
@@ -10,7 +10,7 @@
   text-align: left;
   list-style: none;
 }
-:where(.bk-timeline) .bk-timeline-dot {
+.bk-timeline .bk-timeline-dot {
   position: relative;
   padding-bottom: 24px;
   padding-left: 16px;
@@ -19,7 +19,7 @@
   font-size: 0;
   border-left: 1px solid #d8d8d8;
 }
-:where(.bk-timeline) .bk-timeline-dot::before {
+.bk-timeline .bk-timeline-dot::before {
   position: absolute;
   top: calc(12px * -1);
   left: -6px;
@@ -32,12 +32,12 @@
   content: '';
   box-sizing: border-box;
 }
-:where(.bk-timeline) .bk-timeline-dot:last-child {
+.bk-timeline .bk-timeline-dot:last-child {
   padding-bottom: 0;
   /* 保留border使用间距保持一致 */
   border-left: 1px solid transparent;
 }
-:where(.bk-timeline) .bk-timeline-dot .bk-timeline-title {
+.bk-timeline .bk-timeline-dot .bk-timeline-title {
   display: inline-block;
   padding-bottom: 10px;
   margin-top: -3px;
@@ -45,13 +45,13 @@
   color: #63656e;
   cursor: pointer;
 }
-:where(.bk-timeline) .bk-timeline-dot .bk-timeline-content {
+.bk-timeline .bk-timeline-dot .bk-timeline-content {
   max-width: 300px;
   font-size: 14px;
   color: #979ba5;
   word-break: break-all;
 }
-:where(.bk-timeline) .bk-timeline-dot .bk-timeline-icon {
+.bk-timeline .bk-timeline-dot .bk-timeline-icon {
   position: absolute;
   top: calc(16px * -1);
   left: -8px;
@@ -63,165 +63,165 @@
   justify-content: center;
   align-items: center;
 }
-:where(.bk-timeline) .bk-timeline-dot .bk-timeline-icon .bk-timeline-icon-inner {
+.bk-timeline .bk-timeline-dot .bk-timeline-icon .bk-timeline-icon-inner {
   display: inline-block;
 }
-:where(.bk-timeline) .bk-timeline-dot .bk-timeline-icon .bk-timeline-icon-inner > :first-child {
+.bk-timeline .bk-timeline-dot .bk-timeline-icon .bk-timeline-icon-inner > :first-child {
   font-size: 12px;
 }
-:where(.bk-timeline) .bk-timeline-dot .bk-timeline-section {
+.bk-timeline .bk-timeline-dot .bk-timeline-section {
   position: relative;
   top: calc((11px + 2px) * -1);
 }
-:where(.bk-timeline) .bk-timeline-dot.bk-timeline-large {
+.bk-timeline .bk-timeline-dot.bk-timeline-large {
   margin-top: calc(15px + 2px);
 }
-:where(.bk-timeline) .bk-timeline-dot.bk-timeline-large::before {
+.bk-timeline .bk-timeline-dot.bk-timeline-large::before {
   top: calc((15px + 1px) * -1);
   left: -8px;
   width: 15px;
   height: 15px;
 }
-:where(.bk-timeline) .bk-timeline-dot.bk-timeline-large > .bk-timeline-section {
+.bk-timeline .bk-timeline-dot.bk-timeline-large > .bk-timeline-section {
   top: calc((15px + 1px) * -1);
 }
-:where(.bk-timeline) .bk-timeline-dot.bk-timeline-item-custom-icon {
+.bk-timeline .bk-timeline-dot.bk-timeline-item-custom-icon {
   margin-top: calc(15px + 2px);
 }
-:where(.bk-timeline) .bk-timeline-dot.bk-timeline-item-custom-icon::before {
+.bk-timeline .bk-timeline-dot.bk-timeline-item-custom-icon::before {
   display: none;
 }
-:where(.bk-timeline) .bk-timeline-dot.bk-timeline-item-custom-icon > .bk-timeline-section {
+.bk-timeline .bk-timeline-dot.bk-timeline-item-custom-icon > .bk-timeline-section {
   top: calc((15px + 1px) * -1);
 }
-:where(.bk-timeline) .bk-timeline-dot:first-child {
+.bk-timeline .bk-timeline-dot:first-child {
   margin-top: 0;
 }
-:where(.bk-timeline) .bk-timeline-custom::before {
+.bk-timeline .bk-timeline-custom::before {
   /* stylelint-disable-next-line declaration-no-important */
   border: none !important;
 }
-:where(.bk-timeline) .bk-timeline-custom .bk-timeline-icon {
+.bk-timeline .bk-timeline-custom .bk-timeline-icon {
   /* stylelint-disable-next-line declaration-no-important */
   border: none !important;
 }
-:where(.bk-timeline) .bk-timeline-primary {
+.bk-timeline .bk-timeline-primary {
   border-left: 1px solid #3a84ff;
 }
-:where(.bk-timeline) .bk-timeline-primary::before,
-:where(.bk-timeline) .bk-timeline-primary .bk-timeline-icon {
+.bk-timeline .bk-timeline-primary::before,
+.bk-timeline .bk-timeline-primary .bk-timeline-icon {
   color: #3a84ff;
   border: 2px solid #3a84ff;
 }
-:where(.bk-timeline) .bk-timeline-primary.bk-timeline-filled::before,
-:where(.bk-timeline) .bk-timeline-primary.bk-timeline-filled .bk-timeline-icon {
+.bk-timeline .bk-timeline-primary.bk-timeline-filled::before,
+.bk-timeline .bk-timeline-primary.bk-timeline-filled .bk-timeline-icon {
   background: #3a84ff;
 }
-:where(.bk-timeline) .bk-timeline-warning {
+.bk-timeline .bk-timeline-warning {
   border-left: 1px solid #ff9c01;
 }
-:where(.bk-timeline) .bk-timeline-warning::before,
-:where(.bk-timeline) .bk-timeline-warning .bk-timeline-icon {
+.bk-timeline .bk-timeline-warning::before,
+.bk-timeline .bk-timeline-warning .bk-timeline-icon {
   color: #ff9c01;
   border: 2px solid #ff9c01;
 }
-:where(.bk-timeline) .bk-timeline-warning.bk-timeline-filled::before,
-:where(.bk-timeline) .bk-timeline-warning.bk-timeline-filled .bk-timeline-icon {
+.bk-timeline .bk-timeline-warning.bk-timeline-filled::before,
+.bk-timeline .bk-timeline-warning.bk-timeline-filled .bk-timeline-icon {
   background: #ff9c01;
 }
-:where(.bk-timeline) .bk-timeline-success {
+.bk-timeline .bk-timeline-success {
   border-left: 1px solid #2dcb56;
 }
-:where(.bk-timeline) .bk-timeline-success::before,
-:where(.bk-timeline) .bk-timeline-success .bk-timeline-icon {
+.bk-timeline .bk-timeline-success::before,
+.bk-timeline .bk-timeline-success .bk-timeline-icon {
   color: #2dcb56;
   border: 2px solid #2dcb56;
 }
-:where(.bk-timeline) .bk-timeline-success.bk-timeline-filled::before,
-:where(.bk-timeline) .bk-timeline-success.bk-timeline-filled .bk-timeline-icon {
+.bk-timeline .bk-timeline-success.bk-timeline-filled::before,
+.bk-timeline .bk-timeline-success.bk-timeline-filled .bk-timeline-icon {
   background: #2dcb56;
 }
-:where(.bk-timeline) .bk-timeline-danger {
+.bk-timeline .bk-timeline-danger {
   border-left: 1px solid #ea3636;
 }
-:where(.bk-timeline) .bk-timeline-danger::before,
-:where(.bk-timeline) .bk-timeline-danger .bk-timeline-icon {
+.bk-timeline .bk-timeline-danger::before,
+.bk-timeline .bk-timeline-danger .bk-timeline-icon {
   color: #ea3636;
   border: 2px solid #ea3636;
 }
-:where(.bk-timeline) .bk-timeline-danger.bk-timeline-filled::before,
-:where(.bk-timeline) .bk-timeline-danger.bk-timeline-filled .bk-timeline-icon {
+.bk-timeline .bk-timeline-danger.bk-timeline-filled::before,
+.bk-timeline .bk-timeline-danger.bk-timeline-filled .bk-timeline-icon {
   background: #ea3636;
 }
-:where(.bk-timeline) .bk-timeline-blue::before,
-:where(.bk-timeline) .bk-timeline-blue .bk-timeline-icon {
+.bk-timeline .bk-timeline-blue::before,
+.bk-timeline .bk-timeline-blue .bk-timeline-icon {
   color: #3a84ff;
   border: 2px solid #3a84ff;
 }
-:where(.bk-timeline) .bk-timeline-blue.bk-timeline-filled::before,
-:where(.bk-timeline) .bk-timeline-blue.bk-timeline-filled .bk-timeline-icon {
+.bk-timeline .bk-timeline-blue.bk-timeline-filled::before,
+.bk-timeline .bk-timeline-blue.bk-timeline-filled .bk-timeline-icon {
   background: #3a84ff;
 }
-:where(.bk-timeline) .bk-timeline-red::before,
-:where(.bk-timeline) .bk-timeline-red .bk-timeline-icon {
+.bk-timeline .bk-timeline-red::before,
+.bk-timeline .bk-timeline-red .bk-timeline-icon {
   color: #ea3636;
   border: 2px solid #ea3636;
 }
-:where(.bk-timeline) .bk-timeline-red.bk-timeline-filled::before,
-:where(.bk-timeline) .bk-timeline-red.bk-timeline-filled .bk-timeline-icon {
+.bk-timeline .bk-timeline-red.bk-timeline-filled::before,
+.bk-timeline .bk-timeline-red.bk-timeline-filled .bk-timeline-icon {
   background: #ea3636;
 }
-:where(.bk-timeline) .bk-timeline-green::before,
-:where(.bk-timeline) .bk-timeline-green .bk-timeline-icon {
+.bk-timeline .bk-timeline-green::before,
+.bk-timeline .bk-timeline-green .bk-timeline-icon {
   color: #2dcb56;
   border: 2px solid #2dcb56;
 }
-:where(.bk-timeline) .bk-timeline-green.bk-timeline-filled::before,
-:where(.bk-timeline) .bk-timeline-green.bk-timeline-filled .bk-timeline-icon {
+.bk-timeline .bk-timeline-green.bk-timeline-filled::before,
+.bk-timeline .bk-timeline-green.bk-timeline-filled .bk-timeline-icon {
   background: #2dcb56;
 }
-:where(.bk-timeline) .bk-timeline-yellow::before,
-:where(.bk-timeline) .bk-timeline-yellow .bk-timeline-icon {
+.bk-timeline .bk-timeline-yellow::before,
+.bk-timeline .bk-timeline-yellow .bk-timeline-icon {
   color: #ff9c01;
   border: 2px solid #ff9c01;
 }
-:where(.bk-timeline) .bk-timeline-yellow.bk-timeline-filled::before,
-:where(.bk-timeline) .bk-timeline-yellow.bk-timeline-filled .bk-timeline-icon {
+.bk-timeline .bk-timeline-yellow.bk-timeline-filled::before,
+.bk-timeline .bk-timeline-yellow.bk-timeline-filled .bk-timeline-icon {
   background: #ff9c01;
 }
-:where(.bk-timeline) .bk-timeline-gray::before,
-:where(.bk-timeline) .bk-timeline-gray .bk-timeline-icon {
+.bk-timeline .bk-timeline-gray::before,
+.bk-timeline .bk-timeline-gray .bk-timeline-icon {
   color: #63656e;
   border: 2px solid #63656e;
 }
-:where(.bk-timeline) .bk-timeline-gray.bk-timeline-filled::before,
-:where(.bk-timeline) .bk-timeline-gray.bk-timeline-filled .bk-timeline-icon {
+.bk-timeline .bk-timeline-gray.bk-timeline-filled::before,
+.bk-timeline .bk-timeline-gray.bk-timeline-filled .bk-timeline-icon {
   background: #63656e;
 }
-:where(.bk-timeline) .bk-timeline-dashed .bk-step .bk-step-title::after,
-:where(.bk-timeline) .bk-timeline-dashed .bk-step .bk-step-indicator::after {
+.bk-timeline-dashed .bk-step .bk-step-title::after,
+.bk-timeline-dashed .bk-step .bk-step-indicator::after {
   background-image: linear-gradient(to right, #c4c6cc 50%, transparent 0%);
   background-position: bottom;
   background-repeat: repeat-x;
   background-size: 6px 1px;
 }
-:where(.bk-timeline) .bk-timeline-solid .bk-step .bk-step-title::after,
-:where(.bk-timeline) .bk-timeline-solid .bk-step .bk-step-indicator::after {
+.bk-timeline-solid .bk-step .bk-step-title::after,
+.bk-timeline-solid .bk-step .bk-step-indicator::after {
   background-color: #c4c6cc;
 }
-:where(.bk-timeline) .bk-timeline-vertical {
+.bk-timeline-vertical {
   height: 100%;
   flex-direction: column;
 }
-:where(.bk-timeline) .bk-timeline-vertical .bk-step {
+.bk-timeline-vertical .bk-step {
   margin-right: 0;
   margin-bottom: 8px;
 }
-:where(.bk-timeline) .bk-timeline-vertical .bk-step .bk-step-title::after,
-:where(.bk-timeline) .bk-timeline-vertical .bk-step .bk-step-indicator::after {
+.bk-timeline-vertical .bk-step .bk-step-title::after,
+.bk-timeline-vertical .bk-step .bk-step-indicator::after {
   display: none;
 }
-:where(.bk-timeline) .bk-timeline-vertical .bk-step::after {
+.bk-timeline-vertical .bk-step::after {
   position: absolute;
   top: 32px;
   left: 12px;
@@ -233,7 +233,7 @@
   background-size: 1px 6px;
   content: '';
 }
-:where(.bk-timeline) .bk-timeline-vertical .bk-step .bk-step-title {
+.bk-timeline-vertical .bk-step .bk-step-title {
   display: flex;
   height: 100%;
   margin-top: 0;