Updating animation css

src/definitions/modules/sidebar.less

@@ -282,176 +282,40 @@
 .pushable > .ui.push.sidebar.outward ~ .pusher {
   transform: translate3d(0px, 0, 0);
 }
-.pushable > .push.ui.sidebar {
+
+/*--- Left ---*/
+
+/* Set-Up */
+.pushable > .ui.left.push.sidebar {
   transform: translate3d(-100%, 0, 0);
   transition: transform @duration @easing;
 }
 
 /* Pushed */
-.pushable.pushed > .visible.ui.push.sidebar {
+.pushable.pushed > .visible.ui.left.push.sidebar {
   transform: translate3d(0%, 0, 0);
 }
 .pushable.pushed > .visible.ui.left.push.sidebar ~ .fixed,
 .pushable.pushed > .visible.ui.left.push.sidebar ~ .pusher {
   transform: translate3d(@sidebarWidth, 0, 0);
 }
-.pushable.pushed > .visible.ui.right.push.sidebar ~ .fixed,
-.pushable.pushed > .visible.ui.right.push.sidebar ~ .pusher {
-  transform: translate3d(-@sidebarWidth, 0, 0);
-}
-
-
-/*--------------
-    Uncover
----------------*/
-
-/* Set-up */
-.pushable.uncover > .fixed,
-.pushable.uncover > .pusher {
-  transform: translate3d(0px, 0px, 0px);
-}
-.pushable.uncover > .pusher {
-  z-index: @bottomLayer;
-}
-.pushable.uncover > .visible.ui.sidebar {
-  transition: none;
-}
-
-/* Pushed */
-
-/*--- Left ---*/
-.pushable.left.uncover.pushed > .fixed,
-.pushable.left.uncover.pushed > .pusher {
-  transform: translate3d(@sidebarWidth, 0, 0);
-}
 
 /*--- Right ---*/
-.pushable.right.uncover.pushed > .fixed,
-.pushable.right.uncover.pushed > .pusher {
-  transform: translate3d(-@sidebarWidth, 0, 0);
-}
-
-/*--------------
-   Slide Along
----------------*/
-
-/* Set-up */
-.pushable.slide.along > .fixed,
-.pushable.slide.along > .pusher {
-  transform: translate3d(0px, 0, 0);
-}
-.pushable.slide.along > .pusher {
-  z-index: @bottomLayer;
-}
-.pushable.slide.along > .visible.ui.sidebar {
-  transform: translate3d(-50%, 0, 0);
-}
 
-/* Pushed */
-.pushable.slide.along.pushed > .fixed,
-.pushable.slide.along.pushed > .pusher {
-  transform: translate3d(@sidebarWidth, 0, 0);
-}
-.pushable.slide.along.pushed > .visible.ui.sidebar {
-  transform: translate3d(0%, 0, 0);
-}
-
-.pushable.slide.along.inward > .visible.ui.sidebar,
-.pushable.slide.along.outward > .visible.ui.sidebar {
+/* Set-Up */
+.pushable > .ui.right.push.sidebar {
+  transform: translate3d(100%, 0, 0);
   transition: transform @duration @easing;
 }
 
-
-/*--------------
-   Slide Out
----------------*/
-
-/* Set-up */
-.pushable.slide.out > .fixed,
-.pushable.slide.out > .pusher {
-  transform: translate3d(0px, 0, 0);
-}
-.pushable.slide.out > .visible.ui.sidebar {
-  transform: translate3d(50%, 0, 0);
-}
-
 /* Pushed */
-.pushable.slide.out.pushed > .fixed,
-.pushable.slide.out.pushed > .pusher {
-  transform: translate3d(@sidebarWidth, 0, 0);
-}
-.pushable.slide.out.pushed .visible.ui.sidebar {
+.pushable.pushed > .visible.ui.right.push.sidebar {
   transform: translate3d(0%, 0, 0);
 }
-
-.pushable.slide.out.inward > .visible.ui.sidebar,
-.pushable.slide.out.outward > .visible.ui.sidebar {
-  transition: transform @duration @easing;
-}
-
-/*--------------
-   Scale Down
----------------*/
-
-/* Set-up */
-.pushable.scale.down > .fixed {
-  transform: translate3d(0px, 0, 0);
-}
-.pushable.scale.down > .pusher {
-  z-index: @bottomLayer;
-  transform-origin: 75% 50%;
-  overflow: hidden;
-}
-.pushable.scale.down > .visible.ui.sidebar {
-  transform: translate3d(-100%, 0, 0);
-  z-index: @topLayer;
-}
-
-/* Pushed */
-.pushable.scale.down.pushed > .pusher {
-  transform: scale(0.75);
-}
-.pushable.scale.down.pushed > .visible.ui.sidebar {
-  transform: translate3d(0, 0, 0);
-}
-.pushable.scale.down.pushed > .fixed {
-  transform: translate3d(@sidebarWidth, 0, 0);
-}
-
-/* 3D transition cant have duration set until animation */
-.pushable.scale.down.inward > .visible.ui.sidebar,
-.pushable.scale.down.outward > .visible.ui.sidebar {
-  transition: transform @duration @easing;
+.pushable.pushed > .visible.ui.right.push.sidebar ~ .fixed,
+.pushable.pushed > .visible.ui.right.push.sidebar ~ .pusher {
+  transform: translate3d(-@sidebarWidth, 0, 0);
 }
 
-/*--------------
-    Safe Mode
----------------*/
-
-/* Set-Up */
-.pushable.safe > .pusher {
-  position: relative;
-  transform: none !important;
-  transition: none !important;
-}
-.pushable.safe > .pusher {
-  transform: none !important;
-  transition: none !important;
-}
+/*--- Top ---*/
 
-/* Pushed */
-.pushable.safe.pushed  {
-  margin-left: @sidebarWidth !important;
-}
-.pushable.safe.pushed > .visible.ui.sidebar {
-  margin-left: -@sidebarWidth;
-}
-.pushable.safe.pushed > .fixed {
-  margin-left: @sidebarWidth !important;
-}
-.pushable.safe.inward,
-.pushable.safe.outward,
-.pushable.safe.inward > .fixed,
-.pushable.safe.outward > .fixed {
-  transition: margin @duration @easing !important;
-}