greatbody
/
logseq
mirror of https://github.com/logseq/logseq
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix: lazy visual blink

pull/5435/head
Tienson Qin 2022-05-25 23:12:09 +08:00
parent 2eb5bbb6e8
commit 1f4de901f5
2 changed files with 10 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
resources/css/animation.css
View File

@ -44,6 +44,12 @@
animation-duration: 1s; animation-duration: 1s;
} }
.faster-fade-in {
-webkit-animation-duration: 0.3s;
-moz-animation-duration: 0.3s;
animation-duration: 0.3s;
}
/* page transition */ /* page transition */
.fade-enter { .fade-enter {
opacity: 0; opacity: 0;

7
src/main/frontend/ui.cljs
View File

@ -868,7 +868,7 @@
(rum/defc progress-bar (rum/defc progress-bar
[width] [width]
{:pre (integer? width)} {:pre (integer? width)}
[:div.w-full.bg-indigo-200.rounded-full.h-2.5 [:div.w-full.bg-indigo-200.rounded-full.h-2.5.animate-pulse
[:div.bg-indigo-600.h-2.5.rounded-full {:style {:width (str width "%")} [:div.bg-indigo-600.h-2.5.rounded-full {:style {:width (str width "%")}
:transition "width 1s"}]]) :transition "width 1s"}]])
@ -892,8 +892,9 @@
{:ref #(reset! (::ref state) %) {:ref #(reset! (::ref state) %)
:style {:min-height 24}} :style {:min-height 24}}
(if visible? (if visible?
(when (fn? content-fn) (content-fn)) (when (fn? content-fn)
[:div.shadow.rounded-md.p-4.w-full.mx-auto.mb-5 {:style {:height 88}} [:div.fade-in.faster-fade-in (content-fn)])
[:div.shadow.rounded-md.p-4.w-full.mx-auto.mb-5.fade-in {:style {:height 88}}
[:div.animate-pulse.flex.space-x-4 [:div.animate-pulse.flex.space-x-4
[:div.flex-1.space-y-3.py-1 [:div.flex-1.space-y-3.py-1
[:div.h-2.bg-base-4.rounded] [:div.h-2.bg-base-4.rounded]