浏览代码

enhance(capacitor): polish page blocks list

charlie 5 月之前
父节点
当前提交
fdffab85c1

+ 4 - 20
src/main/capacitor/components/app.cljs

@@ -84,26 +84,10 @@
    {:id "app-keep-keyboard-open-input"}])
 
 (rum/defc journals []
-  (let [[reload set-reload!] (hooks/use-state 0)]
-    (ion/content
-     (ion/refresher
-      {:slot "fixed"
-       :pull-factor 0.5
-       :pull-min 100
-       :pull-max 200
-       :on-ion-refresh (fn [^js e]
-                         (js/setTimeout
-                          (fn [] (.complete (.-detail e))
-                            (set-reload! (inc reload)))
-                          1000))}
-      (ion/refresher-content))
-
-     [:div.pt-4
-      [:main#app-container-wrapper.ls-fold-button-on-right
-       [:div#app-container
-        [:div#main-container.flex.flex-1
-         [:div#main-content-container.w-full.!px-0
-          (journal/all-journals)]]]]])))
+  (ion/content
+    (ui/classic-app-container-wrap
+      [:div.pt-3
+       (journal/all-journals)])))
 
 (rum/defc home < rum/reactive
   []

+ 6 - 4
src/main/capacitor/components/page.cljs

@@ -1,6 +1,7 @@
 (ns capacitor.components.page
   (:require [capacitor.ionic :as ion]
             [capacitor.state :as state]
+            [capacitor.components.ui :as ui]
             [frontend.components.page :as cp-page]
             [frontend.db.async :as db-async]
             [frontend.db.utils :as db-utils]
@@ -57,7 +58,8 @@
 
        (ion/title title)))
 
-     (ion/content {:class "ion-padding"}
-                  (if loading?
-                    [:p.text-xl.text-center "Loading ..."]
-                    (cp-page/page-blocks-cp page {}))))))
+      (ion/content {:class "ion-padding"}
+        (ui/classic-app-container-wrap
+          (if loading?
+            [:p.text-xl.text-center "Loading ..."]
+            (cp-page/page-blocks-cp page {})))))))

+ 7 - 0
src/main/capacitor/components/ui.cljs

@@ -20,6 +20,13 @@
     (merge {:class "ion-padding"} content-props)
     content)))
 
+(rum/defc classic-app-container-wrap
+  [content]
+  [:main#app-container-wrapper.ls-fold-button-on-right
+   [:div#app-container.pt-2
+    [:div#main-container.flex.flex-1
+     [:div#main-content-container.w-full.!px-0 content]]]])
+
 (rum/defc notification-clear-all
   []
   [:div.ui__notifications-content