diff --git a/src/components/Dock/Dock.vue b/src/components/Dock/Dock.vue
index 34598f6e..0db91b9b 100644
--- a/src/components/Dock/Dock.vue
+++ b/src/components/Dock/Dock.vue
@@ -84,55 +84,62 @@ onMounted(() => {
   }
 })
 
+// eslint-disable-next-line unused-imports/no-unused-vars
 function toggleDark(e: MouseEvent) {
-  const isAppearanceTransition = typeof document !== 'undefined'
-  // @ts-expect-error: Transition API
-  && document.startViewTransition
-  && !window.matchMedia('(prefers-reduced-motion: reduce)').matches
-  if (!isAppearanceTransition) {
-    if (currentAppColorScheme.value === 'light')
-      settings.value.theme = 'dark'
-    else
-      settings.value.theme = 'light'
-  }
-  else {
-    const x = e.clientX
-    const y = e.clientY
-    const endRadius = Math.hypot(
-      Math.max(x, innerWidth - x),
-      Math.max(y, innerHeight - y),
-    )
-    const isDark = currentAppColorScheme.value === 'dark'
-    // @ts-expect-error: Transition API
-    const transition = document.startViewTransition(async () => {
-      if (currentAppColorScheme.value === 'light')
-        settings.value.theme = 'dark'
-      else
-        settings.value.theme = 'light'
-      await nextTick()
-    })
+  if (currentAppColorScheme.value === 'light')
+    settings.value.theme = 'dark'
+  else
+    settings.value.theme = 'light'
 
-    transition.ready.then(() => {
-      const clipPath = [
-      `circle(0px at ${x}px ${y}px)`,
-      `circle(${endRadius}px at ${x}px ${y}px)`,
-      ]
-      document.documentElement.animate(
-        {
-          clipPath: isDark
-            ? [...clipPath].reverse()
-            : clipPath,
-        },
-        {
-          duration: 400,
-          easing: 'ease-in',
-          pseudoElement: isDark
-            ? '::view-transition-old(root)'
-            : '::view-transition-new(root)',
-        },
-      )
-    })
-  }
+  // const isAppearanceTransition = typeof document !== 'undefined'
+  //   // @ts-expect-error: Transition API
+  //   && document.startViewTransition
+  //   && !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+
+  // if (!isAppearanceTransition) {
+  //   if (currentAppColorScheme.value === 'light')
+  //     settings.value.theme = 'dark'
+  //   else
+  //     settings.value.theme = 'light'
+  // }
+  // else {
+  //   const x = e.clientX
+  //   const y = e.clientY
+  //   const endRadius = Math.hypot(
+  //     Math.max(x, innerWidth - x),
+  //     Math.max(y, innerHeight - y),
+  //   )
+  //   const isDark = currentAppColorScheme.value === 'dark'
+  //   // @ts-expect-error: Transition API
+  //   const transition = document.startViewTransition(async () => {
+  //     if (currentAppColorScheme.value === 'light')
+  //       settings.value.theme = 'dark'
+  //     else
+  //       settings.value.theme = 'light'
+  //     await nextTick()
+  //   })
+
+  //   transition.ready.then(() => {
+  //     const clipPath = [
+  //     `circle(0px at ${x}px ${y}px)`,
+  //     `circle(${endRadius}px at ${x}px ${y}px)`,
+  //     ]
+  //     document.documentElement.animate(
+  //       {
+  //         clipPath: isDark
+  //           ? [...clipPath].reverse()
+  //           : clipPath,
+  //       },
+  //       {
+  //         duration: 400,
+  //         easing: 'ease-in',
+  //         pseudoElement: isDark
+  //           ? '::view-transition-old(root)'
+  //           : '::view-transition-new(root)',
+  //       },
+  //     )
+  //   })
+  // }
 }
 
 function toggleDockHide(hide: boolean) {
diff --git a/src/components/RightSideButtons/RightSideButtons.vue b/src/components/RightSideButtons/RightSideButtons.vue
index da8ae20c..3992b0b9 100644
--- a/src/components/RightSideButtons/RightSideButtons.vue
+++ b/src/components/RightSideButtons/RightSideButtons.vue
@@ -16,55 +16,60 @@ const currentAppColorScheme = computed((): 'dark' | 'light' => {
     return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'
 })
 
+// eslint-disable-next-line unused-imports/no-unused-vars
 function toggleDark(e: MouseEvent) {
-  const isAppearanceTransition = typeof document !== 'undefined'
-  // @ts-expect-error: Transition API
-  && document.startViewTransition
-  && !window.matchMedia('(prefers-reduced-motion: reduce)').matches
-  if (!isAppearanceTransition) {
-    if (currentAppColorScheme.value === 'light')
-      settings.value.theme = 'dark'
-    else
-      settings.value.theme = 'light'
-  }
-  else {
-    const x = e.clientX
-    const y = e.clientY
-    const endRadius = Math.hypot(
-      Math.max(x, innerWidth - x),
-      Math.max(y, innerHeight - y),
-    )
-    const isDark = currentAppColorScheme.value === 'dark'
-    // @ts-expect-error: Transition API
-    const transition = document.startViewTransition(async () => {
-      if (currentAppColorScheme.value === 'light')
-        settings.value.theme = 'dark'
-      else
-        settings.value.theme = 'light'
-      await nextTick()
-    })
+  if (currentAppColorScheme.value === 'light')
+    settings.value.theme = 'dark'
+  else
+    settings.value.theme = 'light'
+  // const isAppearanceTransition = typeof document !== 'undefined'
+  //   // @ts-expect-error: Transition API
+  //   && document.startViewTransition
+  //   && !window.matchMedia('(prefers-reduced-motion: reduce)').matches
+  // if (!isAppearanceTransition) {
+  //   if (currentAppColorScheme.value === 'light')
+  //     settings.value.theme = 'dark'
+  //   else
+  //     settings.value.theme = 'light'
+  // }
+  // else {
+  //   const x = e.clientX
+  //   const y = e.clientY
+  //   const endRadius = Math.hypot(
+  //     Math.max(x, innerWidth - x),
+  //     Math.max(y, innerHeight - y),
+  //   )
+  //   const isDark = currentAppColorScheme.value === 'dark'
+  //   // @ts-expect-error: Transition API
+  //   const transition = document.startViewTransition(async () => {
+  //     if (currentAppColorScheme.value === 'light')
+  //       settings.value.theme = 'dark'
+  //     else
+  //       settings.value.theme = 'light'
+  //     await nextTick()
+  //   })
 
-    transition.ready.then(() => {
-      const clipPath = [
-      `circle(0px at ${x}px ${y}px)`,
-      `circle(${endRadius}px at ${x}px ${y}px)`,
-      ]
-      document.documentElement.animate(
-        {
-          clipPath: isDark
-            ? [...clipPath].reverse()
-            : clipPath,
-        },
-        {
-          duration: 400,
-          easing: 'ease-in',
-          pseudoElement: isDark
-            ? '::view-transition-old(root)'
-            : '::view-transition-new(root)',
-        },
-      )
-    })
-  }
+  //   transition.ready.then(() => {
+  //     const clipPath = [
+  //     `circle(0px at ${x}px ${y}px)`,
+  //     `circle(${endRadius}px at ${x}px ${y}px)`,
+  //     ]
+  //     document.documentElement.animate(
+  //       {
+  //         clipPath: isDark
+  //           ? [...clipPath].reverse()
+  //           : clipPath,
+  //       },
+  //       {
+  //         duration: 400,
+  //         easing: 'ease-in',
+  //         pseudoElement: isDark
+  //           ? '::view-transition-old(root)'
+  //           : '::view-transition-new(root)',
+  //       },
+  //     )
+  //   })
+  // }
 }
 </script>
 
diff --git a/src/styles/main.scss b/src/styles/main.scss
index 6950c9a1..7d80f73c 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -79,21 +79,22 @@ html.dark.bewly-design {
   display: none;
 }
 
-/* Color Mode transition */
-::view-transition-old(root),
-::view-transition-new(root) {
-  animation: none;
-  mix-blend-mode: normal;
-}
-::view-transition-old(root) {
-  z-index: 1;
-}
-::view-transition-new(root) {
-  z-index: 2147483646;
-}
-.dark::view-transition-old(root) {
-  z-index: 2147483646;
-}
-.dark::view-transition-new(root) {
-  z-index: 1;
-}
+// /* Color Mode transition */
+// ::view-transition-old(root),
+// ::view-transition-new(root) {
+//   position: relative;
+//   animation: none;
+//   mix-blend-mode: normal;
+// }
+// ::view-transition-old(root) {
+//   z-index: 1;
+// }
+// ::view-transition-new(root) {
+//   z-index: 2147483646;
+// }
+// .dark::view-transition-old(root) {
+//   z-index: 2147483646;
+// }
+// .dark::view-transition-new(root) {
+//   z-index: 1;
+// }