Utilised mixins rather than specific WebKit properties

diff --git a/dist/css/bootstrap.css b/dist/css/bootstrap.css
index 132bffa622197f4c6cac737fd13cd376d969a365..5b2afc0f791cb1732df2060f095c25c79892e475 100644 (file)
--- a/dist/css/bootstrap.css
+++ b/dist/css/bootstrap.css
@@ -5776,6 +5776,47 @@ button.close {
     bottom: 20px;
   }
 }
+@media all and (-webkit-transform-3d) {
+  .carousel .item {
+    -webkit-transition: -webkit-transform .6s ease-in-out;
+         -o-transition:      -o-transform .6s ease-in-out;
+            transition:         transform .6s ease-in-out;
+
+    -webkit-backface-visibility: hidden;
+        -ms-backface-visibility: hidden;
+         -o-backface-visibility: hidden;
+            backface-visibility: hidden;
+    -webkit-perspective: 1000;
+        -ms-perspective: 1000;
+         -o-perspective: 1000;
+            perspective: 1000;
+  }
+  .carousel .item.next,
+  .carousel .item.active.right {
+    left: 0;
+    -webkit-transform: translate3d(100%, 0, 0);
+        -ms-transform: translate3d(100%, 0, 0);
+         -o-transform: translate3d(100%, 0, 0);
+            transform: translate3d(100%, 0, 0);
+  }
+  .carousel .item.prev,
+  .carousel .item.active.left {
+    left: 0;
+    -webkit-transform: translate3d(-100%, 0, 0);
+        -ms-transform: translate3d(-100%, 0, 0);
+         -o-transform: translate3d(-100%, 0, 0);
+            transform: translate3d(-100%, 0, 0);
+  }
+  .carousel .item.next.left,
+  .carousel .item.prev.right,
+  .carousel .item.active {
+    left: 0;
+    -webkit-transform: translate3d(0%, 0, 0);
+        -ms-transform: translate3d(0%, 0, 0);
+         -o-transform: translate3d(0%, 0, 0);
+            transform: translate3d(0%, 0, 0);
+  }
+}
 .clearfix:before,
 .clearfix:after,
 .dl-horizontal dd:before,

diff --git a/less/carousel.less b/less/carousel.less
index 9a374a4476a66230ab0a6ea1bd554f56535ac950..1714abdec3bc1f6ae10f55a3f5fd83fea75f828f 100644 (file)
--- a/less/carousel.less
+++ b/less/carousel.less
@@ -235,19 +235,19 @@
 @media all and (-webkit-transform-3d) {
   .carousel {
     .item {
-      -webkit-transition: 0.6s -webkit-transform ease-in-out;
-      -webkit-backface-visibility: hidden;
-      -webkit-perspective: 1000;
+      .transition-transform(~'0.6s ease-in-out');
+      .backface-visibility(~'hidden');
+      .perspective(1000);
       &.next, &.active.right {
-        -webkit-transform: translate3d(100%,0,0);
+        .translate3d(100%, 0, 0);
         left: 0;
       }
       &.prev, &.active.left {
-        -webkit-transform: translate3d(-100%,0,0);
+        .translate3d(-100%, 0, 0);
         left: 0;
       }
       &.next.left, &.prev.right, &.active {
-        -webkit-transform: translate3d(0%,0,0);
+        .translate3d(0%, 0, 0);
         left: 0;
       }
     }