diff --git a/src/components/ThemeSwitch/index.vue b/src/components/ThemeSwitch/index.vue
index 2ccc564c..cece2944 100644
--- a/src/components/ThemeSwitch/index.vue
+++ b/src/components/ThemeSwitch/index.vue
@@ -1,25 +1,12 @@
 <script lang="ts" setup>
-import { type ThemeName, useTheme } from "@/hooks/useTheme"
+import { useTheme } from "@/hooks/useTheme"
 import { MagicStick } from "@element-plus/icons-vue"
 
 const { themeList, activeThemeName, setTheme } = useTheme()
-
-const onChangeTheme = (event: MouseEvent, themeName: ThemeName) => {
-  document.documentElement.style.setProperty("--x", event.clientX + "px")
-  document.documentElement.style.setProperty("--y", event.clientY + "px")
-  const handler = () => setTheme(themeName)
-  // @ts-ignore
-  if (document.startViewTransition) {
-    // @ts-ignore
-    document.startViewTransition(handler)
-  } else {
-    handler()
-  }
-}
 </script>
 
 <template>
-  <el-dropdown trigger="click">
+  <el-dropdown trigger="click" @command="setTheme">
     <div>
       <el-tooltip effect="dark" content="主题模式" placement="bottom">
         <el-icon :size="20">
@@ -34,7 +21,6 @@ const onChangeTheme = (event: MouseEvent, themeName: ThemeName) => {
           :key="index"
           :disabled="activeThemeName === theme.name"
           :command="theme.name"
-          @click="(e) => onChangeTheme(e, theme.name)"
         >
           <span>{{ theme.title }}</span>
         </el-dropdown-item>
diff --git a/src/styles/index.scss b/src/styles/index.scss
index 9d98741a..fb4938ee 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -20,23 +20,6 @@ html {
   height: 100%;
 }
 
-::view-transition-old(root) {
-  animation: none;
-  mix-blend-mode: normal;
-}
-::view-transition-new(root) {
-  mix-blend-mode: normal;
-  animation: wave 0.7s ease-in;
-}
-@keyframes wave {
-  from {
-    clip-path: circle(0% at var(--x) var(--y));
-  }
-  to {
-    clip-path: circle(150% at var(--x) var(--y));
-  }
-}
-
 body {
   height: 100%;
   background-color: var(--v3-body-bg-color);