ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2024-12-28 17:08:51 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

[Treeview] Fix splitter bar movement

Browse Source 
Fixed the splitter bar so that it is now
draggable again.
This commit is contained in:
slhale 2015-08-20 11:25:11 -07:00
parent d2bc8227c7
commit ed96889fce
2 changed files with 32 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
platform/commonUI/general/res/css/theme-espresso.css
View File

@ -706,34 +706,30 @@ mct-container {
* this source code distribution or the Licensing information page available * this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information. * at runtime from the About dialog for additional information.
*****************************************************************************/ *****************************************************************************/
/* line 28, ../sass/tree/_layout.scss */ /* line 30, ../sass/tree/_layout.scss */
.pane.left { .pane.left.inactive {
transition: width 0.25s; } width: 0 !important;
/* line 31, ../sass/tree/_layout.scss */ min-width: 0 !important; }
.pane.left.inactive {
width: 0 !important;
min-width: 0 !important; }
/* line 37, ../sass/tree/_layout.scss */ /* line 39, ../sass/tree/_layout.scss */
.splitter-bar.left { .splitter-bar.left {
opacity: 1; opacity: 1;
transition: left 0.25s, opacity 0.25s, visibility 0.25s; } transition: opacity 0.35s, visibility 0.35s; }
/* line 41, ../sass/tree/_layout.scss */ /* line 44, ../sass/tree/_layout.scss */
.splitter-bar.left.inactive { .splitter-bar.left.inactive {
left: 0 !important;
visibility: hidden; visibility: hidden;
opacity: 0; opacity: 0;
width: 0; } transition: opacity 0s, visibility 0s; }
/* line 48, ../sass/tree/_layout.scss */ /* line 50, ../sass/tree/_layout.scss */
.splitter-bar.left.inactive:before { .splitter-bar.left.inactive:before {
border-width: 0; } border-width: 0; }
/* line 55, ../sass/tree/_layout.scss */ /* line 57, ../sass/tree/_layout.scss */
.create-btn.major { .create-btn.major {
top: 0; top: 0;
left: 0; left: 0;
transition: all 0.25s; } transition: all 0.35s; }
/* line 60, ../sass/tree/_layout.scss */ /* line 62, ../sass/tree/_layout.scss */
.create-btn.major.inactivePane { .create-btn.major.inactivePane {
top: 0; top: 0;
left: 0; left: 0;
@ -746,21 +742,22 @@ mct-container {
line-height: 14px; line-height: 14px;
left: -11px; left: -11px;
top: 20px; } top: 20px; }
/* line 78, ../sass/tree/_layout.scss */ /* line 80, ../sass/tree/_layout.scss */
.create-btn.major.inactivePane span { .create-btn.major.inactivePane span {
display: none; } display: none; }
/* line 85, ../sass/tree/_layout.scss */ /* line 87, ../sass/tree/_layout.scss */
.items.pane { .items.pane {
transition: left 0.25s; } transition: left 0.35s;
/* line 88, ../sass/tree/_layout.scss */ transition-timing-function: ease-out; }
/* line 91, ../sass/tree/_layout.scss */
.items.pane.leftInactive { .items.pane.leftInactive {
left: 0 !important; } left: 0 !important; }
/* line 94, ../sass/tree/_layout.scss */ /* line 97, ../sass/tree/_layout.scss */
.object-browse-bar { .object-browse-bar {
position: relative; } position: relative; }
/* line 97, ../sass/tree/_layout.scss */ /* line 100, ../sass/tree/_layout.scss */
.object-browse-bar .left-pane-tabs { .object-browse-bar .left-pane-tabs {
position: relative; position: relative;
cursor: pointer; cursor: pointer;
@ -775,10 +772,10 @@ mct-container {
background-color: lightgrey; background-color: lightgrey;
border: 1px solid grey; border: 1px solid grey;
border-left-width: 0; } border-left-width: 0; }
/* line 116, ../sass/tree/_layout.scss */ /* line 119, ../sass/tree/_layout.scss */
.object-browse-bar .left-pane-tabs.inactivePane { .object-browse-bar .left-pane-tabs.inactivePane {
left: -16px; } left: -16px; }
/* line 121, ../sass/tree/_layout.scss */ /* line 124, ../sass/tree/_layout.scss */
.object-browse-bar .items-select { .object-browse-bar .items-select {
margin-left: 10px; } margin-left: 10px; }

19
platform/commonUI/general/res/sass/tree/_layout.scss
View File

@ -22,28 +22,30 @@
// Added by shale on 08/19/2015. Styling for the collapsible tree view. // Added by shale on 08/19/2015. Styling for the collapsible tree view.
$transitionTime: 0.25s; $transitionTime: 0.35s;
//.pane.right, // Set the left pane (which contains the tree) to have no width to close
// (not display:none because we still need to have access to the create button)
.pane.left { .pane.left {
transition: width $transitionTime;
&.inactive { &.inactive {
width: 0 !important; width: 0 !important;
min-width: 0 !important; min-width: 0 !important;
} }
} }
// Hide the splitter bar when the left pane is closed
// Fade the splitter bar in when opening menu, but immediately fade
// out when closing menu
.splitter-bar.left { .splitter-bar.left {
opacity: 1; opacity: 1;
transition: left $transitionTime, opacity $transitionTime, visibility $transitionTime;
transition: opacity $transitionTime, visibility $transitionTime;
&.inactive { &.inactive {
left: 0 !important;
//display: none;
visibility: hidden; visibility: hidden;
opacity: 0; opacity: 0;
width: 0;
transition: opacity 0s, visibility 0s;
&:before { &:before {
border-width: 0; border-width: 0;
@ -84,6 +86,7 @@ $transitionTime: 0.25s;
// The main view needs to align left when the panes are moving around // The main view needs to align left when the panes are moving around
.items.pane { .items.pane {
transition: left $transitionTime; transition: left $transitionTime;
transition-timing-function: ease-out;
&.leftInactive { &.leftInactive {
left: 0 !important; left: 0 !important;