diff options
| author |   Michael Lando <ml636r@att.com> | 2017-02-19 10:28:42 +0200 |
|---|---|---|
| committer | Michael Lando <ml636r@att.com> | 2017-02-19 10:51:01 +0200 |
| commit | 451a3400b76511393c62a444f588a4ed15f4a549 (patch) | |
| tree | e4f5873a863d1d3e55618eab48b83262f874719d /catalog-ui/app/styles/animation.less | |
| parent | 5abfe4e1fb5fae4bbd5fbc340519f52075aff3ff (diff) | |
Initial OpenECOMP SDC commit
Change-Id: I0924d5a6ae9cdc161ae17c68d3689a30d10f407b
Signed-off-by: Michael Lando <ml636r@att.com>
Diffstat (limited to 'catalog-ui/app/styles/animation.less')
| -rw-r--r-- | catalog-ui/app/styles/animation.less | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/catalog-ui/app/styles/animation.less b/catalog-ui/app/styles/animation.less new file mode 100644 index 0000000000..014b33a454 --- /dev/null +++ b/catalog-ui/app/styles/animation.less @@ -0,0 +1,51 @@ +.animation_flex (@value){ + -webkit-animation: @value; + -moz-animation: @value; + -o-animation: @value; + -ms-transition: @value; + animation: @value; +} + +.animation (@name, @duration: 300ms, @delay: 0, @ease: ease) { + -webkit-animation: @name @duration @delay @ease; + -moz-animation: @name @duration @delay @ease; + -o-animation: @name @duration @delay @ease; + -ms-animation: @name @duration @delay @ease; + animation: @name @duration @delay @ease; +} + +/* ============ flash ============ */ +.flash-frames () { + 0% { opacity: 1; } + 20% { opacity: 1; } + 50% { opacity: 0; } + 80% { opacity: 1; } + 100% { opacity: 1; } +} +@-webkit-keyframes flash {.flash-frames;} /* Safari, Chrome and Opera > 12.1 */ +@-moz-keyframes flash {.flash-frames;} /* Firefox < 16 */ +@-o-keyframes flash {.flash-frames;} /* Opera < 12.1 */ +@-ms-keyframes flash {.flash-frames;} /* Internet Explorer */ +@keyframes flash {.flash-frames;} + +/* ============ fadein ============ */ +.fadein-frames () { + from { opacity: 0; } + to { opacity: 1; } +} +@-webkit-keyframes fadein {.fadein-frames;} /* Safari, Chrome and Opera > 12.1 */ +@-moz-keyframes fadein {.fadein-frames;} /* Firefox < 16 */ +@-o-keyframes fadein {.fadein-frames;} /* Opera < 12.1 */ +@-ms-keyframes fadein {.fadein-frames;} /* Internet Explorer */ +@keyframes fadein {.fadein-frames;} + +/* ============ fadeout ============ */ +.fadeout-frames () { + from { opacity: 1; } + to { opacity: 0; } +} +@-webkit-keyframes fadeout {.fadeout-frames;} /* Safari, Chrome and Opera > 12.1 */ +@-moz-keyframes fadeout {.fadeout-frames;} /* Firefox < 16 */ +@-o-keyframes fadeout {.fadeout-frames;} /* Opera < 12.1 */ +@-ms-keyframes fadeout {.fadeout-frames;} /* Internet Explorer */ +@keyframes fadeout {.fadeout-frames;} |