diff options
Diffstat (limited to 'js/panels/presets/default-animation-presets.js')
| -rw-r--r-- | js/panels/presets/default-animation-presets.js | 79 |
1 files changed, 62 insertions, 17 deletions
diff --git a/js/panels/presets/default-animation-presets.js b/js/panels/presets/default-animation-presets.js index 10a3e906..2e656e86 100644 --- a/js/panels/presets/default-animation-presets.js +++ b/js/panels/presets/default-animation-presets.js | |||
| @@ -18,23 +18,23 @@ exports.animationPresets = { | |||
| 18 | "-webkit-animation": "border-morph 2s infinite" | 18 | "-webkit-animation": "border-morph 2s infinite" |
| 19 | } | 19 | } |
| 20 | }, | 20 | }, |
| 21 | { | 21 | { |
| 22 | "isKeyFrameRule": true, | 22 | "isKeyFrameRule": true, |
| 23 | "keys" : [{ | 23 | "keys" : [{ |
| 24 | "keyText": "0%", | 24 | "keyText": "0%", |
| 25 | "styles": { "border-radius": "0" } | 25 | "styles": { "border-radius": "0" } |
| 26 | }, { | 26 | }, { |
| 27 | "keyText": "50%", | 27 | "keyText": "50%", |
| 28 | "styles": { | 28 | "styles": { |
| 29 | "border-radius": "100%" | 29 | "border-radius": "100%" |
| 30 | } | 30 | } |
| 31 | }, { | 31 | }, { |
| 32 | "keyText": "100%", | 32 | "keyText": "100%", |
| 33 | "styles": { | 33 | "styles": { |
| 34 | "border-radius": "0%" | 34 | "border-radius": "0%" |
| 35 | } | 35 | } |
| 36 | }] | ||
| 36 | }] | 37 | }] |
| 37 | }] | ||
| 38 | }] | 38 | }] |
| 39 | }, { | 39 | }, { |
| 40 | "text": "3D Animations", | 40 | "text": "3D Animations", |
| @@ -50,7 +50,7 @@ exports.animationPresets = { | |||
| 50 | "-webkit-animation-iteration-count": "infinite", | 50 | "-webkit-animation-iteration-count": "infinite", |
| 51 | "-webkit-animation-direction": "normal", | 51 | "-webkit-animation-direction": "normal", |
| 52 | "-webkit-animation-timing-function": "ease-out", | 52 | "-webkit-animation-timing-function": "ease-out", |
| 53 | "-webkit-transform-origin": "200% 50%", | 53 | "-webkit-transform-origin": "100% 50%", |
| 54 | "-webkit-transform-style": "preserve-3d", | 54 | "-webkit-transform-style": "preserve-3d", |
| 55 | "-webkit-transform": "perspective(1000)", | 55 | "-webkit-transform": "perspective(1000)", |
| 56 | "-webkit-animation-delay": "0s" | 56 | "-webkit-animation-delay": "0s" |
| @@ -89,6 +89,51 @@ exports.animationPresets = { | |||
| 89 | } | 89 | } |
| 90 | }] | 90 | }] |
| 91 | }] | 91 | }] |
| 92 | }, | ||
| 93 | { | ||
| 94 | "text": "Rotate with Fade In", | ||
| 95 | "selectorBase" : "rotate-with-fade-in", | ||
| 96 | "rules" : [{ | ||
| 97 | "selectorSuffix" : "", | ||
| 98 | "styles" : { | ||
| 99 | "-webkit-animation-name": "rotate-with-fade-in", | ||
| 100 | "-webkit-animation-duration": "5s", | ||
| 101 | "-webkit-animation-iteration-count": "infinite", | ||
| 102 | "-webkit-animation-direction": "normal", | ||
| 103 | "-webkit-animation-timing-function": "ease-out", | ||
| 104 | "-webkit-transform-origin": "100% 50%", | ||
| 105 | "-webkit-transform-style": "preserve-3d", | ||
| 106 | "-webkit-transform": "perspective(1000)", | ||
| 107 | "-webkit-animation-delay": "0s" | ||
| 108 | } | ||
| 109 | },{ | ||
| 110 | "isKeyFrameRule": true, | ||
| 111 | "keys" : [{ | ||
| 112 | "keyText": "0%", | ||
| 113 | "styles": { | ||
| 114 | "opacity": "0", | ||
| 115 | "-webkit-transform": "perspective(1000) rotateY(-90deg)" | ||
| 116 | } | ||
| 117 | }, { | ||
| 118 | "keyText": "15%", | ||
| 119 | "styles": { | ||
| 120 | "opacity": "1", | ||
| 121 | "-webkit-transform": "perspective(1000) rotateY(0deg)" | ||
| 122 | } | ||
| 123 | }, { | ||
| 124 | "keyText": "85%", | ||
| 125 | "styles": { | ||
| 126 | "opacity": "1", | ||
| 127 | "-webkit-transform": "perspective(1000) rotateY(0deg)" | ||
| 128 | } | ||
| 129 | }, { | ||
| 130 | "keyText": "100%", | ||
| 131 | "styles": { | ||
| 132 | "opacity": "0", | ||
| 133 | "-webkit-transform": "perspective(1000) rotateY(95deg)" | ||
| 134 | } | ||
| 135 | }] | ||
| 136 | }] | ||
| 92 | }] | 137 | }] |
| 93 | }] | 138 | }] |
| 94 | }; \ No newline at end of file | 139 | }; \ No newline at end of file |