summaryrefslogtreecommitdiffstats
path: root/sticker.pinapelz.moe/style/spinner.sass
diff options
context:
space:
mode:
Diffstat (limited to 'sticker.pinapelz.moe/style/spinner.sass')
-rw-r--r--sticker.pinapelz.moe/style/spinner.sass68
1 files changed, 68 insertions, 0 deletions
diff --git a/sticker.pinapelz.moe/style/spinner.sass b/sticker.pinapelz.moe/style/spinner.sass
new file mode 100644
index 0000000..cbc9042
--- /dev/null
+++ b/sticker.pinapelz.moe/style/spinner.sass
@@ -0,0 +1,68 @@
+// Chase spinner from https://tobiasahlin.com/spinkit/. MIT license
+.sk-center-wrapper
+ width: 100%
+ display: flex
+ justify-content: space-around
+
+.sk-chase
+ position: relative
+ animation: sk-chase 2.5s infinite linear both
+
+ &.green > .sk-chase-dot:before
+ background-color: #00C853
+
+ > .sk-chase-dot
+ width: 100%
+ height: 100%
+ position: absolute
+ left: 0
+ top: 0
+ animation: sk-chase-dot 2.0s infinite ease-in-out both
+
+ &:before
+ content: ''
+ display: block
+ width: 25%
+ height: 25%
+ border-radius: 100%
+ animation: sk-chase-dot-before 2.0s infinite ease-in-out both
+ background-color: #FFF
+
+ &:nth-child(1)
+ animation-delay: -1.1s
+ &:nth-child(2)
+ animation-delay: -1.0s
+ &:nth-child(3)
+ animation-delay: -0.9s
+ &:nth-child(4)
+ animation-delay: -0.8s
+ &:nth-child(5)
+ animation-delay: -0.7s
+ &:nth-child(6)
+ animation-delay: -0.6s
+ &:nth-child(1):before
+ animation-delay: -1.1s
+ &:nth-child(2):before
+ animation-delay: -1.0s
+ &:nth-child(3):before
+ animation-delay: -0.9s
+ &:nth-child(4):before
+ animation-delay: -0.8s
+ &:nth-child(5):before
+ animation-delay: -0.7s
+ &:nth-child(6):before
+ animation-delay: -0.6s
+
+@keyframes sk-chase
+ 100%
+ transform: rotate(360deg)
+
+@keyframes sk-chase-dot
+ 80%, 100%
+ transform: rotate(360deg)
+
+@keyframes sk-chase-dot-before
+ 50%
+ transform: scale(0.4)
+ 100%, 0%
+ transform: scale(1.0)
send patches to the email below
yukais@pinapelz.com
include the subject [PATCH repo_name]
pinapelz.com
homepage