diff options
author | Paul Slaughter <pslaughter@gitlab.com> | 2019-01-02 08:28:44 -0600 |
---|---|---|
committer | Paul Slaughter <pslaughter@gitlab.com> | 2019-01-02 09:01:40 -0600 |
commit | bc69b934e6eb9fb2db47d127cb705bbf1e39d406 (patch) | |
tree | 5e4e61c5005149680dba9b317d96a394e92c8b07 | |
parent | eab7e3c8b9bc267d6c1f1ed883d32679b12544f3 (diff) | |
download | gitlab-ce-bc69b934e6eb9fb2db47d127cb705bbf1e39d406.tar.gz |
Add gl-spinner animation class
-rw-r--r-- | app/assets/stylesheets/framework/animations.scss | 22 |
1 files changed, 22 insertions, 0 deletions
diff --git a/app/assets/stylesheets/framework/animations.scss b/app/assets/stylesheets/framework/animations.scss index 549a8730301..43d4044033f 100644 --- a/app/assets/stylesheets/framework/animations.scss +++ b/app/assets/stylesheets/framework/animations.scss @@ -260,3 +260,25 @@ $skeleton-line-widths: ( .slide-down-leave-to { transform: translateY(-30%); } + +@keyframes spin { + 0% { transform: rotate(0deg);} + 100% { transform: rotate(360deg);} +} + +/** COMMON ANIMATION CLASSES **/ +.transform-origin-center { @include webkit-prefix(transform-origin, 50% 50%); } +.animate-n-spin { @include webkit-prefix(animation-name, spin); } +.animate-c-infinite { @include webkit-prefix(animation-iteration-count, infinite); } +.animate-t-linear { @include webkit-prefix(animation-timing-function, linear); } +.animate-d-1 { @include webkit-prefix(animation-duration, 1s); } +.animate-d-2 { @include webkit-prefix(animation-duration, 2s); } + +/** COMPOSITE ANIMATION CLASSES **/ +.gl-spinner { + @include webkit-prefix(animation-name, spin); + @include webkit-prefix(animation-iteration-count, infinite); + @include webkit-prefix(animation-timing-function, linear); + @include webkit-prefix(animation-duration, 1s); + transform-origin: 50% 50%; +} |