ohif-viewer/OHIFViewer/client/components/flexboxLayout/flexboxLayout.styl
2017-04-20 17:38:06 -03:00

79 lines
1.8 KiB
Stylus

@require '{ohif:design}/app'
$lesionsSidebarMenuWidth = 450px
.viewerSection
display: flex
flex: 1
flex-flow: row nowrap
align-items: stretch
height: 'calc(100vh - %s)' % ($toolbarHeight + $topBarHeight)
width: 100%
.sidebarMenu
height: 100%
// required transformation to make inner fixed elements relative to this one
transform(scale(1))
transition($sidebarTransition)
.sidebar-option
height: 100%
position: fixed
transform(translateX(100%))
transition($sidebarTransition)
width: 100%
&.active
transform(translateX(0%))
.sidebar-left
theme('border-right', '%s solid $uiBorderColor' % $uiBorderThickness)
flex: 1
margin-left: - $studiesSidebarMenuWidth
max-width: $studiesSidebarMenuWidth
order: 1
&.sidebar-open
margin-left: 0
.mainContent
flex: 1
height: 100%
order: 2
overflow: hidden
transition($sidebarTransition)
width: 100%
.sidebar-right
flex: 1
margin-right: - $lesionsSidebarMenuWidth
max-width: $lesionsSidebarMenuWidth
order: 3
position: relative
&[data-timepoints="3"]
margin-right: - ($lesionsSidebarMenuWidth + 135.5px)
max-width: $lesionsSidebarMenuWidth + 135.5px
&[data-timepoints="4"]
margin-right: - ($lesionsSidebarMenuWidth + 270px)
max-width: $lesionsSidebarMenuWidth + 270px
&:before
theme('background-color', '$uiBorderColor')
content: ''
display: block
height: 100%
left: 5px
position: absolute
top: 0
width: $uiBorderThickness
&.sidebar-open
margin-right: 0
.studiesListedChanger
theme('border-bottom', '%s solid $uiBorderColor' % $uiBorderThickness)
padding: 20px 10px
text-align: center