diff --git a/resources/css/common.css b/resources/css/common.css index 71433775125..77379276e2a 100644 --- a/resources/css/common.css +++ b/resources/css/common.css @@ -715,6 +715,11 @@ li p:last-child, background-color: var(--ls-primary-background-color, #fff); } +.bg-base-4 { + background-color: var(--ls-tertiary-background-color); +} + + .pre-white-space { white-space: pre; } diff --git a/src/main/frontend/components/block.cljs b/src/main/frontend/components/block.cljs index 85c7fc14b6c..6dac4212ed4 100644 --- a/src/main/frontend/components/block.cljs +++ b/src/main/frontend/components/block.cljs @@ -286,7 +286,7 @@ (.share Share #js {:url url :title "Open PDF fils with your favorite app"}))))} title] - + :else [:a.asset-ref {:ref @src} title]))))) @@ -862,7 +862,7 @@ (mobile-util/is-native-platform?) (asset-link config label-text s metadata full_text))) - + :else (asset-reference config label s)))) @@ -2406,7 +2406,6 @@ ref-or-custom-query? (or ref? custom-query?)] (if (and ref-or-custom-query? (not (:ref-query-child? config))) (ui/lazy-visible - nil (fn [] (block-container-inner state repo config block)) nil) @@ -2737,7 +2736,6 @@ (ui/catch-error (ui/block-error "Query Error:" {:content (:query q)}) (ui/lazy-visible - "loading ..." (fn [] (custom-query* config q)) nil))) diff --git a/src/main/frontend/components/journal.cljs b/src/main/frontend/components/journal.cljs index 0c6b50c2392..4727bbcb301 100644 --- a/src/main/frontend/components/journal.cljs +++ b/src/main/frontend/components/journal.cljs @@ -60,12 +60,12 @@ (page/today-queries repo today? false) (rum/with-key - (reference/references title false) + (reference/references title) (str title "-refs"))])) (rum/defc journal-cp [journal] - (ui/lazy-visible nil (fn [] (journal-cp-inner journal)) nil)) + (ui/lazy-visible (fn [] (journal-cp-inner journal)) nil)) (rum/defc journals < rum/reactive [latest-journals] diff --git a/src/main/frontend/components/page.cljs b/src/main/frontend/components/page.cljs index 9bc9f83234d..d8556299afa 100644 --- a/src/main/frontend/components/page.cljs +++ b/src/main/frontend/components/page.cljs @@ -394,7 +394,7 @@ ;; referenced blocks [:div {:key "page-references"} (rum/with-key - (reference/references route-page-name sidebar?) + (reference/references route-page-name) (str route-page-name "-refs"))] (when-not block? diff --git a/src/main/frontend/components/reference.cljs b/src/main/frontend/components/reference.cljs index 9e25e611d10..a053cdd776d 100644 --- a/src/main/frontend/components/reference.cljs +++ b/src/main/frontend/components/reference.cljs @@ -166,13 +166,10 @@ :title-trigger? true}))]])))) (rum/defc references - [page-name sidebar?] + [page-name] (ui/catch-error (ui/component-error "Linked References: Unexpected error") (ui/lazy-visible - (if (or sidebar? (gp-util/uuid-string? page-name)) - nil - "loading references...") (fn [] (references* page-name)) nil))) diff --git a/src/main/frontend/ui.cljs b/src/main/frontend/ui.cljs index 7de3e5c7f18..1e6e41ffc0f 100644 --- a/src/main/frontend/ui.cljs +++ b/src/main/frontend/ui.cljs @@ -915,7 +915,7 @@ {:init (fn [state] (assoc state ::ref (atom nil) - ::height (atom 1))) + ::height (atom 100))) :did-mount (fn [state] (let [observer (js/ResizeObserver. (fn [entries] (let [entry (first entries) @@ -925,17 +925,25 @@ (reset! *height height')))))] (.observe observer @(::ref state))) state)} - [state visible? content-fn loading-label] + [state visible? content-fn] [:div.lazy-visibility {:ref #(reset! (::ref state) %) :style {:min-height @(::height state)}} + (if visible? (when (fn? content-fn) (content-fn)) - (when loading-label [:span.text-sm.font-medium - loading-label]))]) + [:div.shadow.rounded-md.p-4.w-full.mx-auto + [:div.animate-pulse.flex.space-x-4 + [:div.flex-1.space-y-3.py-1 + [:div.h-2.bg-base-4.rounded] + [:div.space-y-3 + [:div.grid.grid-cols-3.gap-4 + [:div.h-2.bg-base-4.rounded.col-span-2] + [:div.h-2.bg-base-4.rounded.col-span-1]] + [:div.h-2.bg-base-4.rounded]]]]])]) (rum/defcs lazy-visible < (rum/local false ::visible?) - [state loading-label content-fn sensor-opts] + [state content-fn sensor-opts] (let [*visible? (::visible? state)] (visibility-sensor (merge @@ -944,4 +952,4 @@ :offset {:top -300 :bottom -300}} sensor-opts) - (lazy-visible-inner @*visible? content-fn loading-label)))) + (lazy-visible-inner @*visible? content-fn))))