1 files changed, 4 insertions, 10 deletions
diff --git a/src/scss/utils/mixins/_bottom-bar.scss b/src/scss/utils/mixins/_bottom-bar.scss
index 91c7cbb..4552f3b 100755
--- a/src/scss/utils/mixins/_bottom-bar.scss
+++ b/src/scss/utils/mixins/_bottom-bar.scss
@@ -27,26 +27,20 @@
 
 /// Mixin helper to pushed bottom bar from medium sidebar size
 @mixin bottom-bar-pushed-md {
-    @include prefix(transition, 'width 0.5s, margin-left 0.5s', 'webkit' 'moz');
     &.pushed {
-        margin-left: #{map-get($sidebar, md-screen-width)};
-        width: calc(100% - #{map-get($sidebar, md-screen-width)});
+        @include prefix(transform, translate3d(#{map-get($sidebar, md-screen-width)}, 0, 0), 'webkit' 'moz');
     }
 }
 
 /// Mixin helper to pushed bottom bar from large sidebar size
 @mixin bottom-bar-pushed-lg {
-    @include prefix(transition, 'width 0.5s, margin-left 0.5s', 'webkit' 'moz');
     &.pushed {
-        margin-left: #{map-get($sidebar, lg-screen-width)};
-        width: calc(100% - #{map-get($sidebar, lg-screen-width)});
+        @include prefix(transform, translate3d(#{map-get($sidebar, lg-screen-width)}, 0, 0), 'webkit' 'moz');
     }
 }
 /// Mixin helper to pushed bottom bar from extra large sidebar size
 @mixin bottom-bar-pushed-xlg {
-    @include prefix(transition, 'width 0.5s, margin-left 0.5s', 'webkit' 'moz');
     &.pushed {
-        margin-left: #{map-get($sidebar, xlg-screen-width)};
-        width: calc(100% - #{map-get($sidebar, xlg-screen-width)});
+        @include prefix(transform, translate3d(#{map-get($sidebar, xlg-screen-width)}, 0, 0), 'webkit' 'moz');
     }
-}
-\ No newline at end of file
+}