diff --git a/resources/styles/dependencies/animations.scss b/resources/styles/dependencies/animations.scss index 769fbbe10a..6184af1ba1 100644 --- a/resources/styles/dependencies/animations.scss +++ b/resources/styles/dependencies/animations.scss @@ -3338,3 +3338,13 @@ fill: #513B56; } } + +//pencil loader animation +@keyframes linePencil { + 0% { + transform: translateY(0); + } + 100% { + transform: translateY(-150px); + } +} diff --git a/resources/styles/partials/loader.scss b/resources/styles/partials/loader.scss index 02d43c44dd..210d0c8c37 100644 --- a/resources/styles/partials/loader.scss +++ b/resources/styles/partials/loader.scss @@ -12,7 +12,7 @@ z-index: 999; } -// Loader CSS +// full with loader CSS svg#loader-icon { height: 100px; width: 100px; @@ -30,3 +30,13 @@ svg#loader-icon { #loader-pen3 { animation: pen3 2s infinite ease; } + +// btn prncil loader +svg#loader-pencil { + fill: $color-primary-darker; + width: 60px; +} + +#loader-line { + animation: linePencil .8s infinite linear; +} diff --git a/src/uxbox/ui/dashboard/projects.cljs b/src/uxbox/ui/dashboard/projects.cljs index 0a17de2005..37f65100bc 100644 --- a/src/uxbox/ui/dashboard/projects.cljs +++ b/src/uxbox/ui/dashboard/projects.cljs @@ -199,7 +199,9 @@ (html [:section.dashboard-grid ;; LOADER WIP - [:div.loader-content i/loader] + [:div.loader-content + i/loader + [:div.btn-primary i/loader-pencil]] ;; LOADER WIP [:h2 "Your projects"] [:div.dashboard-grid-content diff --git a/src/uxbox/ui/icons.cljs b/src/uxbox/ui/icons.cljs index 0e87207aa6..4f29f00980 100644 --- a/src/uxbox/ui/icons.cljs +++ b/src/uxbox/ui/icons.cljs @@ -651,3 +651,20 @@ {:id "loader-pen3" :d "M193.684.083l-36.328 51.162.002 58.058h11.965V59.56h19.424v49.743h9.97V59.56h19.326v49.743h11.967V51.245l-1.105-1.555L193.685.083zm6.428 29.72l14.05 19.787h-40.955l13.885-19.556 13.02-.23z"}]]])) + +(def loader-pencil + (html + [:svg + {:viewBox "0 0 677.34762 182.15429" + :height "182" + :width "667" + :id "loader-pencil"} + [:g + [:path + {:id "body-body" + :d + "M128.273 0l-3.9 2.77L0 91.078l128.273 91.076 549.075-.006V.008L128.273 0zm20.852 30l498.223.006V152.15l-498.223.007V30zm-25 9.74v102.678l-49.033-34.813-.578-32.64 49.61-35.225z"}] + [:path + {:id "loader-line" + :d + "M134.482 157.147v25l518.57.008.002-25-518.572-.008z"}]]]))