From 2b12587263d3e1a64008a893adc950f192462ba8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E5=88=BA=E8=9E=88?= <i@songe.li>
Date: Tue, 26 Nov 2024 15:23:32 +0800
Subject: [PATCH] perf: mobile scrollbar

---
 docs/.vitepress/components/BodyScrollbar.vue | 20 ++++++++------------
 docs/.vitepress/theme/index.ts               |  4 ++++
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/docs/.vitepress/components/BodyScrollbar.vue b/docs/.vitepress/components/BodyScrollbar.vue
index bb2e46c..c9f245c 100644
--- a/docs/.vitepress/components/BodyScrollbar.vue
+++ b/docs/.vitepress/components/BodyScrollbar.vue
@@ -4,21 +4,9 @@ import {
   useEventListener,
   useWindowScroll,
   useWindowSize,
-  useStyleTag,
 } from '@vueuse/core';
 import { computed, onMounted, shallowRef, type CSSProperties } from 'vue';
 
-useStyleTag(
-  `
-body::-webkit-scrollbar {
-  display: none;
-}
-html {
-  scrollbar-width: none;
-}
-`.trim(),
-);
-
 const { y, x } = useWindowScroll();
 const { height: winH, width: winW } = useWindowSize();
 const bodyRef = shallowRef<HTMLElement>(); // support ssr
@@ -180,3 +168,11 @@ useEventListener('selectstart', (e) => {
     </div>
   </div>
 </template>
+<style>
+body:not(.mobile):-webkit-scrollbar {
+  display: none;
+}
+html:not(.mobile) {
+  scrollbar-width: none;
+}
+</style>
diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts
index bc1fbc5..41aa826 100644
--- a/docs/.vitepress/theme/index.ts
+++ b/docs/.vitepress/theme/index.ts
@@ -45,6 +45,10 @@ const ScrollbarWrapper = defineComponent(() => {
   onMounted(() => {
     const isMobile = 'ontouchstart' in document.documentElement;
     show.value = !isMobile;
+    if (isMobile) {
+      document.body.classList.add('mobile');
+      document.documentElement.classList.add('mobile');
+    }
   });
   return () => {
     return show.value