aboutsummaryrefslogtreecommitdiff
path: root/js/panels/presets/default-animation-presets.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/presets/default-animation-presets.js')
-rw-r--r--js/panels/presets/default-animation-presets.js79
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