Browse Source

enhance: lazy loading animation

Tienson Qin 3 years ago
parent
commit
c62d59c581

+ 1 - 1
src/main/frontend/components/block.cljs

@@ -2939,7 +2939,7 @@
       {:on-load bottom-reached
        :threhold 1000
        :has-more has-more?
-       :more-text "More"})]))
+       :more (if (:preview? config) "More" (ui/loading "Loading"))})]))
 
 (rum/defcs blocks-container <
   {:init (fn [state]

+ 1 - 1
src/main/frontend/components/journal.cljs

@@ -97,7 +97,7 @@
                        [:div.journal-item.content {:key journal-name}
                         (journal-cp [journal-name format])])
                      {:has-more (page-handler/has-more-journals?)
-                      :more-text-class "text-4xl"
+                      :more-class "text-4xl"
                       :on-top-reached page-handler/create-today-journal!
                       :on-load (fn []
                                  (page-handler/load-more-journals!))})])

+ 7 - 6
src/main/frontend/ui.cljs

@@ -402,16 +402,17 @@
   (mixins/event-mixin attach-listeners)
   "Render an infinite list."
   [state list-element-id body {:keys [on-load on-top-reached threhold
-                                      has-more more-text more-text-class]
-                               :or {more-text-class "text-sm"}}]
+                                      has-more more more-class]
+                               :or {more-class "text-sm"}}]
   (rum/with-context [[t] i18n/*tongue-context*]
     [:div
      body
      (when has-more
-       [:a.fade-link.text-link.font-bold
-        {:on-click on-load
-         :class more-text-class}
-        (or more-text (t :page/earlier))])]))
+       [:div.w-full.p-4
+        [:a.fade-link.text-link.font-bold
+         {:on-click on-load
+          :class more-class}
+         (or more (t :page/earlier))]])]))
 
 (rum/defcs auto-complete <
   (rum/local 0 ::current-idx)