vxe-pc-ui 3.13.11 → 3.13.13

package/styles/components/date-panel.scss

@@ -1,505 +1,505 @@
-@use "sass:list";
-
-.vxe-date-panel {
-  color: var(--vxe-ui-font-color);
-  flex-shrink: 0;
-}
-
-.vxe-date-panel--wrapper,
-.vxe-date-panel--time-layout-wrapper {
-  border: 0 solid var(--vxe-ui-base-popup-border-color);
-  border-radius: var(--vxe-ui-base-border-radius);
-}
-
-.vxe-date-panel--wrapper,
-.vxe-date-panel--time-left-wrapper {
-  display: inline-flex;
-  flex-direction: column;
-  padding: 0.8em;
-}
-.vxe-date-panel--time-right-wrapper {
-  padding: 0.8em 0.8em 0.8em 0;
-}
-
-.vxe-date-panel--time-layout-wrapper {
-  display: inline-flex;
-  flex-direction: row;
-}
-
-.vxe-date-panel--time-title {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-grow: 1;
-  text-align: center;
-  border: 1px solid var(--vxe-ui-input-border-color);
-  border-radius: var(--vxe-ui-base-border-radius);
-  height: 2em;
-  font-weight: 700;
-}
-
-.vxe-date-panel--time-header {
-  position: relative;
-  flex-shrink: 0;
-}
-
-.vxe-date-panel--time-header,
-.vxe-date-panel--picker-header {
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  height: 3em;
-  padding-bottom: 0.5em;
-}
-
-.vxe-date-panel--picker-header {
-  user-select: none;
-  .vxe-date-panel--picker-type-wrapper {
-    flex-grow: 1;
-    font-size: 1.1em;
-  }
-  .vxe-date-panel--picker-btn-wrapper {
-    flex-shrink: 0;
-    text-align: center;
-  }
-}
-.vxe-date-panel--picker-type-wrapper {
-  display: flex;
-  align-items: center;
-  .vxe-date-panel--picker-label,
-  .vxe-date-panel--picker-btn {
-    display: inline-block;
-  }
-}
-.vxe-date-panel--picker-btn-wrapper {
-  display: flex;
-  flex-direction: row;
-  .vxe-date-panel--picker-prev-btn,
-  .vxe-date-panel--picker-current-btn,
-  .vxe-date-panel--picker-next-btn {
-    height: 2.2em;
-    padding: 0 0.5em;
-    border-radius: var(--vxe-ui-base-border-radius);
-    border: 1px solid var(--vxe-ui-input-border-color);
-    margin-left: 0.5em;
-    i {
-      font-size: 1.2em;
-    }
-  }
-  .vxe-date-panel--picker-btn {
-    &:not(.is--disabled) {
-      &:active {
-        transform: scale(0.9);
-      }
-    }
-  }
-}
-.vxe-date-panel--picker-label,
-.vxe-date-panel--picker-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background-color: var(--vxe-ui-layout-background-color);
-}
-.vxe-date-panel--picker-btn {
-  &.is--disabled {
-    color: var(--vxe-ui-font-disabled-color);
-    cursor: no-drop;
-  }
-  &:not(.is--disabled) {
-    cursor: pointer;
-    &:hover {
-      color: var(--vxe-ui-font-primary-color);
-      background-color: #fff;
-    }
-    &:active {
-      background-color: #fff;
-    }
-  }
-}
-.vxe-date-panel--picker-btns {
-  .vxe-date-panel--picker-btn {
-    margin-left: 0.6em;
-    &:first-child {
-      margin-left: 0;
-    }
-  }
-}
-
-.vxe-date-panel--view-wrapper {
-  display: flex;
-  flex-direction: column; 
-  line-height: 1.5;
-}
-.vxe-date-panel--picker-body {
-  border-radius: var(--vxe-ui-base-border-radius);
-  border: 1px solid var(--vxe-ui-base-popup-border-color);
-  user-select: none;
-}
-.vxe-date-panel--view-header {
-  box-shadow: inset 0 -1px 0 0 var(--vxe-ui-base-popup-border-color);
-  text-align: center;
-}
-.vxe-date-panel--view-body {
-  display: inline-flex;
-  flex-direction: column;
-  width: 24em;
-}
-.vxe-date-panel--view-wrapper {
-  &.type--day,
-  &.type--week {
-    .vxe-date-panel--view-body {
-      height: 18em;
-    }
-  }
-}
-.vxe-date-panel--view-header {
-  .vxe-date-panel--view-row {
-    height: 2em;
-  }
-}
-.vxe-date-panel--view-body,
-.vxe-date-panel--time-body {
-  height: 20em;
-}
-.vxe-date-panel {
-  &.type--time {
-    .vxe-date-panel--time-body {
-      height: 15em;
-    }
-  }
-}
-
-.vxe-date-panel--view-body {
-  .vxe-date-panel--view-item {
-    cursor: pointer;
-    &.is--range-disabled,
-    &.is--disabled {
-      cursor: no-drop;
-    }
-    &.is--over {
-      cursor: no-drop;
-    }
-  }
-}
-.vxe-date-panel--view-row {
-  display: flex;
-  flex-direction: row;
-}
-.vxe-date-panel--view-item {
-  padding: 0.2em;
-  &.is--prev,
-  &.is--next {
-    .vxe-date-panel--view-item-inner {
-      color: var(--vxe-ui-font-disabled-color);
-    }
-    .vxe-date-panel--label,
-    .vxe-date-panel--festival {
-      color: var(--vxe-ui-font-disabled-color);
-    }
-  }
-  &.is--now {
-    .vxe-date-panel--view-item-inner {
-      color: var(--vxe-ui-base-popup-border-color);
-    }
-    &:not(.is--selected) {
-      &.is--current {
-        color: var(--vxe-ui-font-primary-color);
-        .vxe-date-panel--label,
-        .vxe-date-panel--festival {
-          color: var(--vxe-ui-font-primary-color);
-        }
-      }
-    }
-  }
-  &.is--hover {
-    .vxe-date-panel--view-item-inner {
-      background-color: var(--vxe-ui-font-primary-tinge-color);
-    }
-  }
-  &.is--selected {
-    .vxe-date-panel--view-item-inner {
-      color: var(--vxe-ui-input-date-picker-selected-color);
-      background-color: var(--vxe-ui-font-primary-color);
-    }
-    &.is--hover {
-      .vxe-date-panel--view-item-inner {
-        box-shadow: 0 0px 6px 1px var(--vxe-ui-font-primary-color);
-      }
-    }
-    &.is--prev,
-    &.is--next {
-      .vxe-date-panel--label,
-      .vxe-date-panel--festival {
-        color: var(--vxe-ui-base-popup-border-color);
-      }
-    }
-    .vxe-date-panel--label,
-    .vxe-date-panel--festival {
-      color: var(--vxe-ui-input-date-picker-festival-selected-color);
-    }
-    .vxe-date-panel--label {
-      &.is-notice {
-        &:before {
-          background-color: var(--vxe-ui-input-date-picker-notice-selected-background-color);
-        }
-      }
-    }
-  }
-  &.is--range-disabled {
-    .vxe-date-panel--view-item-inner {
-      color: var(--vxe-ui-input-disabled-color);
-      background-color: inherit;
-    }
-  }
-  &.is--disabled {
-    .vxe-date-panel--view-item-inner {
-      color: var(--vxe-ui-input-disabled-color);
-      background-color: var(--vxe-ui-input-disabled-background-color);
-    }
-    .vxe-date-panel--label,
-    .vxe-date-panel--festival {
-      color: var(--vxe-ui-input-disabled-color);
-    }
-  }
-}
-
-// .vxe-date-range-picker--panel {
-//   .vxe-date-panel--view-item {
-//     &.is--range-disabled {
-//       .vxe-date-panel--view-item-inner {
-//         color: var(--vxe-ui-input-disabled-color);
-//         background-color: inherit;
-//       }
-//     }
-//   }
-// }
-
-.vxe-date-panel--view-wrapper {
-  &.type--week {
-    .vxe-date-panel--view-item {
-      padding: 0.2em 0;
-      .vxe-date-panel--view-item-inner {
-        border-radius: 0;
-      }
-      &:first-child {
-        padding: 0.2em 0 0.2em 0.2em;
-        border-right: 1px solid var(--vxe-ui-base-popup-border-color);
-        .vxe-date-panel--view-item-inner {
-          color: var(--vxe-ui-input-date-festival-color);
-        }
-      }
-      &:last-child {
-        padding: 0.2em 0.2em 0.2em 0;
-      }
-      &.is--hover,
-      &.is--selected {
-        &:first-child {
-          .vxe-date-panel--view-item-inner {
-            border-radius: var(--vxe-ui-base-border-radius) 0 0 var(--vxe-ui-base-border-radius);
-          }
-        }
-        &:last-child {
-          .vxe-date-panel--view-item-inner {
-            border-radius: 0 var(--vxe-ui-base-border-radius) var(--vxe-ui-base-border-radius) 0;
-          }
-        }
-      }
-      &.is--now {
-        &:not(.is--selected) {
-          &:first-child {
-            .vxe-date-panel--view-item-inner {
-              color: var(--vxe-ui-font-primary-color);
-            }
-          }
-        }
-      }
-    }
-  }
-}
-.vxe-date-panel--view-item-inner {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  height: 100%;
-  width: 100%;
-  border: 1px solid transparent;
-  border-radius: var(--vxe-ui-base-border-radius);
-  overflow: hidden;
-}
-.vxe-date-panel--view-item-label {
-  width: 100%;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.vxe-date-panel--label,
-.vxe-date-panel--festival {
-  width: 100%;
-  display: block;
-  overflow: hidden;
-  text-align: center;
-}
-
-.vxe-date-panel--label {
-  position: relative;
-  height: 1.4em;
-  line-height: 1.4em;
-  &.is-notice {
-    &:before {
-      content: "";
-      position: absolute;
-      width: 0.25em;
-      height: 0.25em;
-      left: 50%;
-      top: 0;
-      transform: translateX(-50%);
-      border-radius: 100%;
-      background-color: var(--vxe-ui-input-date-notice-background-color);
-    }
-  }
-}
-.vxe-date-panel--label--extra {
-  position: absolute;
-  right: -0.1em;
-  top: -0.4em;
-  font-size: 12px;
-  transform: scale(0.9);
-  color: var(--vxe-ui-input-date-extra-color);
-  &.is-important {
-    color: var(--vxe-ui-input-date-extra-important-color);
-  }
-}
-
-.vxe-date-panel--festival {
-  color: var(--vxe-ui-input-date-festival-color);
-  height: 1em;
-  line-height: 1em;
-  overflow: hidden;
-  &.is-important {
-    color: var(--vxe-ui-input-date-festival-important-color);
-  }
-}
-.vxe-date-panel--festival--label {
-  display: block;
-  font-size: 1em;
-  transform: scale(0.8);
-}
-
-@keyframes festivalOverlap2 {
-  0%, 45%, 100% {
-    transform: translateY(0);
-  }
-  50%, 95% {
-    transform: translateY(-14px);
-  }
-}
-
-@keyframes festivalOverlap3 {
-  0%, 20%, 100% {
-    transform: translateY(0);
-  }
-  25%, 45%, 75%, 95% {
-    transform: translateY(-14px);
-  }
-  50%, 70% {
-    transform: translateY(-28px);
-  }
-}
-
-.vxe-date-panel--festival--overlap {
-  display: block;
-  font-size: 0.86em;
-  &.overlap--2 {
-    animation: festivalOverlap2 6s infinite ease-in-out;
-  }
-  &.overlap--3 {
-    animation: festivalOverlap3 9s infinite ease-in-out;
-  }
-  & > span {
-    height: 14px;
-    display: block;
-    transform: scale(0.8);
-  }
-}
-
-.vxe-date-panel--time-body {
-  position: relative;
-  display: flex;
-  flex-direction: row;
-  border: 1px solid var(--vxe-ui-base-popup-border-color);
-  flex-grow: 1;
-  border-radius: var(--vxe-ui-base-border-radius);
-  user-select: none;
-  & > ul {
-    height: 100%;
-    overflow: hidden;
-    margin: 0;
-    padding: 0;
-    width: 3.2em;
-    &:before,
-    &:after {
-      content: " ";
-      display: block;
-      height: 6em;
-    }
-    &:hover {
-      overflow-y: auto;
-    }
-    & > li {
-      display: block;
-      height: 2em;
-      line-height: 2em;
-      padding-left: 0.4em;
-      &:not(.is--disabled) {
-        &:hover {
-          background-color: var(--vxe-ui-input-date-picker-hover-background-color);
-          cursor: pointer;
-        }
-      }
-      &.is--selected {
-        font-weight: 700;
-        color: var(--vxe-ui-font-primary-color);
-      }
-      &.is--disabled {
-        color: var(--vxe-ui-font-disabled-color);
-        cursor: no-drop;
-      }
-    }
-  }
-  .vxe-date-panel--time-minute-list {
-    border-left: 1px solid var(--vxe-ui-base-popup-border-color);
-  }
-  .vxe-date-panel--time-second-list {
-    border-left: 1px solid var(--vxe-ui-base-popup-border-color);
-  }
-}
-.vxe-date-panel {
-  &.type--time {
-    .vxe-date-panel--time-body {
-      & > ul {
-        width: 4em;
-        & > li {
-          height: 2.2em;
-          line-height: 2.2em;
-          padding-left: 0.8em;
-        }
-      }
-    }
-  }
-}
-
-.vxe-date-panel {
-  font-size: var(--vxe-ui-font-size-default);
-  &.size--medium {
-    font-size: var(--vxe-ui-font-size-medium);
-  }
-  &.size--small {
-    font-size: var(--vxe-ui-font-size-small);
-  }
-  &.size--mini {
-    font-size: var(--vxe-ui-font-size-mini);
-  }
-}
+@use "sass:list";
+
+.vxe-date-panel {
+  color: var(--vxe-ui-font-color);
+  flex-shrink: 0;
+}
+
+.vxe-date-panel--wrapper,
+.vxe-date-panel--time-layout-wrapper {
+  border: 0 solid var(--vxe-ui-base-popup-border-color);
+  border-radius: var(--vxe-ui-base-border-radius);
+}
+
+.vxe-date-panel--wrapper,
+.vxe-date-panel--time-left-wrapper {
+  display: inline-flex;
+  flex-direction: column;
+  padding: 0.8em;
+}
+.vxe-date-panel--time-right-wrapper {
+  padding: 0.8em 0.8em 0.8em 0;
+}
+
+.vxe-date-panel--time-layout-wrapper {
+  display: inline-flex;
+  flex-direction: row;
+}
+
+.vxe-date-panel--time-title {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-grow: 1;
+  text-align: center;
+  border: 1px solid var(--vxe-ui-input-border-color);
+  border-radius: var(--vxe-ui-base-border-radius);
+  height: 2em;
+  font-weight: 700;
+}
+
+.vxe-date-panel--time-header {
+  position: relative;
+  flex-shrink: 0;
+}
+
+.vxe-date-panel--time-header,
+.vxe-date-panel--picker-header {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  height: 3em;
+  padding-bottom: 0.5em;
+}
+
+.vxe-date-panel--picker-header {
+  user-select: none;
+  .vxe-date-panel--picker-type-wrapper {
+    flex-grow: 1;
+    font-size: 1.1em;
+  }
+  .vxe-date-panel--picker-btn-wrapper {
+    flex-shrink: 0;
+    text-align: center;
+  }
+}
+.vxe-date-panel--picker-type-wrapper {
+  display: flex;
+  align-items: center;
+  .vxe-date-panel--picker-label,
+  .vxe-date-panel--picker-btn {
+    display: inline-block;
+  }
+}
+.vxe-date-panel--picker-btn-wrapper {
+  display: flex;
+  flex-direction: row;
+  .vxe-date-panel--picker-prev-btn,
+  .vxe-date-panel--picker-current-btn,
+  .vxe-date-panel--picker-next-btn {
+    height: 2.2em;
+    padding: 0 0.5em;
+    border-radius: var(--vxe-ui-base-border-radius);
+    border: 1px solid var(--vxe-ui-input-border-color);
+    margin-left: 0.5em;
+    i {
+      font-size: 1.2em;
+    }
+  }
+  .vxe-date-panel--picker-btn {
+    &:not(.is--disabled) {
+      &:active {
+        transform: scale(0.9);
+      }
+    }
+  }
+}
+.vxe-date-panel--picker-label,
+.vxe-date-panel--picker-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: var(--vxe-ui-layout-background-color);
+}
+.vxe-date-panel--picker-btn {
+  &.is--disabled {
+    color: var(--vxe-ui-font-disabled-color);
+    cursor: no-drop;
+  }
+  &:not(.is--disabled) {
+    cursor: pointer;
+    &:hover {
+      color: var(--vxe-ui-font-primary-color);
+      background-color: #fff;
+    }
+    &:active {
+      background-color: #fff;
+    }
+  }
+}
+.vxe-date-panel--picker-btns {
+  .vxe-date-panel--picker-btn {
+    margin-left: 0.6em;
+    &:first-child {
+      margin-left: 0;
+    }
+  }
+}
+
+.vxe-date-panel--view-wrapper {
+  display: flex;
+  flex-direction: column; 
+  line-height: 1.5;
+}
+.vxe-date-panel--picker-body {
+  border-radius: var(--vxe-ui-base-border-radius);
+  border: 1px solid var(--vxe-ui-base-popup-border-color);
+  user-select: none;
+}
+.vxe-date-panel--view-header {
+  box-shadow: inset 0 -1px 0 0 var(--vxe-ui-base-popup-border-color);
+  text-align: center;
+}
+.vxe-date-panel--view-body {
+  display: inline-flex;
+  flex-direction: column;
+  width: 24em;
+}
+.vxe-date-panel--view-wrapper {
+  &.type--day,
+  &.type--week {
+    .vxe-date-panel--view-body {
+      height: 18em;
+    }
+  }
+}
+.vxe-date-panel--view-header {
+  .vxe-date-panel--view-row {
+    height: 2em;
+  }
+}
+.vxe-date-panel--view-body,
+.vxe-date-panel--time-body {
+  height: 20em;
+}
+.vxe-date-panel {
+  &.type--time {
+    .vxe-date-panel--time-body {
+      height: 15em;
+    }
+  }
+}
+
+.vxe-date-panel--view-body {
+  .vxe-date-panel--view-item {
+    cursor: pointer;
+    &.is--range-disabled,
+    &.is--disabled {
+      cursor: no-drop;
+    }
+    &.is--over {
+      cursor: no-drop;
+    }
+  }
+}
+.vxe-date-panel--view-row {
+  display: flex;
+  flex-direction: row;
+}
+.vxe-date-panel--view-item {
+  padding: 0.2em;
+  &.is--prev,
+  &.is--next {
+    .vxe-date-panel--view-item-inner {
+      color: var(--vxe-ui-font-disabled-color);
+    }
+    .vxe-date-panel--label,
+    .vxe-date-panel--festival {
+      color: var(--vxe-ui-font-disabled-color);
+    }
+  }
+  &.is--now {
+    .vxe-date-panel--view-item-inner {
+      color: var(--vxe-ui-base-popup-border-color);
+    }
+    &:not(.is--selected) {
+      &.is--current {
+        color: var(--vxe-ui-font-primary-color);
+        .vxe-date-panel--label,
+        .vxe-date-panel--festival {
+          color: var(--vxe-ui-font-primary-color);
+        }
+      }
+    }
+  }
+  &.is--hover {
+    .vxe-date-panel--view-item-inner {
+      background-color: var(--vxe-ui-font-primary-tinge-color);
+    }
+  }
+  &.is--selected {
+    .vxe-date-panel--view-item-inner {
+      color: var(--vxe-ui-input-date-picker-selected-color);
+      background-color: var(--vxe-ui-font-primary-color);
+    }
+    &.is--hover {
+      .vxe-date-panel--view-item-inner {
+        box-shadow: 0 0px 6px 1px var(--vxe-ui-font-primary-color);
+      }
+    }
+    &.is--prev,
+    &.is--next {
+      .vxe-date-panel--label,
+      .vxe-date-panel--festival {
+        color: var(--vxe-ui-base-popup-border-color);
+      }
+    }
+    .vxe-date-panel--label,
+    .vxe-date-panel--festival {
+      color: var(--vxe-ui-input-date-picker-festival-selected-color);
+    }
+    .vxe-date-panel--label {
+      &.is-notice {
+        &:before {
+          background-color: var(--vxe-ui-input-date-picker-notice-selected-background-color);
+        }
+      }
+    }
+  }
+  &.is--range-disabled {
+    .vxe-date-panel--view-item-inner {
+      color: var(--vxe-ui-input-disabled-color);
+      background-color: inherit;
+    }
+  }
+  &.is--disabled {
+    .vxe-date-panel--view-item-inner {
+      color: var(--vxe-ui-input-disabled-color);
+      background-color: var(--vxe-ui-input-disabled-background-color);
+    }
+    .vxe-date-panel--label,
+    .vxe-date-panel--festival {
+      color: var(--vxe-ui-input-disabled-color);
+    }
+  }
+}
+
+// .vxe-date-range-picker--panel {
+//   .vxe-date-panel--view-item {
+//     &.is--range-disabled {
+//       .vxe-date-panel--view-item-inner {
+//         color: var(--vxe-ui-input-disabled-color);
+//         background-color: inherit;
+//       }
+//     }
+//   }
+// }
+
+.vxe-date-panel--view-wrapper {
+  &.type--week {
+    .vxe-date-panel--view-item {
+      padding: 0.2em 0;
+      .vxe-date-panel--view-item-inner {
+        border-radius: 0;
+      }
+      &:first-child {
+        padding: 0.2em 0 0.2em 0.2em;
+        border-right: 1px solid var(--vxe-ui-base-popup-border-color);
+        .vxe-date-panel--view-item-inner {
+          color: var(--vxe-ui-input-date-festival-color);
+        }
+      }
+      &:last-child {
+        padding: 0.2em 0.2em 0.2em 0;
+      }
+      &.is--hover,
+      &.is--selected {
+        &:first-child {
+          .vxe-date-panel--view-item-inner {
+            border-radius: var(--vxe-ui-base-border-radius) 0 0 var(--vxe-ui-base-border-radius);
+          }
+        }
+        &:last-child {
+          .vxe-date-panel--view-item-inner {
+            border-radius: 0 var(--vxe-ui-base-border-radius) var(--vxe-ui-base-border-radius) 0;
+          }
+        }
+      }
+      &.is--now {
+        &:not(.is--selected) {
+          &:first-child {
+            .vxe-date-panel--view-item-inner {
+              color: var(--vxe-ui-font-primary-color);
+            }
+          }
+        }
+      }
+    }
+  }
+}
+.vxe-date-panel--view-item-inner {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: 100%;
+  border: 1px solid transparent;
+  border-radius: var(--vxe-ui-base-border-radius);
+  overflow: hidden;
+}
+.vxe-date-panel--view-item-label {
+  width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.vxe-date-panel--label,
+.vxe-date-panel--festival {
+  width: 100%;
+  display: block;
+  overflow: hidden;
+  text-align: center;
+}
+
+.vxe-date-panel--label {
+  position: relative;
+  height: 1.4em;
+  line-height: 1.4em;
+  &.is-notice {
+    &:before {
+      content: "";
+      position: absolute;
+      width: 0.25em;
+      height: 0.25em;
+      left: 50%;
+      top: 0;
+      transform: translateX(-50%);
+      border-radius: 100%;
+      background-color: var(--vxe-ui-input-date-notice-background-color);
+    }
+  }
+}
+.vxe-date-panel--label--extra {
+  position: absolute;
+  right: -0.1em;
+  top: -0.4em;
+  font-size: 12px;
+  transform: scale(0.9);
+  color: var(--vxe-ui-input-date-extra-color);
+  &.is-important {
+    color: var(--vxe-ui-input-date-extra-important-color);
+  }
+}
+
+.vxe-date-panel--festival {
+  color: var(--vxe-ui-input-date-festival-color);
+  height: 1em;
+  line-height: 1em;
+  overflow: hidden;
+  &.is-important {
+    color: var(--vxe-ui-input-date-festival-important-color);
+  }
+}
+.vxe-date-panel--festival--label {
+  display: block;
+  font-size: 1em;
+  transform: scale(0.8);
+}
+
+@keyframes festivalOverlap2 {
+  0%, 45%, 100% {
+    transform: translateY(0);
+  }
+  50%, 95% {
+    transform: translateY(-14px);
+  }
+}
+
+@keyframes festivalOverlap3 {
+  0%, 20%, 100% {
+    transform: translateY(0);
+  }
+  25%, 45%, 75%, 95% {
+    transform: translateY(-14px);
+  }
+  50%, 70% {
+    transform: translateY(-28px);
+  }
+}
+
+.vxe-date-panel--festival--overlap {
+  display: block;
+  font-size: 0.86em;
+  &.overlap--2 {
+    animation: festivalOverlap2 6s infinite ease-in-out;
+  }
+  &.overlap--3 {
+    animation: festivalOverlap3 9s infinite ease-in-out;
+  }
+  & > span {
+    height: 14px;
+    display: block;
+    transform: scale(0.8);
+  }
+}
+
+.vxe-date-panel--time-body {
+  position: relative;
+  display: flex;
+  flex-direction: row;
+  border: 1px solid var(--vxe-ui-base-popup-border-color);
+  flex-grow: 1;
+  border-radius: var(--vxe-ui-base-border-radius);
+  user-select: none;
+  & > ul {
+    height: 100%;
+    overflow: hidden;
+    margin: 0;
+    padding: 0;
+    width: 3.2em;
+    &:before,
+    &:after {
+      content: " ";
+      display: block;
+      height: 6em;
+    }
+    &:hover {
+      overflow-y: auto;
+    }
+    & > li {
+      display: block;
+      height: 2em;
+      line-height: 2em;
+      padding-left: 0.4em;
+      &:not(.is--disabled) {
+        &:hover {
+          background-color: var(--vxe-ui-input-date-picker-hover-background-color);
+          cursor: pointer;
+        }
+      }
+      &.is--selected {
+        font-weight: 700;
+        color: var(--vxe-ui-font-primary-color);
+      }
+      &.is--disabled {
+        color: var(--vxe-ui-font-disabled-color);
+        cursor: no-drop;
+      }
+    }
+  }
+  .vxe-date-panel--time-minute-list {
+    border-left: 1px solid var(--vxe-ui-base-popup-border-color);
+  }
+  .vxe-date-panel--time-second-list {
+    border-left: 1px solid var(--vxe-ui-base-popup-border-color);
+  }
+}
+.vxe-date-panel {
+  &.type--time {
+    .vxe-date-panel--time-body {
+      & > ul {
+        width: 4em;
+        & > li {
+          height: 2.2em;
+          line-height: 2.2em;
+          padding-left: 0.8em;
+        }
+      }
+    }
+  }
+}
+
+.vxe-date-panel {
+  font-size: var(--vxe-ui-font-size-default);
+  &.size--medium {
+    font-size: var(--vxe-ui-font-size-medium);
+  }
+  &.size--small {
+    font-size: var(--vxe-ui-font-size-small);
+  }
+  &.size--mini {
+    font-size: var(--vxe-ui-font-size-mini);
+  }
+}