Post Grid - Version 1.6

Version Description

  • 13/05/2015 add- Custom CSS box.
    • 13/05/2015 edit- Improved Grid Builder.
    • 13/05/2015 add- hover animation for hover items.
    • 13/05/2015 add- display thumbnail via External Featured Image(meta key).
Download this release

Release Info

Developer paratheme
Plugin Icon 128x128 Post Grid
Version 1.6
Comparing to
See all releases

Code changes from version 1.5 to 1.6

Files changed (55) hide show
  1. ParaAdmin/css/ParaAdmin.css +98 -164
  2. ParaAdmin/css/ParaDashboard.css +83 -0
  3. ParaAdmin/js/ParaAdmin.js +13 -1
  4. admin/css/style.css +1 -12
  5. admin/js/scripts.js +1 -13
  6. css/ajax-loader.gif +0 -0
  7. css/animate.css +3272 -0
  8. css/font-awesome.css +1672 -0
  9. css/icons/author.png +0 -0
  10. css/icons/comments.png +0 -0
  11. css/icons/free-16-24.png +0 -0
  12. css/icons/time.png +0 -0
  13. css/images/arrow-next.png +0 -0
  14. css/images/arrow-prev.png +0 -0
  15. css/images/link.png +0 -0
  16. css/images/quote.png +0 -0
  17. css/owl.carousel.css +71 -0
  18. css/owl.theme.css +79 -0
  19. css/style-woocommerce.css +99 -0
  20. css/style.css +183 -10
  21. fonts/FontAwesome.otf +0 -0
  22. fonts/fontawesome-webfont.eot +0 -0
  23. fonts/fontawesome-webfont.svg +520 -0
  24. fonts/fontawesome-webfont.ttf +0 -0
  25. fonts/fontawesome-webfont.woff +0 -0
  26. grid-items/ajax.php +12 -0
  27. grid-items/content.php +21 -0
  28. grid-items/custom-css.php +17 -0
  29. grid-items/hover_items.php +64 -0
  30. grid-items/meta.php +76 -0
  31. grid-items/meta_fields.php +73 -0
  32. grid-items/pagination.php +50 -0
  33. grid-items/post_title.php +25 -0
  34. grid-items/query.php +45 -0
  35. grid-items/scripts.php +39 -0
  36. grid-items/social.php +34 -0
  37. grid-items/thumbnail.php +97 -0
  38. grid-items/variables.php +125 -0
  39. grid-items/woocommerce.php +42 -0
  40. includes/PostGridClass.php +309 -76
  41. includes/class-functions.php +104 -0
  42. includes/class-settings.php +40 -0
  43. includes/class-shortcodes.php +63 -0
  44. post-grid-help.php → includes/menu/post-grid-settings.php +30 -69
  45. includes/post-grid-functions.php +43 -89
  46. includes/post-grid-meta.php +229 -227
  47. js/color-picker.js +10 -0
  48. js/owl.carousel.js +1512 -0
  49. js/scripts.js +126 -0
  50. post-grid.php +85 -134
  51. readme.txt +24 -7
  52. themes/flat/index.php +89 -488
  53. themes/flat/style.css +7 -7
  54. themes/rounded/index.php +45 -446
  55. themes/rounded/style.css +64 -5
ParaAdmin/css/ParaAdmin.css CHANGED
@@ -33,6 +33,14 @@
33
margin: 10px 0;
34
}
35
36
.para-settings ul.tab-nav {
37
clear: both;
38
margin: 0;
@@ -77,6 +85,19 @@
77
78
79
80
81
82
.para-settings h2 {
@@ -85,6 +106,47 @@
85
margin: 25px 0;
86
}
87
88
89
90
.para-settings .green {
@@ -103,6 +165,27 @@
103
104
}
105
106
107
108
@@ -166,184 +249,35 @@
166
167
}
168
169
170
- input.switch:empty
171
- {
172
- margin-left: -999px;
173
- }
174
- input.switch:empty ~ label
175
- {
176
- position: relative;
177
- float: left;
178
- line-height: 1.6em;
179
- text-indent: 4em;
180
- margin: 0.2em 0;
181
- cursor: pointer;
182
- -webkit-user-select: none;
183
- -moz-user-select: none;
184
- -ms-user-select: none;
185
- user-select: none;
186
- }
187
-
188
- input.switch:empty ~ label:before,
189
- input.switch:empty ~ label:after
190
- {
191
- position: absolute;
192
- display: block;
193
- top: 0;
194
- bottom: 0;
195
- left: 0;
196
- content: ' ';
197
- width: 3.6em;
198
- background-color: #e4e4e4;
199
- border-radius: 0.3em;
200
- box-shadow: inset 0 0.2em 0 rgba(0,0,0,0.3);
201
- -webkit-transition: all 100ms ease-in;
202
- transition: all 100ms ease-in;
203
- }
204
-
205
- input.switch:empty ~ label:after
206
- {
207
- width: 1.4em;
208
- top: 0.1em;
209
- bottom: 0.1em;
210
- margin-left: 0.1em;
211
- background-color: #fff;
212
- border-radius: 0.15em;
213
- box-shadow: inset 0 -0.2em 0 rgba(0,0,0,0.2);
214
}
215
216
-
217
- input.switch:checked ~ label:before
218
- {
219
- background-color: #69c8ff;
220
}
221
222
- input.switch:checked ~ label:after
223
- {
224
- margin-left: 2em;
225
- }
226
-
227
-
228
-
229
-
230
-
231
-
232
-
233
-
234
-
235
-
236
-
237
-
238
-
239
-
240
-
241
-
242
- /*para-dashboard*/
243
-
244
- .para-dashboard {
245
- background: none repeat scroll 0 0 rgb(91, 116, 145);
246
- padding: 10px;
247
}
248
249
- .para-dashboard .dash-box {
250
- background: none repeat scroll 0 0 rgb(93, 126, 163);
251
- border: 1px solid rgb(122, 170, 223);
252
- display: inline-block;
253
- height: auto;
254
- margin-bottom: 30px;
255
- margin-right: 10px;
256
- margin-top: 0;
257
- overflow: hidden;
258
- padding-bottom: 30px;
259
- vertical-align: top;
260
- width: 350px;
261
- }
262
263
- .para-dashboard .dash-box-title {
264
- background: none repeat scroll 0 0 rgb(100, 140, 186);
265
- color: rgb(255, 255, 255);
266
- font-size: 16px;
267
- font-weight: bold;
268
- line-height: 30px;
269
- padding: 0 10px;
270
- }
271
-
272
- .para-dashboard .dash-box-title .fa {
273
- padding-right: 10px;
274
}
275
-
276
- .para-dashboard .dash-box-info {
277
- color: rgb(238, 238, 238);
278
- font-size: 12px;
279
padding: 10px;
280
}
281
282
- .para-dashboard .dash-box .total-online {
283
- color: rgb(255, 255, 255);
284
- font-size: 40px;
285
- padding: 30px 10px 10px;
286
- text-align: center;
287
- }
288
-
289
- .para-dashboard .dash-box .total-session {
290
- color: rgb(255, 255, 255);
291
- font-size: 40px;
292
- padding: 30px 10px 10px;
293
- text-align: center;
294
- }
295
-
296
-
297
-
298
-
299
- .para-dashboard .dash-box .para-data-table {
300
- border: 1px solid rgb(221, 221, 221);
301
- border-collapse: collapse;
302
- color: rgb(255, 255, 255);
303
- text-align: left;
304
- }
305
-
306
- .para-dashboard .dash-box .para-data-table th {
307
- padding: 7px;
308
- }
309
- .para-dashboard .dash-box tr {
310
- border-bottom: 1px solid rgb(221, 221, 221);
311
- }
312
- .para-dashboard .dash-box .para-data-table td {
313
- padding: 5px;
314
- }
315
-
316
- .para-dashboard .dash-box .para-data-table a {
317
- color: rgb(255, 255, 255);
318
- text-decoration: none;
319
- }
320
-
321
-
322
-
323
-
324
-
325
-
326
-
327
-
328
-
329
-
330
-
331
-
332
-
333
-
334
-
335
-
336
-
337
-
338
339
@media all and (max-width: 799px) {
340
-
341
-
342
-
343
-
344
-
345
-
346
-
347
348
.para-settings ul.tab-nav li {
349
display: block;
33
margin: 10px 0;
34
}
35
36
+ .para-settings .option-box .pro {
37
+ background: none repeat scroll 0 0 rgb(53, 158, 255);
38
+ border-radius: 3px;
39
+ color: rgb(255, 255, 255);
40
+ padding: 0 6px;
41
+ }
42
+
43
+
44
.para-settings ul.tab-nav {
45
clear: both;
46
margin: 0;
85
86
87
88
+ .para-settings ul.voting-bg-img-list{}
89
+
90
+ .para-settings ul.voting-bg-img-list li {
91
+ display: inline-block;
92
+ margin: 5px;
93
+ }
94
+ .para-settings ul.voting-bg-img-list li.bg-selected {}
95
+
96
+ .para-settings ul.voting-bg-img-list li img{border: 2px solid #ffffff;}
97
+
98
+ .para-settings ul.voting-bg-img-list li.bg-selected img{
99
+ border: 2px solid #ff5a11;
100
+ }
101
102
103
.para-settings h2 {
106
margin: 25px 0;
107
}
108
109
+ .para-settings .pricing-table{
110
+
111
+ }
112
+
113
+ .para-settings .pricing-table .column {
114
+ border-bottom: 1px solid #ff9601;
115
+ border-left: 1px solid #ff9601;
116
+ border-top: 1px solid #ff9601;
117
+ display: inline-block;
118
+ float: left;
119
+ text-align: center;
120
+ vertical-align: top;
121
+ width: 48%;
122
+ }
123
+
124
+ .para-settings .pricing-table .column:last-child {
125
+ border-right: 1px solid #ff9601;
126
+ }
127
+
128
+ .para-settings .paln {
129
+
130
+ border-bottom: 1px solid rgb(255, 150, 1);
131
+ display: block;
132
+ font-size: 20px;
133
+ font-weight: bold;
134
+ line-height: 30px;
135
+ padding: 10px 0;
136
+ }
137
+ .para-settings .cell {
138
+ border-bottom: 1px solid rgb(255, 150, 1);
139
+ display: block;
140
+ line-height: 20px;
141
+ padding: 7px 0;
142
+ }
143
+
144
+ .para-settings .hidden-mob {
145
+
146
+ display: none;
147
+
148
+ }
149
+
150
151
152
.para-settings .green {
165
166
}
167
168
+ .para-settings .price {
169
+ font-size: 18px;
170
+ font-weight: bold;
171
+ padding: 25px 0;
172
+ border-bottom: 1px solid rgb(255, 150, 1);
173
+ }
174
+
175
+
176
+ .para-settings .buy-now {
177
+ background: none repeat scroll 0 0 rgb(221, 221, 221);
178
+ border-bottom: 2px solid rgb(157, 157, 157);
179
+ border-radius: 12px;
180
+ padding: 2px 12px;
181
+ text-decoration: none;
182
+ }
183
+
184
+ .para-settings .buy-now:hover {
185
+
186
+ border-bottom: 2px solid #706f6f;
187
+
188
+ }
189
190
191
249
250
}
251
252
+ .para-settings .expandable {
253
254
}
255
256
+ .para-settings .expandable .items {
257
+ background: none repeat scroll 0 0 rgb(255, 255, 255);
258
+ border-bottom: 1px solid rgb(153, 153, 153);
259
+ margin: 2px 0;
260
}
261
262
+ .para-settings .expandable .header {
263
+ background: none repeat scroll 0 0 rgb(255, 255, 255);
264
+ padding: 5px;
265
}
266
267
+ .para-settings .expandable .active .options {
268
+
269
+ display: block;
270
271
}
272
+ .para-settings .expandable .options {
273
+ background: none repeat scroll 0 0 rgb(240, 240, 240);
274
+ display: none;
275
padding: 10px;
276
}
277
278
279
@media all and (max-width: 799px) {
280
+
281
282
.para-settings ul.tab-nav li {
283
display: block;
ParaAdmin/css/ParaDashboard.css ADDED
@@ -0,0 +1,83 @@
1
+ @charset "utf-8";
2
+ /* CSS Document */
3
+
4
+
5
+
6
+ /*para-dashboard*/
7
+
8
+ .para-dashboard {
9
+ background: none repeat scroll 0 0 rgb(91, 116, 145);
10
+ padding: 10px;
11
+ }
12
+
13
+ .para-dashboard .dash-box {
14
+ background: none repeat scroll 0 0 rgb(93, 126, 163);
15
+ border: 1px solid rgb(122, 170, 223);
16
+ display: inline-block;
17
+ height: auto;
18
+ margin-bottom: 30px;
19
+ margin-right: 10px;
20
+ margin-top: 0;
21
+ overflow: hidden;
22
+ padding-bottom: 30px;
23
+ vertical-align: top;
24
+ width: 350px;
25
+ }
26
+
27
+ .para-dashboard .dash-box-title {
28
+ background: none repeat scroll 0 0 rgb(100, 140, 186);
29
+ color: rgb(255, 255, 255);
30
+ font-size: 16px;
31
+ font-weight: bold;
32
+ line-height: 30px;
33
+ padding: 0 10px;
34
+ }
35
+
36
+ .para-dashboard .dash-box-title .fa {
37
+ padding-right: 10px;
38
+ }
39
+
40
+ .para-dashboard .dash-box-info {
41
+ color: rgb(238, 238, 238);
42
+ font-size: 12px;
43
+ padding: 10px;
44
+ }
45
+
46
+ .para-dashboard .dash-box .total-online {
47
+ color: rgb(255, 255, 255);
48
+ font-size: 40px;
49
+ padding: 30px 10px 10px;
50
+ text-align: center;
51
+ }
52
+
53
+ .para-dashboard .dash-box .total-session {
54
+ color: rgb(255, 255, 255);
55
+ font-size: 40px;
56
+ padding: 30px 10px 10px;
57
+ text-align: center;
58
+ }
59
+
60
+
61
+
62
+
63
+ .para-dashboard .dash-box .para-data-table {
64
+ border: 1px solid rgb(221, 221, 221);
65
+ border-collapse: collapse;
66
+ color: rgb(255, 255, 255);
67
+ text-align: left;
68
+ }
69
+
70
+ .para-dashboard .dash-box .para-data-table th {
71
+ padding: 7px;
72
+ }
73
+ .para-dashboard .dash-box tr {
74
+ border-bottom: 1px solid rgb(221, 221, 221);
75
+ }
76
+ .para-dashboard .dash-box .para-data-table td {
77
+ padding: 5px;
78
+ }
79
+
80
+ .para-dashboard .dash-box .para-data-table a {
81
+ color: rgb(255, 255, 255);
82
+ text-decoration: none;
83
+ }
ParaAdmin/js/ParaAdmin.js CHANGED
@@ -3,7 +3,19 @@ jQuery(document).ready(function($)
3
{
4
5
6
-
7
8
9
3
{
4
5
6
+ $(document).on('click', '.expandable .header', function()
7
+ {
8
+ if($(this).parent().hasClass('active'))
9
+ {
10
+ $(this).parent().removeClass('active');
11
+ }
12
+ else
13
+ {
14
+ $(this).parent().addClass('active');
15
+ }
16
+
17
+
18
+ })
19
20
21
admin/css/style.css CHANGED
@@ -75,11 +75,9 @@ border:1px dashed #999;
75
76
77
.post-grid-settings .post-grid-builder .canvas {
78
- background: none repeat scroll 0 0 rgb(230, 230, 230);
79
- border: 1px solid rgb(153, 153, 153);
80
margin: 20px 0;
81
min-height: 100px;
82
- padding: 10px 10px 50px;
83
}
84
85
.post-grid-settings .post-grid-builder .canvas .saved-item {
@@ -105,7 +103,6 @@ border:1px dashed #999;
105
106
.post-grid-settings .post-grid-builder .canvas .saved-item.active .header {
107
border-bottom: 1px solid rgb(153, 153, 153);
108
- margin-bottom: 15px;
109
padding: 7px 10px;
110
}
111
.post-grid-settings .post-grid-builder .canvas .saved-item .options {
@@ -117,14 +114,6 @@ border:1px dashed #999;
117
padding: 7px 10px;
118
}
119
120
- .post-grid-settings .post-grid-builder .canvas .saved-item .remove {
121
- background: none repeat scroll 0 0 rgb(255, 137, 65);
122
- cursor: pointer;
123
- display: inline-block;
124
- float: right;
125
- padding: 0 5px;
126
- position: relative;
127
- }
128
129
.post-grid-settings #post-grid-builder {
130
width: 100%;
75
76
77
.post-grid-settings .post-grid-builder .canvas {
78
margin: 20px 0;
79
min-height: 100px;
80
+
81
}
82
83
.post-grid-settings .post-grid-builder .canvas .saved-item {
103
104
.post-grid-settings .post-grid-builder .canvas .saved-item.active .header {
105
border-bottom: 1px solid rgb(153, 153, 153);
106
padding: 7px 10px;
107
}
108
.post-grid-settings .post-grid-builder .canvas .saved-item .options {
114
padding: 7px 10px;
115
}
116
117
118
.post-grid-settings #post-grid-builder {
119
width: 100%;
admin/js/scripts.js CHANGED
@@ -31,7 +31,7 @@ jQuery(document).ready(function($)
31
32
33
34
- jQuery(".post_grid_taxonomy").click(function()
35
{
36
37
@@ -55,18 +55,6 @@ jQuery(document).ready(function($)
55
56
})
57
58
-
59
-
60
-
61
-
62
- $(document).on('click', '.post-grid-builder .canvas .remove', function()
63
- {
64
- $(this).parent().parent().remove();
65
-
66
- })
67
-
68
-
69
-
70
71
72
31
32
33
34
+ $(".post_grid_taxonomy").click(function()
35
{
36
37
55
56
})
57
58
59
60
css/ajax-loader.gif ADDED
Binary file
css/animate.css ADDED
@@ -0,0 +1,3272 @@
1
+ @charset "UTF-8";
2
+
3
+ /*!
4
+ Animate.css - http://daneden.me/animate
5
+ Licensed under the MIT license - http://opensource.org/licenses/MIT
6
+
7
+ Copyright (c) 2015 Daniel Eden
8
+ */
9
+
10
+ .animated {
11
+ -webkit-animation-duration: 1s;
12
+ animation-duration: 1s;
13
+ -webkit-animation-fill-mode: both;
14
+ animation-fill-mode: both;
15
+ }
16
+
17
+ .animated.infinite {
18
+ -webkit-animation-iteration-count: infinite;
19
+ animation-iteration-count: infinite;
20
+ }
21
+
22
+ .animated.hinge {
23
+ -webkit-animation-duration: 2s;
24
+ animation-duration: 2s;
25
+ }
26
+
27
+ .animated.bounceIn,
28
+ .animated.bounceOut {
29
+ -webkit-animation-duration: .75s;
30
+ animation-duration: .75s;
31
+ }
32
+
33
+ .animated.flipOutX,
34
+ .animated.flipOutY {
35
+ -webkit-animation-duration: .75s;
36
+ animation-duration: .75s;
37
+ }
38
+
39
+ @-webkit-keyframes bounce {
40
+ 0%, 20%, 53%, 80%, 100% {
41
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
42
+ animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
43
+ -webkit-transform: translate3d(0,0,0);
44
+ transform: translate3d(0,0,0);
45
+ }
46
+
47
+ 40%, 43% {
48
+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
49
+ animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
50
+ -webkit-transform: translate3d(0, -30px, 0);
51
+ transform: translate3d(0, -30px, 0);
52
+ }
53
+
54
+ 70% {
55
+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
56
+ animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
57
+ -webkit-transform: translate3d(0, -15px, 0);
58
+ transform: translate3d(0, -15px, 0);
59
+ }
60
+
61
+ 90% {
62
+ -webkit-transform: translate3d(0,-4px,0);
63
+ transform: translate3d(0,-4px,0);
64
+ }
65
+ }
66
+
67
+ @keyframes bounce {
68
+ 0%, 20%, 53%, 80%, 100% {
69
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
70
+ animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
71
+ -webkit-transform: translate3d(0,0,0);
72
+ transform: translate3d(0,0,0);
73
+ }
74
+
75
+ 40%, 43% {
76
+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
77
+ animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
78
+ -webkit-transform: translate3d(0, -30px, 0);
79
+ transform: translate3d(0, -30px, 0);
80
+ }
81
+
82
+ 70% {
83
+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
84
+ animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
85
+ -webkit-transform: translate3d(0, -15px, 0);
86
+ transform: translate3d(0, -15px, 0);
87
+ }
88
+
89
+ 90% {
90
+ -webkit-transform: translate3d(0,-4px,0);
91
+ transform: translate3d(0,-4px,0);
92
+ }
93
+ }
94
+
95
+ .bounce {
96
+ -webkit-animation-name: bounce;
97
+ animation-name: bounce;
98
+ -webkit-transform-origin: center bottom;
99
+ transform-origin: center bottom;
100
+ }
101
+
102
+ @-webkit-keyframes flash {
103
+ 0%, 50%, 100% {
104
+ opacity: 1;
105
+ }
106
+
107
+ 25%, 75% {
108
+ opacity: 0;
109
+ }
110
+ }
111
+
112
+ @keyframes flash {
113
+ 0%, 50%, 100% {
114
+ opacity: 1;
115
+ }
116
+
117
+ 25%, 75% {
118
+ opacity: 0;
119
+ }
120
+ }
121
+
122
+ .flash {
123
+ -webkit-animation-name: flash;
124
+ animation-name: flash;
125
+ }
126
+
127
+ /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
128
+
129
+ @-webkit-keyframes pulse {
130
+ 0% {
131
+ -webkit-transform: scale3d(1, 1, 1);
132
+ transform: scale3d(1, 1, 1);
133
+ }
134
+
135
+ 50% {
136
+ -webkit-transform: scale3d(1.05, 1.05, 1.05);
137
+ transform: scale3d(1.05, 1.05, 1.05);
138
+ }
139
+
140
+ 100% {
141
+ -webkit-transform: scale3d(1, 1, 1);
142
+ transform: scale3d(1, 1, 1);
143
+ }
144
+ }
145
+
146
+ @keyframes pulse {
147
+ 0% {
148
+ -webkit-transform: scale3d(1, 1, 1);
149
+ transform: scale3d(1, 1, 1);
150
+ }
151
+
152
+ 50% {
153
+ -webkit-transform: scale3d(1.05, 1.05, 1.05);
154
+ transform: scale3d(1.05, 1.05, 1.05);
155
+ }
156
+
157
+ 100% {
158
+ -webkit-transform: scale3d(1, 1, 1);
159
+ transform: scale3d(1, 1, 1);
160
+ }
161
+ }
162
+
163
+ .pulse {
164
+ -webkit-animation-name: pulse;
165
+ animation-name: pulse;
166
+ }
167
+
168
+ @-webkit-keyframes rubberBand {
169
+ 0% {
170
+ -webkit-transform: scale3d(1, 1, 1);
171
+ transform: scale3d(1, 1, 1);
172
+ }
173
+
174
+ 30% {
175
+ -webkit-transform: scale3d(1.25, 0.75, 1);
176
+ transform: scale3d(1.25, 0.75, 1);
177
+ }
178
+
179
+ 40% {
180
+ -webkit-transform: scale3d(0.75, 1.25, 1);
181
+ transform: scale3d(0.75, 1.25, 1);
182
+ }
183
+
184
+ 50% {
185
+ -webkit-transform: scale3d(1.15, 0.85, 1);
186
+ transform: scale3d(1.15, 0.85, 1);
187
+ }
188
+
189
+ 65% {
190
+ -webkit-transform: scale3d(.95, 1.05, 1);
191
+ transform: scale3d(.95, 1.05, 1);
192
+ }
193
+
194
+ 75% {
195
+ -webkit-transform: scale3d(1.05, .95, 1);
196
+ transform: scale3d(1.05, .95, 1);
197
+ }
198
+
199
+ 100% {
200
+ -webkit-transform: scale3d(1, 1, 1);
201
+ transform: scale3d(1, 1, 1);
202
+ }
203
+ }
204
+
205
+ @keyframes rubberBand {
206
+ 0% {
207
+ -webkit-transform: scale3d(1, 1, 1);
208
+ transform: scale3d(1, 1, 1);
209
+ }
210
+
211
+ 30% {
212
+ -webkit-transform: scale3d(1.25, 0.75, 1);
213
+ transform: scale3d(1.25, 0.75, 1);
214
+ }
215
+
216
+ 40% {
217
+ -webkit-transform: scale3d(0.75, 1.25, 1);
218
+ transform: scale3d(0.75, 1.25, 1);
219
+ }
220
+
221
+ 50% {
222
+ -webkit-transform: scale3d(1.15, 0.85, 1);
223
+ transform: scale3d(1.15, 0.85, 1);
224
+ }
225
+
226
+ 65% {
227
+ -webkit-transform: scale3d(.95, 1.05, 1);
228
+ transform: scale3d(.95, 1.05, 1);
229
+ }
230
+
231
+ 75% {
232
+ -webkit-transform: scale3d(1.05, .95, 1);
233
+ transform: scale3d(1.05, .95, 1);
234
+ }
235
+
236
+ 100% {
237
+ -webkit-transform: scale3d(1, 1, 1);
238
+ transform: scale3d(1, 1, 1);
239
+ }
240
+ }
241
+
242
+ .rubberBand {
243
+ -webkit-animation-name: rubberBand;
244
+ animation-name: rubberBand;
245
+ }
246
+
247
+ @-webkit-keyframes shake {
248
+ 0%, 100% {
249
+ -webkit-transform: translate3d(0, 0, 0);
250
+ transform: translate3d(0, 0, 0);
251
+ }
252
+
253
+ 10%, 30%, 50%, 70%, 90% {
254
+ -webkit-transform: translate3d(-10px, 0, 0);
255
+ transform: translate3d(-10px, 0, 0);
256
+ }
257
+
258
+ 20%, 40%, 60%, 80% {
259
+ -webkit-transform: translate3d(10px, 0, 0);
260
+ transform: translate3d(10px, 0, 0);
261
+ }
262
+ }
263
+
264
+ @keyframes shake {
265
+ 0%, 100% {
266
+ -webkit-transform: translate3d(0, 0, 0);
267
+ transform: translate3d(0, 0, 0);
268
+ }
269
+
270
+ 10%, 30%, 50%, 70%, 90% {
271
+ -webkit-transform: translate3d(-10px, 0, 0);
272
+ transform: translate3d(-10px, 0, 0);
273
+ }
274
+
275
+ 20%, 40%, 60%, 80% {
276
+ -webkit-transform: translate3d(10px, 0, 0);
277
+ transform: translate3d(10px, 0, 0);
278
+ }
279
+ }
280
+
281
+ .shake {
282
+ -webkit-animation-name: shake;
283
+ animation-name: shake;
284
+ }
285
+
286
+ @-webkit-keyframes swing {
287
+ 20% {
288
+ -webkit-transform: rotate3d(0, 0, 1, 15deg);
289
+ transform: rotate3d(0, 0, 1, 15deg);
290
+ }
291
+
292
+ 40% {
293
+ -webkit-transform: rotate3d(0, 0, 1, -10deg);
294
+ transform: rotate3d(0, 0, 1, -10deg);
295
+ }
296
+
297
+ 60% {
298
+ -webkit-transform: rotate3d(0, 0, 1, 5deg);
299
+ transform: rotate3d(0, 0, 1, 5deg);
300
+ }
301
+
302
+ 80% {
303
+ -webkit-transform: rotate3d(0, 0, 1, -5deg);
304
+ transform: rotate3d(0, 0, 1, -5deg);
305
+ }
306
+
307
+ 100% {
308
+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
309
+ transform: rotate3d(0, 0, 1, 0deg);
310
+ }
311
+ }
312
+
313
+ @keyframes swing {
314
+ 20% {
315
+ -webkit-transform: rotate3d(0, 0, 1, 15deg);
316
+ transform: rotate3d(0, 0, 1, 15deg);
317
+ }
318
+
319
+ 40% {
320
+ -webkit-transform: rotate3d(0, 0, 1, -10deg);
321
+ transform: rotate3d(0, 0, 1, -10deg);
322
+ }
323
+
324
+ 60% {
325
+ -webkit-transform: rotate3d(0, 0, 1, 5deg);
326
+ transform: rotate3d(0, 0, 1, 5deg);
327
+ }
328
+
329
+ 80% {
330
+ -webkit-transform: rotate3d(0, 0, 1, -5deg);
331
+ transform: rotate3d(0, 0, 1, -5deg);
332
+ }
333
+
334
+ 100% {
335
+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
336
+ transform: rotate3d(0, 0, 1, 0deg);
337
+ }
338
+ }
339
+
340
+ .swing {
341
+ -webkit-transform-origin: top center;
342
+ transform-origin: top center;
343
+ -webkit-animation-name: swing;
344
+ animation-name: swing;
345
+ }
346
+
347
+ @-webkit-keyframes tada {
348
+ 0% {
349
+ -webkit-transform: scale3d(1, 1, 1);
350
+ transform: scale3d(1, 1, 1);
351
+ }
352
+
353
+ 10%, 20% {
354
+ -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
355
+ transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
356
+ }
357
+
358
+ 30%, 50%, 70%, 90% {
359
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
360
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
361
+ }
362
+
363
+ 40%, 60%, 80% {
364
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
365
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
366
+ }
367
+
368
+ 100% {
369
+ -webkit-transform: scale3d(1, 1, 1);
370
+ transform: scale3d(1, 1, 1);
371
+ }
372
+ }
373
+
374
+ @keyframes tada {
375
+ 0% {
376
+ -webkit-transform: scale3d(1, 1, 1);
377
+ transform: scale3d(1, 1, 1);
378
+ }
379
+
380
+ 10%, 20% {
381
+ -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
382
+ transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
383
+ }
384
+
385
+ 30%, 50%, 70%, 90% {
386
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
387
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
388
+ }
389
+
390
+ 40%, 60%, 80% {
391
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
392
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
393
+ }
394
+
395
+ 100% {
396
+ -webkit-transform: scale3d(1, 1, 1);
397
+ transform: scale3d(1, 1, 1);
398
+ }
399
+ }
400
+
401
+ .tada {
402
+ -webkit-animation-name: tada;
403
+ animation-name: tada;
404
+ }
405
+
406
+ /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
407
+
408
+ @-webkit-keyframes wobble {
409
+ 0% {
410
+ -webkit-transform: none;
411
+ transform: none;
412
+ }
413
+
414
+ 15% {
415
+ -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
416
+ transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
417
+ }
418
+
419
+ 30% {
420
+ -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
421
+ transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
422
+ }
423
+
424
+ 45% {
425
+ -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
426
+ transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
427
+ }
428
+
429
+ 60% {
430
+ -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
431
+ transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
432
+ }
433
+
434
+ 75% {
435
+ -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
436
+ transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
437
+ }
438
+
439
+ 100% {
440
+ -webkit-transform: none;
441
+ transform: none;
442
+ }
443
+ }
444
+
445
+ @keyframes wobble {
446
+ 0% {
447
+ -webkit-transform: none;
448
+ transform: none;
449
+ }
450
+
451
+ 15% {
452
+ -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
453
+ transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
454
+ }
455
+
456
+ 30% {
457
+ -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
458
+ transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
459
+ }
460
+
461
+ 45% {
462
+ -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
463
+ transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
464
+ }
465
+
466
+ 60% {
467
+ -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
468
+ transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
469
+ }
470
+
471