@dialpad/dialtone 9.67.1 → 9.69.0

package/dist/css/dialtone.css

@@ -329,6 +329,215 @@ template {
   box-shadow: var(--dt-shadow-focus);
 }
 /* stylelint-disable meowtec/no-px */
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.18s ease-in-out;
+}
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0 !important;
+}
+.fade-enter-to,
+.fade-leave-from {
+  opacity: 1 !important;
+}
+.slide-down-enter-active {
+  transition: -webkit-transform 0.28s ease-out;
+  transition: transform 0.28s ease-out;
+  transition: transform 0.28s ease-out, -webkit-transform 0.28s ease-out;
+}
+.slide-down-leave-active {
+  transition: -webkit-transform 0.28s ease-in;
+  transition: transform 0.28s ease-in;
+  transition: transform 0.28s ease-in, -webkit-transform 0.28s ease-in;
+}
+.slide-down-enter-from {
+  -webkit-transform: translateY(-100%);
+          transform: translateY(-100%);
+}
+.slide-down-leave-to {
+  -webkit-transform: translateY(100%);
+          transform: translateY(100%);
+}
+.pop-enter-active {
+  -webkit-animation: pop 0.5s;
+          animation: pop 0.5s;
+}
+.pop-leave-active {
+  animation: pop 0.5s reverse;
+}
+@-webkit-keyframes pop {
+  50% {
+    -webkit-transform: scale(1.2);
+            transform: scale(1.2);
+  }
+}
+@keyframes pop {
+  50% {
+    -webkit-transform: scale(1.2);
+            transform: scale(1.2);
+  }
+}
+.shake-enter-active {
+  -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+  -webkit-animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
+          animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
+}
+@-webkit-keyframes shake {
+  10%,
+  90% {
+    -webkit-transform: translate3d(var(--dt-size-300-negative), 0, 0);
+            transform: translate3d(var(--dt-size-300-negative), 0, 0);
+  }
+  20%,
+  80% {
+    -webkit-transform: translate3d(var(--dt-size-400), 0, 0);
+            transform: translate3d(var(--dt-size-400), 0, 0);
+  }
+  30%,
+  50%,
+  70% {
+    -webkit-transform: translate3d(var(--dt-size-500-negative), 0, 0);
+            transform: translate3d(var(--dt-size-500-negative), 0, 0);
+  }
+  40%,
+  60% {
+    -webkit-transform: translate3d(var(--dt-size-500), 0, 0);
+            transform: translate3d(var(--dt-size-500), 0, 0);
+  }
+}
+@keyframes shake {
+  10%,
+  90% {
+    -webkit-transform: translate3d(var(--dt-size-300-negative), 0, 0);
+            transform: translate3d(var(--dt-size-300-negative), 0, 0);
+  }
+  20%,
+  80% {
+    -webkit-transform: translate3d(var(--dt-size-400), 0, 0);
+            transform: translate3d(var(--dt-size-400), 0, 0);
+  }
+  30%,
+  50%,
+  70% {
+    -webkit-transform: translate3d(var(--dt-size-500-negative), 0, 0);
+            transform: translate3d(var(--dt-size-500-negative), 0, 0);
+  }
+  40%,
+  60% {
+    -webkit-transform: translate3d(var(--dt-size-500), 0, 0);
+            transform: translate3d(var(--dt-size-500), 0, 0);
+  }
+}
+@-webkit-keyframes fade-in {
+  0% {
+    opacity: 0;
+  }
+  50% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@keyframes fade-in {
+  0% {
+    opacity: 0;
+  }
+  50% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+@-webkit-keyframes fade-out {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+@keyframes fade-out {
+  0% {
+    opacity: 1;
+  }
+  50% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+.fade-in {
+  -webkit-animation: fade-in 0.18s ease-in-out;
+          animation: fade-in 0.18s ease-in-out;
+}
+.fade-out {
+  -webkit-animation: fade-out 0.18s ease-in-out;
+          animation: fade-out 0.18s ease-in-out;
+}
+.d-zoom-enter-from,
+.d-zoom-leave-to {
+  z-index: var(--zi-hide) !important;
+  -webkit-backface-visibility: hidden !important;
+          backface-visibility: hidden !important;
+  visibility: hidden !important;
+  opacity: 0 !important;
+}
+.d-zoom__dialog-enter-from,
+.d-zoom__dialog-leave-to {
+  z-index: var(--zi-hide) !important;
+  -webkit-backface-visibility: hidden !important;
+          backface-visibility: hidden !important;
+  visibility: hidden !important;
+  opacity: 0 !important;
+  -webkit-transform: translate3d(0, 30%, 0) scale3d(0.75, 0.75, 0.75) !important;
+          transform: translate3d(0, 30%, 0) scale3d(0.75, 0.75, 0.75) !important;
+}
+.d-zoom-enter-active,
+.d-zoom__dialog-enter-active {
+  transition: opacity 100ms var(--ttf-in-out) 10ms, z-index 0s 0s, visibility 0s 0s, -webkit-transform 100ms var(--ttf-in-out) 10ms;
+  transition: opacity 100ms var(--ttf-in-out) 10ms, z-index 0s 0s, visibility 0s 0s, transform 100ms var(--ttf-in-out) 10ms;
+  transition: opacity 100ms var(--ttf-in-out) 10ms, z-index 0s 0s, visibility 0s 0s, transform 100ms var(--ttf-in-out) 10ms, -webkit-transform 100ms var(--ttf-in-out) 10ms;
+}
+@media (prefers-reduced-motion) {
+  .d-zoom-enter-active,
+  .d-zoom__dialog-enter-active {
+    transition: none !important;
+  }
+}
+.d-zoom-leave-active {
+  transition: opacity 100ms var(--ttf-in-out) 10ms, z-index 0s 200ms, visibility 0s 200ms, -webkit-transform 100ms var(--ttf-in-out) 10ms;
+  transition: opacity 100ms var(--ttf-in-out) 10ms, z-index 0s 200ms, visibility 0s 200ms, transform 100ms var(--ttf-in-out) 10ms;
+  transition: opacity 100ms var(--ttf-in-out) 10ms, z-index 0s 200ms, visibility 0s 200ms, transform 100ms var(--ttf-in-out) 10ms, -webkit-transform 100ms var(--ttf-in-out) 10ms;
+}
+.d-zoom-leave-active.d-modal--full {
+  transition: opacity 200ms var(--ttf-in-out) 0s, z-index 0s 200ms, visibility 0s 200ms;
+}
+@media (prefers-reduced-motion) {
+  .d-zoom-leave-active {
+    transition: none !important;
+  }
+}
+.d-zoom__dialog-leave-active {
+  transition: opacity 200ms var(--ttf-in-out) 0s, z-index 0s 200ms, visibility 0s 200ms, -webkit-transform 100ms var(--ttf-in-out) 0s;
+  transition: opacity 200ms var(--ttf-in-out) 0s, z-index 0s 200ms, visibility 0s 200ms, transform 100ms var(--ttf-in-out) 0s;
+  transition: opacity 200ms var(--ttf-in-out) 0s, z-index 0s 200ms, visibility 0s 200ms, transform 100ms var(--ttf-in-out) 0s, -webkit-transform 100ms var(--ttf-in-out) 0s;
+}
+.d-zoom__dialog-leave-active.d-modal--full {
+  transition: opacity 200ms var(--ttf-in-out) 0s, z-index 0s 200ms, visibility 0s 200ms;
+}
+@media (prefers-reduced-motion) {
+  .d-zoom__dialog-leave-active {
+    transition: none !important;
+  }
+}
 .d-root-layout {
   position: relative;
   display: grid;
@@ -4467,28 +4676,34 @@ legend .d-label {
   align-items: center;
   justify-content: center;
 }
-.scrollbar .os-theme-dark {
+.d-scrollbar .os-theme-dark {
   --os-handle-color: var(--dt-color-surface-contrast);
   --os-handle-bg: var(--os-handle-color);
   --os-handle-bg-hover: var(--os-handle-color);
   --os-handle-bg-active: var(--os-handle-color);
 }
-.scrollbar .os-scrollbar.os-scrollbar-horizontal .os-scrollbar-handle:hover {
+.d-scrollbar .os-scrollbar.os-scrollbar-horizontal .os-scrollbar-handle:hover {
   height: calc(var(--os-handle-perpendicular-size) + var(--dt-size-200));
 }
-.scrollbar .os-scrollbar.os-scrollbar-vertical .os-scrollbar-handle:hover {
+.d-scrollbar .os-scrollbar.os-scrollbar-vertical .os-scrollbar-handle:hover {
   width: calc(var(--os-handle-perpendicular-size) + var(--dt-size-200));
 }
-.scrollbar .os-scrollbar .os-scrollbar-handle {
+.d-scrollbar .os-scrollbar .os-scrollbar-handle {
   cursor: auto;
   opacity: var(--dt-opacity-700);
 }
-.scrollbar .os-scrollbar .os-scrollbar-handle:hover {
+.d-scrollbar .os-scrollbar .os-scrollbar-handle:hover {
   opacity: var(--dt-opacity-800);
 }
-.scrollbar .os-scrollbar .os-scrollbar-handle:active {
+.d-scrollbar .os-scrollbar .os-scrollbar-handle:active {
   opacity: var(--dt-opacity-900);
 }
+:root.d-scrollbar-disabled {
+  overflow: hidden !important;
+}
+:root.d-scrollbar-disabled .os-scrollbar {
+  display: none;
+}
 .d-bga-scroll {
   background-attachment: scroll !important;
 }