Merge pull request #844 from MoYingJi/pr/d

perf(Setting): 加快设置界面过渡动画速度

Author: imsyy

src/components/Setting/MainSetting.vue

@@ -69,7 +69,7 @@
         class="set-content"
         :content-style="{ overflow: 'hidden', padding: '40px 0' }"
       >
-        <Transition name="fade" mode="out-in" @after-leave="setScrollbar?.scrollTo({ top: 0 })">
+        <Transition name="fade" mode="out-in" :duration="70" @after-leave="setScrollbar?.scrollTo({ top: 0 })">
           <!-- 常规 -->
           <UniversalSetting
             v-if="activeKey === 'general'"

src/components/Setting/UniversalSetting.vue

@@ -6,7 +6,7 @@
         v-if="node.type === 'group'"
         class="slide-in-item group-title"
         :class="{ 'first-group': !!node.isFirst }"
-        :style="{ '--delay': highlightKey ? '0s' : `${Math.min(index, 15) * 0.05}s` }"
+        :style="{ '--delay': highlightKey ? '0s' : `${Math.min(index, 15) * 0.03}s` }"
       >
         <n-h3 prefix="bar">
           {{ node.data.title }}
@@ -29,7 +29,7 @@
         :item="node.data"
         class="slide-in-item"
         :highlighted="node.data.key === highlightKey"
-        :style="{ '--delay': highlightKey ? '0s' : `${Math.min(index, 15) * 0.05}s` }"
+        :style="{ '--delay': highlightKey ? '0s' : `${Math.min(index, 15) * 0.03}s` }"
       />
     </template>
   </div>
@@ -106,7 +106,7 @@ const displayList = computed(() => {
   }
 }
 .slide-in-item {
-  animation: slide-up-fade-in 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) backwards;
+  animation: slide-up-fade-in 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94) backwards;
   animation-delay: var(--delay, 0s);
 }
 </style>