v2.0.8

animation directions fixed
thatisuday · Oct 9, 2016 · 018b59d · 018b59d
1 parent 12d6c02
commit 018b59d
Show file tree

Hide file tree

Showing 8 changed files with 44 additions and 43 deletions.
diff --git a/dist/ng-image-gallery.css b/dist/ng-image-gallery.css
@@ -20,8 +20,8 @@
             transform: scale(0, 0) translateX(0px); }
   50% {
     opacity: 0.5;
-    -webkit-transform: scale(0.5, 0.5) translateX(-100%);
-            transform: scale(0.5, 0.5) translateX(-100%); }
+    -webkit-transform: scale(0.5, 0.5) translateX(100%);
+            transform: scale(0.5, 0.5) translateX(100%); }
   100% {
     opacity: 1;
     -webkit-transform: scale(1, 1) translateX(0px);
@@ -33,8 +33,8 @@
             transform: scale(0, 0) translateX(0px); }
   50% {
     opacity: 0.5;
-    -webkit-transform: scale(0.5, 0.5) translateX(-100%);
-            transform: scale(0.5, 0.5) translateX(-100%); }
+    -webkit-transform: scale(0.5, 0.5) translateX(100%);
+            transform: scale(0.5, 0.5) translateX(100%); }
   100% {
     opacity: 1;
     -webkit-transform: scale(1, 1) translateX(0px);
@@ -43,8 +43,8 @@
 @-webkit-keyframes revolve-out-forward {
   50% {
     opacity: 0.5;
-    -webkit-transform: scale(0.5, 0.5) translateX(100%);
-            transform: scale(0.5, 0.5) translateX(100%); }
+    -webkit-transform: scale(0.5, 0.5) translateX(-100%);
+            transform: scale(0.5, 0.5) translateX(-100%); }
   100% {
     opacity: 0;
     -webkit-transform: scale(0, 0) translateX(0px);
@@ -53,8 +53,8 @@
 @keyframes revolve-out-forward {
   50% {
     opacity: 0.5;
-    -webkit-transform: scale(0.5, 0.5) translateX(100%);
-            transform: scale(0.5, 0.5) translateX(100%); }
+    -webkit-transform: scale(0.5, 0.5) translateX(-100%);
+            transform: scale(0.5, 0.5) translateX(-100%); }
   100% {
     opacity: 0;
     -webkit-transform: scale(0, 0) translateX(0px);
@@ -67,8 +67,8 @@
             transform: scale(0, 0) translateX(0px); }
   50% {
     opacity: 0.5;
-    -webkit-transform: scale(0.5, 0.5) translateX(100%);
-            transform: scale(0.5, 0.5) translateX(100%); }
+    -webkit-transform: scale(0.5, 0.5) translateX(-100%);
+            transform: scale(0.5, 0.5) translateX(-100%); }
   100% {
     opacity: 1;
     -webkit-transform: scale(1, 1) translateX(0px);
@@ -81,8 +81,8 @@
             transform: scale(0, 0) translateX(0px); }
   50% {
     opacity: 0.5;
-    -webkit-transform: scale(0.5, 0.5) translateX(100%);
-            transform: scale(0.5, 0.5) translateX(100%); }
+    -webkit-transform: scale(0.5, 0.5) translateX(-100%);
+            transform: scale(0.5, 0.5) translateX(-100%); }
   100% {
     opacity: 1;
     -webkit-transform: scale(1, 1) translateX(0px);
@@ -91,8 +91,8 @@
 @-webkit-keyframes revolve-out-backward {
   50% {
     opacity: 0.5;
-    -webkit-transform: scale(0.5, 0.5) translateX(-100%);
-            transform: scale(0.5, 0.5) translateX(-100%); }
+    -webkit-transform: scale(0.5, 0.5) translateX(100%);
+            transform: scale(0.5, 0.5) translateX(100%); }
   100% {
     opacity: 0;
     -webkit-transform: scale(0, 0) translateX(0px);
@@ -101,8 +101,8 @@
 @keyframes revolve-out-backward {
   50% {
     opacity: 0.5;
-    -webkit-transform: scale(0.5, 0.5) translateX(-100%);
-            transform: scale(0.5, 0.5) translateX(-100%); }
+    -webkit-transform: scale(0.5, 0.5) translateX(100%);
+            transform: scale(0.5, 0.5) translateX(100%); }
   100% {
     opacity: 0;
     -webkit-transform: scale(0, 0) translateX(0px);
@@ -317,87 +317,87 @@
             opacity: 0;
             -webkit-transform: scale(0);
                     transform: scale(0); }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-forward .galleria-image.ng-enter {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-backward .galleria-image.ng-enter {
             -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             -webkit-transform: translateX(-100%);
                     transform: translateX(-100%);
             opacity: 0; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-forward .galleria-image.ng-enter-active {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-backward .galleria-image.ng-enter-active {
             -webkit-transform: translateX(0px);
                     transform: translateX(0px);
             opacity: 1; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-forward .galleria-image.ng-leave {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-backward .galleria-image.ng-leave {
             -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-forward .galleria-image.ng-leave-active {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-backward .galleria-image.ng-leave-active {
             opacity: 0;
             -webkit-transform: translateX(100%);
                     transform: translateX(100%); }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-backward .galleria-image.ng-enter {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-forward .galleria-image.ng-enter {
             -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             -webkit-transform: translateX(100%);
                     transform: translateX(100%);
             opacity: 0; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-backward .galleria-image.ng-enter-active {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-forward .galleria-image.ng-enter-active {
             -webkit-transform: translateX(0px);
                     transform: translateX(0px);
             opacity: 1; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-backward .galleria-image.ng-leave {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-forward .galleria-image.ng-leave {
             -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-backward .galleria-image.ng-leave-active {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-slide.img-move-dir-forward .galleria-image.ng-leave-active {
             opacity: 0;
             -webkit-transform: translateX(-100%);
                     transform: translateX(-100%); }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-forward .galleria-image.ng-enter {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-backward .galleria-image.ng-enter {
             -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             -webkit-transform: translateX(-100%) scale(0, 0);
                     transform: translateX(-100%) scale(0, 0);
             opacity: 0; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-forward .galleria-image.ng-enter-active {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-backward .galleria-image.ng-enter-active {
             -webkit-transform: translateX(0px) scale(1, 1);
                     transform: translateX(0px) scale(1, 1);
             opacity: 1; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-forward .galleria-image.ng-leave {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-backward .galleria-image.ng-leave {
             -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-forward .galleria-image.ng-leave-active {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-backward .galleria-image.ng-leave-active {
             opacity: 0;
             -webkit-transform: translateX(100%) scale(0, 0);
                     transform: translateX(100%) scale(0, 0); }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-backward .galleria-image.ng-enter {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-forward .galleria-image.ng-enter {
             -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             -webkit-transform: translateX(100%) scale(0, 0);
                     transform: translateX(100%) scale(0, 0);
             opacity: 0; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-backward .galleria-image.ng-enter-active {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-forward .galleria-image.ng-enter-active {
             -webkit-transform: translateX(0px) scale(1, 1);
                     transform: translateX(0px) scale(1, 1);
             opacity: 1; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-backward .galleria-image.ng-leave {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-forward .galleria-image.ng-leave {
             -webkit-transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
             transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; }
-          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-backward .galleria-image.ng-leave-active {
+          .ng-image-gallery .ng-image-gallery-modal .ng-image-gallery-content .galleria .galleria-images.img-anim-pop.img-move-dir-forward .galleria-image.ng-leave-active {
             opacity: 0;
             -webkit-transform: translateX(-100%) scale(0, 0);
                     transform: translateX(-100%) scale(0, 0); }

diff --git a/dist/ng-image-gallery.min.css b/dist/ng-image-gallery.min.css
diff --git a/dist/ng-image-gallery.min.css.gz b/dist/ng-image-gallery.min.css.gz
diff --git a/dist/ng-image-gallery.min.css.map b/dist/ng-image-gallery.min.css.map
diff --git a/dist/ng-image-gallery.min.css.map.gz b/dist/ng-image-gallery.min.css.map.gz
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ng-image-gallery",
-  "version": "v2.0.7",
+  "version": "v2.0.8",
   "description": "Probably the best angular inline and modal image gallery combined...",
   "main": "dist/ng-image-gallery.js",
   "directories": {

diff --git a/src/sass/animations.scss b/src/sass/animations.scss
@@ -16,6 +16,7 @@
 
 /*********************************************/
 
+
 @keyframes revolve-in-forward{
 	0%{
 		opacity: 0;
@@ -24,7 +25,7 @@
 
 	50%{
 		opacity: 0.5;
-		transform: scale(0.5,0.5) translateX(-100%);
+		transform: scale(0.5,0.5) translateX(100%);
 	}
 
 	100%{
@@ -35,7 +36,7 @@
 @keyframes revolve-out-forward{
 	50%{
 		opacity: 0.5;
-		transform: scale(0.5,0.5) translateX(100%);
+		transform: scale(0.5,0.5) translateX(-100%);
 	}
 
 	100%{
@@ -52,7 +53,7 @@
 
 	50%{
 		opacity: 0.5;
-		transform: scale(0.5,0.5) translateX(100%);
+		transform: scale(0.5,0.5) translateX(-100%);
 	}
 
 	100%{
@@ -63,7 +64,7 @@
 @keyframes revolve-out-backward{
 	50%{
 		opacity: 0.5;
-		transform: scale(0.5,0.5) translateX(-100%);
+		transform: scale(0.5,0.5) translateX(100%);
 	}
 
 	100%{

diff --git a/src/sass/directive.scss b/src/sass/directive.scss
@@ -265,7 +265,7 @@
 
 					// image slide animation
 					&.img-anim-slide{
-						&.img-move-dir-forward{
+						&.img-move-dir-backward{
 							.galleria-image{
 								&.ng-enter{
 									transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
@@ -285,7 +285,7 @@
 								}
 							}
 						}
-						&.img-move-dir-backward{
+						&.img-move-dir-forward{
 							.galleria-image{
 								&.ng-enter{
 									transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
@@ -309,7 +309,7 @@
 
 					// image pop animation
 					&.img-anim-pop{
-						&.img-move-dir-forward{
+						&.img-move-dir-backward{
 							.galleria-image{
 								&.ng-enter{
 									transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
@@ -329,7 +329,7 @@
 								}
 							}
 						}
-						&.img-move-dir-backward{
+						&.img-move-dir-forward{
 							.galleria-image{
 								&.ng-enter{
 									transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;