diff options
| author |   Michael Lando <ml636r@att.com> | 2017-06-09 03:19:04 +0300 |
|---|---|---|
| committer | Michael Lando <ml636r@att.com> | 2017-06-09 03:19:04 +0300 |
| commit | ed64b5edff15e702493df21aa3230b81593e6133 (patch) | |
| tree | a4cb01fdaccc34930a8db403a3097c0d1e40914b /catalog-ui/src/assets/styles/animation.less | |
| parent | 280f8015d06af1f41a3ef12e8300801c7a5e0d54 (diff) | |
[SDC-29] catalog 1707 rebase commit.
Change-Id: I43c3dc5cf44abf5da817649bc738938a3e8388c1
Signed-off-by: Michael Lando <ml636r@att.com>
Diffstat (limited to 'catalog-ui/src/assets/styles/animation.less')
| -rw-r--r-- | catalog-ui/src/assets/styles/animation.less | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/catalog-ui/src/assets/styles/animation.less b/catalog-ui/src/assets/styles/animation.less new file mode 100644 index 0000000000..014b33a454 --- /dev/null +++ b/catalog-ui/src/assets/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;} |