From 498f854beffc5ebc9551d13a46f5d0decc40af96 Mon Sep 17 00:00:00 2001 From: Charles Hacskaylo Date: Mon, 26 Oct 2015 14:54:09 -0700 Subject: [PATCH] Frontend] Treeview expand/collapse anim timing tweaks open #90 --- .../res/sass/user-environ/_layout.scss | 3 ++ .../espresso/res/css/theme-espresso.css | 28 +++++++++++++++---- .../themes/snow/res/css/theme-snow.css | 28 +++++++++++++++---- 3 files changed, 49 insertions(+), 10 deletions(-) diff --git a/platform/commonUI/general/res/sass/user-environ/_layout.scss b/platform/commonUI/general/res/sass/user-environ/_layout.scss index befc0c232a..57efa797ae 100644 --- a/platform/commonUI/general/res/sass/user-environ/_layout.scss +++ b/platform/commonUI/general/res/sass/user-environ/_layout.scss @@ -443,6 +443,9 @@ @include trans-prop-nice(opacity, $dur: 250ms, $delay: 250ms); opacity: 1; } + .create-and-search-holder { + @include trans-prop-nice(top, $dur: 250ms, $delay: 200ms); + } } .pane-inspect-showing { diff --git a/platform/commonUI/themes/espresso/res/css/theme-espresso.css b/platform/commonUI/themes/espresso/res/css/theme-espresso.css index cf5a051299..410e445210 100644 --- a/platform/commonUI/themes/espresso/res/css/theme-espresso.css +++ b/platform/commonUI/themes/espresso/res/css/theme-espresso.css @@ -4132,8 +4132,26 @@ span.req { -webkit-transition-delay: 250ms; transition-delay: 250ms; opacity: 1; } +/* line 446, ../../../../general/res/sass/user-environ/_layout.scss */ +.pane-tree-showing .create-and-search-holder { + -moz-transition-property: top; + -o-transition-property: top; + -webkit-transition-property: top; + transition-property: top; + -moz-transition-duration: 250ms; + -o-transition-duration: 250ms; + -webkit-transition-duration: 250ms; + transition-duration: 250ms; + -moz-transition-timing-function: ease-in-out; + -o-transition-timing-function: ease-in-out; + -webkit-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; + -moz-transition-delay: 200ms; + -o-transition-delay: 200ms; + -webkit-transition-delay: 200ms; + transition-delay: 200ms; } -/* line 450, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 453, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-showing .l-object-and-inspector .pane.right, .pane-inspect-showing .l-object-and-inspector .splitter-inspect { -moz-transition-property: opacity; @@ -4154,21 +4172,21 @@ span.req { transition-delay: 250ms; opacity: 1; } -/* line 459, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 462, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-hidden .l-object-and-inspector .pane.right, .pane-inspect-hidden .l-object-and-inspector .splitter-inspect { opacity: 0; } @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) { - /* line 468, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 471, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-hidden .pane.right.primary-pane { left: 10px !important; } - /* line 471, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 474, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-hidden .l-object-and-inspector .pane.left { right: 10px !important; } - /* line 474, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 477, ../../../../general/res/sass/user-environ/_layout.scss */ .pane:not(.resizing) { -moz-transition-property: width, left, right; -o-transition-property: width, left, right; diff --git a/platform/commonUI/themes/snow/res/css/theme-snow.css b/platform/commonUI/themes/snow/res/css/theme-snow.css index 343aaf5408..0627101107 100644 --- a/platform/commonUI/themes/snow/res/css/theme-snow.css +++ b/platform/commonUI/themes/snow/res/css/theme-snow.css @@ -4073,8 +4073,26 @@ span.req { -webkit-transition-delay: 250ms; transition-delay: 250ms; opacity: 1; } +/* line 446, ../../../../general/res/sass/user-environ/_layout.scss */ +.pane-tree-showing .create-and-search-holder { + -moz-transition-property: top; + -o-transition-property: top; + -webkit-transition-property: top; + transition-property: top; + -moz-transition-duration: 250ms; + -o-transition-duration: 250ms; + -webkit-transition-duration: 250ms; + transition-duration: 250ms; + -moz-transition-timing-function: ease-in-out; + -o-transition-timing-function: ease-in-out; + -webkit-transition-timing-function: ease-in-out; + transition-timing-function: ease-in-out; + -moz-transition-delay: 200ms; + -o-transition-delay: 200ms; + -webkit-transition-delay: 200ms; + transition-delay: 200ms; } -/* line 450, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 453, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-showing .l-object-and-inspector .pane.right, .pane-inspect-showing .l-object-and-inspector .splitter-inspect { -moz-transition-property: opacity; @@ -4095,21 +4113,21 @@ span.req { transition-delay: 250ms; opacity: 1; } -/* line 459, ../../../../general/res/sass/user-environ/_layout.scss */ +/* line 462, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-hidden .l-object-and-inspector .pane.right, .pane-inspect-hidden .l-object-and-inspector .splitter-inspect { opacity: 0; } @media screen and (min-device-width: 800px) and (min-device-height: 1025px), screen and (min-device-width: 1025px) and (min-device-height: 800px) { - /* line 468, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 471, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-tree-hidden .pane.right.primary-pane { left: 10px !important; } - /* line 471, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 474, ../../../../general/res/sass/user-environ/_layout.scss */ .pane-inspect-hidden .l-object-and-inspector .pane.left { right: 10px !important; } - /* line 474, ../../../../general/res/sass/user-environ/_layout.scss */ + /* line 477, ../../../../general/res/sass/user-environ/_layout.scss */ .pane:not(.resizing) { -moz-transition-property: width, left, right; -o-transition-property: width, left, right;