From c75322f55e711d4b04a4381f382993fff0a9083a Mon Sep 17 00:00:00 2001
From: charlie <xyhp915@qq.com>
Date: Sat, 13 Dec 2025 19:01:25 +0800
Subject: [PATCH] enhance(mobile): polish UI spacing and background styling in
 various components

---
 .../com/logseq/app/NativeBottomSheetPlugin.kt | 19 +++++++++++++++++++
 .../app/NativeSelectionActionBarPlugin.kt     |  5 +++--
 src/main/frontend/components/user/login.css   |  2 ++
 src/main/mobile/components/app.css            |  4 ++--
 src/main/mobile/components/settings.cljs      |  4 ++--
 5 files changed, 28 insertions(+), 6 deletions(-)

diff --git a/android/app/src/main/java/com/logseq/app/NativeBottomSheetPlugin.kt b/android/app/src/main/java/com/logseq/app/NativeBottomSheetPlugin.kt
index 3d2eff64f5..2a394f92a6 100644
--- a/android/app/src/main/java/com/logseq/app/NativeBottomSheetPlugin.kt
+++ b/android/app/src/main/java/com/logseq/app/NativeBottomSheetPlugin.kt
@@ -1,6 +1,7 @@
 package com.logseq.app
 
 import android.graphics.Color
+import android.graphics.drawable.GradientDrawable
 import android.os.Handler
 import android.os.Looper
 import android.view.View
@@ -50,9 +51,27 @@ class NativeBottomSheetPlugin : Plugin() {
                 ViewGroup.LayoutParams.MATCH_PARENT
             )
 
+            val cornerRadius = NativeUiUtils.dp(ctx, 16f).toFloat()
+            val roundedBackground = GradientDrawable().apply {
+                setColor(LogseqTheme.current().background)
+                cornerRadii = floatArrayOf(
+                    cornerRadius, cornerRadius,  // 左上角
+                    cornerRadius, cornerRadius,  // 右上角
+                    0f, 0f,                      // 右下角
+                    0f, 0f                       // 左下角
+                )
+            }
+            container!!.background = roundedBackground
+            container!!.clipToOutline = true
+
             val sheet = BottomSheetDialog(ctx)
             sheet.setContentView(container!!)
 
+            sheet.setOnShowListener {
+                val bottomSheet = sheet.findViewById<View>(com.google.android.material.R.id.design_bottom_sheet)
+                bottomSheet?.setBackgroundColor(Color.TRANSPARENT)
+            }
+
             WebViewSnapshotManager.showSnapshot(snapshotTag, webView)
 
             // Move the WebView into the BottomSheet container
diff --git a/android/app/src/main/java/com/logseq/app/NativeSelectionActionBarPlugin.kt b/android/app/src/main/java/com/logseq/app/NativeSelectionActionBarPlugin.kt
index 474819dc22..1aab73d59c 100644
--- a/android/app/src/main/java/com/logseq/app/NativeSelectionActionBarPlugin.kt
+++ b/android/app/src/main/java/com/logseq/app/NativeSelectionActionBarPlugin.kt
@@ -5,6 +5,7 @@ import android.view.Gravity
 import android.view.View
 import android.view.ViewGroup
 import android.widget.FrameLayout
+import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.horizontalScroll
 import androidx.compose.foundation.layout.Arrangement
@@ -205,8 +206,8 @@ private fun SelectionActionBar(
 
     Surface(
         color = background,
-        shadowElevation = 6.dp,
-        shape = RoundedCornerShape(16.dp)
+        shape = RoundedCornerShape(16.dp),
+        border = BorderStroke(1.dp, tint.copy(alpha = 0.05f))
     ) {
         Row(
             modifier = Modifier
diff --git a/src/main/frontend/components/user/login.css b/src/main/frontend/components/user/login.css
index b7cda8c83c..bbeaf5ffa8 100644
--- a/src/main/frontend/components/user/login.css
+++ b/src/main/frontend/components/user/login.css
@@ -1,4 +1,6 @@
 .cp__user-login {
+  @apply px-1;
+
   span.opacity-50, a.opacity-60 {
     @apply opacity-80;
   }
diff --git a/src/main/mobile/components/app.css b/src/main/mobile/components/app.css
index d47a8ce49f..803c8a21fd 100644
--- a/src/main/mobile/components/app.css
+++ b/src/main/mobile/components/app.css
@@ -40,7 +40,7 @@ html.is-ios textarea,
 html.is-ios input,
 html.is-ios select,
 html.is-ios .block-content,
-html.is-ios .editor-inner,
+html.is-ios .editor-inner
 {
   font-size: inherit;
 }
@@ -229,7 +229,7 @@ ul {
 }
 
 .app-popup {
-  @apply w-full overflow-y-auto overflow-x-hidden;
+  @apply w-full overflow-y-auto overflow-x-hidden px-1;
 }
 
 .app-audio-recorder {
diff --git a/src/main/mobile/components/settings.cljs b/src/main/mobile/components/settings.cljs
index 053423b4f2..e73d3e60fa 100644
--- a/src/main/mobile/components/settings.cljs
+++ b/src/main/mobile/components/settings.cljs
@@ -21,7 +21,7 @@
   (let [username (user-handler/username)
         email (user-handler/email)
         initial  (or (some-> username (subs 0 1) string/upper-case) "?")]
-    [:div.pt-4
+    [:div.pt-2
      (if-not login?
        (shui/button
         {:variant :default
@@ -112,7 +112,7 @@
         theme-value (if system-theme?
                       "system"
                       (or theme "system"))]
-    [:div.app-index-settings.min-h-full.py-4.space-y-4
+    [:div.app-index-settings.min-h-full.space-y-4
      (user-profile login?)
      [:div.space-y-4
       [:div.mobile-setting-item