Fixing measure flow scrolling

This commit is contained in:
Bruno Alves de Faria 2017-10-23 11:35:33 -02:00
parent 93f9752527
commit 6d9e83869a
3 changed files with 14 additions and 37 deletions

View File

@ -57,5 +57,5 @@ OHIF.measurements.toggleLabelButton = options => {
OHIF.ui.unsavedChanges.set('viewer.studyViewer.measurements.renamed'); OHIF.ui.unsavedChanges.set('viewer.studyViewer.measurements.renamed');
} }
}; };
buttonView = Blaze.renderWithData(Template.measureFlow, data, options.element); buttonView = Blaze.renderWithData(Template.measureFlow, data, document.body);
}; };

View File

@ -65,10 +65,12 @@ Template.selectTree.onRendered(() => {
instance.component = component; instance.component = component;
// Set the margin to display the common section // Set the margin to display the common section
const isthreeColumns = instance.data.threeColumns; if (!$treeRoot.hasClass('started')) {
const marginProperty = isthreeColumns ? 'margin-left' : 'margin-right'; const isthreeColumns = instance.data.threeColumns;
const marginWidth = isthreeColumns ? $treeRoot.width() / 2 : $treeRoot.width(); const marginProperty = isthreeColumns ? 'margin-left' : 'margin-right';
$treeRoot.children('.tree-content').css(marginProperty, marginWidth); const marginWidth = isthreeColumns ? $treeRoot.width() / 2 : $treeRoot.width();
$treeRoot.children('.tree-content').css(marginProperty, marginWidth);
}
// Make the component respect the window boundaries // Make the component respect the window boundaries
$treeRoot.bounded(); $treeRoot.bounded();

View File

@ -13,7 +13,7 @@ $gray6 = #303030
.tree-content .tree-content
background-color: white background-color: white
position: relative position: relative
transition(transform 0.3s ease\, background-color 0.3s ease\, border-color 0.3s ease\, border-radius 0.3s ease) transition(transform 0.3s ease\, background-color 0.3s ease\, border-color 0.3s ease\, border-radius 0.3s ease\, margin-right 0.3s ease)
.tree-search .tree-search
a.tree-back a.tree-back
@ -231,7 +231,8 @@ $gray6 = #303030
.content .content
margin-left: calc(-100% - 6px) margin-left: calc(-100% - 6px)
transition(all 0.3s ease 0.3s) transform(scale(0))
transition(margin-left 0.3s ease 0.3s\, transform 0s linear 0.3s)
&.started &.started
@ -239,28 +240,19 @@ $gray6 = #303030
transform(scale(1)) transform(scale(1))
.select-tree-common .select-tree-common
animation-name: selectTreeCommonOverflow
animation-delay: 0.3s
animation-duration: 0.3s
animation-iteration-count: 1
animation-direction: alternate
animation-fill-mode: forwards
.content .content
margin-left: 0 margin-left: 0
transform(scale(1))
&.interacted, &.selected &.interacted, &.selected
.select-tree-common .select-tree-common
z-index: 1
.content .content
animation-name: selectTreeCommonCloseLeft opacity: 0
animation-duration: 0.3s transform(translateX(-100%) scale(0))
animation-iteration-count: 1 transition(transform 0.3s ease\, opacity 0.3s ease)
animation-direction: alternate
animation-timing-function: ease-out
animation-fill-mode: forwards
@keyframes selectTreeCommonOverflow { @keyframes selectTreeCommonOverflow {
from { from {
@ -270,20 +262,3 @@ $gray6 = #303030
overflow: visible overflow: visible
} }
} }
@keyframes selectTreeCommonCloseLeft {
from {
height: 37px
display: table
margin-left: 0
opacity: 1
visibility: visible
}
to {
height: 100%
margin-left: calc(-100% - 6px)
opacity: 0
visibility: hidden
width: calc(100% - 6px)
}
}