feat(transitions): add root variable (#19120)

resolves #6470
vuetifyjs · Apr 6, 2024 · f1735a5 · f1735a5
1 parent a3ff4eb
commit f1735a5
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/packages/vuetify/src/styles/generic/_transitions.scss b/packages/vuetify/src/styles/generic/_transitions.scss
@@ -2,17 +2,17 @@
 
 @mixin transition-default() {
   &-enter-active {
-    transition-duration: 0.3s !important;
+    transition-duration: settings.$transition-duration-root !important;
     transition-timing-function: settings.$standard-easing !important;
   }
 
   &-leave-active {
-    transition-duration: 0.3s !important;
+    transition-duration: settings.$transition-duration-root !important;
     transition-timing-function: settings.$standard-easing !important;
   }
 
   &-move {
-    transition-duration: 0.5s !important;
+    transition-duration: settings.$transition-move-duration-root !important;
     transition-property: transform !important;
     transition-timing-function: settings.$standard-easing !important;
   }

diff --git a/packages/vuetify/src/styles/settings/_variables.scss b/packages/vuetify/src/styles/settings/_variables.scss
@@ -12,6 +12,8 @@ $line-height-root: 1.5 !default;
 $border-color-root: rgba(var(--v-border-color), var(--v-border-opacity)) !default;
 $border-radius-root: 4px !default;
 $border-style-root: solid !default;
+$transition-duration-root: 0.3s !default;
+$transition-move-duration-root: 0.5s !default;
 
 $borders: () !default;
 $borders: map-deep-merge(