diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-list-view.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-list-view.less index 1cf8f0e577..ebd56ca287 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-list-view.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-mini-list-view.less @@ -29,4 +29,62 @@ opacity: 1; text-decoration: none; color: @black; +} + +/* Animations */ + +/* Forward */ + +.umb-mini-list-view--forward-enter, +.umb-mini-list-view--forward-leave +{ + transition: 120ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; + position: relative; + display: block; +} + +.umb-mini-list-view--forward-enter { + left: 100%; +} + +.umb-mini-list-view--forward-enter.umb-mini-list-view--forward-enter-active { + left: 0; + opacity: 1; +} + +.umb-mini-list-view--forward-leave { + left: 0; +} + +.umb-mini-list-view--forward-leave.umb-mini-list-view--forward-leave-active{ + left: -100%; + opacity: 0; +} + +/* Backwards */ + +.umb-mini-list-view--backwards-enter, +.umb-mini-list-view--backwards-leave +{ + transition: 120ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; + position: relative; + display: block; +} + +.umb-mini-list-view--backwards-enter { + right: 100%; +} + +.umb-mini-list-view--backwards-enter.umb-mini-list-view--backwards-enter-active { + right: 0; + opacity: 1; +} + +.umb-mini-list-view--backwards-leave { + left: 0; +} + +.umb-mini-list-view--backwards-leave.umb-mini-list-view--backwards-leave-active{ + right: -100%; + opacity: 0; } \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-table.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-table.less index f51536ae24..35d8f2513e 100644 --- a/src/Umbraco.Web.UI.Client/src/less/components/umb-table.less +++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-table.less @@ -292,60 +292,4 @@ input.umb-table__input { font-size: 20px; } -} - - -/* Forward */ -.animate-enter, -.animate-leave -{ - transition: 120ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; - position: relative; - display: block; -} - -.animate-enter { - left: 100%; -} - -.animate-enter.animate-enter-active { - left: 0; - opacity: 1; -} - -.animate-leave { - left: 0; -} - -.animate-leave.animate-leave-active{ - left: -100%; - opacity: 0; -} - -/* Backwards */ - -.animate-reverse-enter, -.animate-reverse-leave -{ - transition: 120ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all; - position: relative; - display: block; -} - -.animate-reverse-enter { - right: 100%; -} - -.animate-reverse-enter.animate-reverse-enter-active { - right: 0; - opacity: 1; -} - -.animate-reverse-leave { - left: 0; -} - -.animate-reverse-leave.animate-reverse-leave-active{ - right: -100%; - opacity: 0; } \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.controller.js index d92f982590..9c4e068bdb 100644 --- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.controller.js +++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.controller.js @@ -628,11 +628,11 @@ angular.module("umbraco").controller("Umbraco.Overlays.TreePickerController", } - $scope.animationTest = function() { + $scope.getMiniListViewAnimation = function() { if(goingForward) { - return 'animate'; + return 'umb-mini-list-view--forward'; } else { - return 'animate-reverse'; + return 'umb-mini-list-view--backwards'; } } diff --git a/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.html b/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.html index 5278433847..dfbe021d54 100644 --- a/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.html +++ b/src/Umbraco.Web.UI.Client/src/views/common/overlays/treepicker/treepicker.html @@ -36,8 +36,7 @@ -
- +
Back