fix: fold button overlap with block title

src/main/frontend/components/theme.css

@@ -130,6 +130,10 @@ main.ls-fold-button-on-right {
     }
   }
 
+  .block-main-container {
+    padding-right: calc(1.2rem + env(safe-area-inset-right, 0px)); /* leave room for the right fold toggle */
+  }
+
   .cp__sidebar-left-layout {
     width: 15px;
 
@@ -175,6 +179,12 @@ main.ls-fold-button-on-right {
     }
   }
 
+  /* Keep the right fold toggle vertically aligned with the first line of text */
+  .ls-block .block-control {
+    top: 0.1em;
+    margin-top: 0;
+  }
+
   .block-children-container {
     margin-left: 7px;
 

src/main/frontend/handler/editor.cljs

@@ -843,7 +843,6 @@
                                           (let [block (db/entity [:block/uuid block-id])]
                                             (seq (:block/_parent block)))))]
             (when-not (and has-children? left-has-children?)
-              (mobile-util/mobile-focus-hidden-input)
               (let [block-parent block-container
                     sibling-or-parent-block
                     (if (:embed? config)

src/main/mobile/components/app.cljs

@@ -85,18 +85,19 @@
        #(.removeEventListener js/window "orientationchange" handle-size!)))
    []))
 
-(rum/defc other-page
-  [view tab route-match]
-  (let [tab' (keyword tab)]
-    [:div#main-content-container.px-5.ls-layer
-     (if view
-       (view route-match)
-       (case tab'
-         :home nil
-         :graphs (graphs/page)
-         :favorites (favorites/favorites)
-         :search (search/search)
-         nil))]))
+(rum/defc other-page < rum/static
+  [route-view tab route-match]
+  (let [page-view? (= (get-in route-match [:data :name]) :page)
+        tab' (keyword tab)]
+    [:div#main-content-container.pl-3.ls-layer
+     {:class (if page-view? "pr-2" "pr-3")}
+     (if route-view
+       (route-view route-match)
+       ;; NOTE: `case` caused IllegalArgumentException: Duplicate case test constant
+       (cond
+         (= tab' :graphs) (graphs/page)
+         (= tab' :favorites) (favorites/favorites)
+         (= tab' :search) (search/search)))]))
 
 (rum/defc main-content < rum/static
   [tab route-match]
@@ -108,7 +109,7 @@
     ;; Both are absolutely positioned and stacked; we toggle visibility.
     [:div.h-full.relative
      ;; Journals scroll container (keep-alive)
-     [:div#app-main-home.px-5.absolute.inset-0
+     [:div#app-main-home.pl-3.pr-2.absolute.inset-0
       {:class (when-not home? "invisible pointer-events-none")}
       (home)]
 

src/main/mobile/components/app.css

@@ -5,7 +5,7 @@
 
 :root {
   --ls-mobile-font-scale: 1;
-  --ls-page-title-size: calc(24px * var(--ls-mobile-font-scale, 1));
+  --ls-page-title-size: calc(26px * var(--ls-mobile-font-scale, 1));
   --safe-area-inset-top: 40px;
   --safe-area-inset-bottom: 16px;
   --ls-mobile-font-size: 16px;
@@ -207,7 +207,7 @@ ul {
 }
 
 .ls-page-title {
-  margin-left: -8px;
+  margin-left: -3px;
 }
 
 .ls-block[draggable="true"] {

src/main/mobile/components/favorites.cljs

@@ -6,7 +6,7 @@
 (rum/defc favorites
   []
   [:div.left-sidebar-inner
-   [:div.sidebar-contents-container
+   [:div.sidebar-contents-container.mt-2
     {:class "!gap-4"}
     (app-left-sidebar/sidebar-favorites)
     (app-left-sidebar/sidebar-recent-pages)]])

src/main/mobile/routes.cljs

@@ -10,7 +10,7 @@
    ["/page/:name"
     {:name :page
      :view (fn [route-match]
-             [:div.ls-mobile-page.pt-10
+             [:div.ls-mobile-page.pt-8
               (page/page-cp (assoc route-match :mobile-page? true))])}]
    ["/import"
     {:name :import