From dbfadca825065f0c22abc372f7b554ed075312df Mon Sep 17 00:00:00 2001
From: charlie <xyhp915@qq.com>
Date: Wed, 6 Aug 2025 15:21:09 +0800
Subject: [PATCH] enhance(mobile): reuse left sidebar style

---
 src/main/frontend/components/container.cljs  |  2 +-
 src/main/frontend/components/container.css   | 12 +++++++-----
 src/main/mobile/components/app.css           | 14 +++++++++++++-
 src/main/mobile/components/left_sidebar.cljs |  7 ++++---
 tailwind.mobile.css                          |  1 +
 5 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/src/main/frontend/components/container.cljs b/src/main/frontend/components/container.cljs
index 505673834f..b6891f7bbf 100644
--- a/src/main/frontend/components/container.cljs
+++ b/src/main/frontend/components/container.cljs
@@ -444,7 +444,7 @@
      [close-signal])
 
     [:<>
-     [:div.left-sidebar-inner.flex-1.flex.flex-col.min-h-0
+     [:div.left-sidebar-inner.as-container.flex-1.flex.flex-col.min-h-0
       {:key "left-sidebar"
        :ref ref-el
        :style (cond-> {}
diff --git a/src/main/frontend/components/container.css b/src/main/frontend/components/container.css
index 50ea6c0813..6ffa2f2a49 100644
--- a/src/main/frontend/components/container.css
+++ b/src/main/frontend/components/container.css
@@ -59,12 +59,14 @@
 }
 
 .left-sidebar-inner {
-  @apply relative h-full pt-3 overflow-y-auto overflow-x-hidden transition-transform;
-  @apply transform-gpu translate-x-[-100%] z-[3] antialiased;
+  &.as-container {
+    @apply relative h-full pt-3 overflow-y-auto overflow-x-hidden transition-transform;
+    @apply transform-gpu translate-x-[-100%] z-[3] antialiased;
 
-  width: var(--ls-left-sidebar-sm-width);
-  background-color: var(--left-sidebar-bg-color);
-  border-right: 1px solid var(--lx-gray-03, var(--ls-tertiary-background-color));
+    width: var(--ls-left-sidebar-sm-width);
+    background-color: var(--left-sidebar-bg-color);
+    border-right: 1px solid var(--lx-gray-03, var(--ls-tertiary-background-color));
+  }
 
   > .wrap {
     @apply flex flex-col relative w-full mt-6;
diff --git a/src/main/mobile/components/app.css b/src/main/mobile/components/app.css
index ae1092bf57..c73c4d0434 100644
--- a/src/main/mobile/components/app.css
+++ b/src/main/mobile/components/app.css
@@ -74,7 +74,7 @@ body {
 }
 
 ul {
-  @apply !list-disc ml-1 mt-2 list-inside;
+  @apply list-disc ml-1 mt-2 list-inside;
 
   li {
     @apply pl-0;
@@ -466,4 +466,16 @@ html[data-silk-native-page-scroll-replaced=false] .app-silk-index-scroll-view {
       }
     }
   }
+}
+
+.left-sidebar-inner {
+  @apply -mx-4;
+
+  a {
+    @apply text-gray-12 dark:text-gray-11;
+
+    .page-title {
+      display: flex !important;
+    }
+  }
 }
\ No newline at end of file
diff --git a/src/main/mobile/components/left_sidebar.cljs b/src/main/mobile/components/left_sidebar.cljs
index c88363f524..dbf22919af 100644
--- a/src/main/mobile/components/left_sidebar.cljs
+++ b/src/main/mobile/components/left_sidebar.cljs
@@ -21,6 +21,7 @@
         {:class "flex flex-col items-center p-2"}
         (silkhq/sidebar-sheet-handle)
         [:div.w-full.app-silk-popup-content-inner.p-2
-         [:div.sidebar-contents-container.mt-8
-          (container/sidebar-favorites)
-          (container/sidebar-recent-pages)]]))))))
+         [:div.left-sidebar-inner
+          [:div.sidebar-contents-container.mt-8
+           (container/sidebar-favorites)
+           (container/sidebar-recent-pages)]]]))))))
diff --git a/tailwind.mobile.css b/tailwind.mobile.css
index f20df1eaf3..393db51aa2 100644
--- a/tailwind.mobile.css
+++ b/tailwind.mobile.css
@@ -21,6 +21,7 @@
 @import "src/main/frontend/components/icon.css";
 @import "src/main/frontend/mobile/index.css";
 @import "src/main/frontend/components/theme.css";
+@import "src/main/frontend/components/container.css";
 @import "src/main/frontend/components/block.css";
 @import "src/main/frontend/components/property.css";
 @import "src/main/frontend/components/editor.css";