Commit a4cb3a157eabbd5b204abb838fe60fac69981ff3
1 parent
c68c1dba2c
Exists in
master
Agregada animacion.
Showing
1 changed file
with
37 additions
and
2 deletions
Show diff stats
src/assets/scss/animation.scss
| ... | ... | @@ -37,12 +37,47 @@ |
| 37 | 37 | } |
| 38 | 38 | } |
| 39 | 39 | |
| 40 | -@-o-keyframes fadein { | |
| 41 | - /* Opera */ | |
| 40 | +.fade-left { | |
| 41 | + margin-top: 25px; | |
| 42 | + font-size: 21px; | |
| 43 | + text-align: center; | |
| 44 | + animation: fadeleft 1s; | |
| 45 | + -moz-animation: fadeleft 1s; /* Firefox */ | |
| 46 | + -webkit-animation: fadeleft 1s; /* Safari and Chrome */ | |
| 47 | + -o-animation: fadeleft 1s; /* Opera */ | |
| 48 | +} | |
| 49 | + | |
| 50 | +@keyframes fadeleft { | |
| 51 | + from { | |
| 52 | + opacity: 0; | |
| 53 | + transform: translateX(-20px); | |
| 54 | + } | |
| 55 | + to { | |
| 56 | + opacity: 1; | |
| 57 | + transform: translateX(0); | |
| 58 | + } | |
| 59 | +} | |
| 60 | + | |
| 61 | +@-moz-keyframes fadeleft { | |
| 62 | + /* Firefox */ | |
| 63 | + from { | |
| 64 | + opacity: 0; | |
| 65 | + -moz-transform: translateX(-20px); | |
| 66 | + } | |
| 67 | + to { | |
| 68 | + opacity: 1; | |
| 69 | + -moz-transform: translateX(0); | |
| 70 | + } | |
| 71 | +} | |
| 72 | + | |
| 73 | +@-webkit-keyframes fadeleft { | |
| 74 | + /* Safari and Chrome */ | |
| 42 | 75 | from { |
| 43 | 76 | opacity: 0; |
| 77 | + -webkit-transform: translateX(-20px); | |
| 44 | 78 | } |
| 45 | 79 | to { |
| 46 | 80 | opacity: 1; |
| 81 | + -webkit-transform: translateX(0); | |
| 47 | 82 | } |
| 48 | 83 | } |