LT-250: Fixing quick switch dimensions

This commit is contained in:
Bruno Alves de Faria 2016-06-13 16:30:33 -03:00 committed by Erik Ziegler
parent 26687c579f
commit ef742ee3b5
2 changed files with 37 additions and 38 deletions

View File

@ -1,12 +1,23 @@
@import "{design}/app" @import "{design}/app"
$switchSize = 50px $switchSize = 50px
$switchTop = 5px
$switchHeight = 70px
$switchWrapperWidth = 140px
.quickSwitch .quickSwitch
height: 80px height: 80px
position: absolute position: absolute
top: 5px top: $switchTop
width: 140px width: $switchWrapperWidth
&.middle
left: 'calc(50% - %s)' % ($switchWrapperWidth / 2)
&.left
left: 'calc(50% - %s - 20px)' % $switchWrapperWidth
&.right
left: calc(50% + 20px)
div.switchSection div.switchSection
display: inline-block display: inline-block
@ -42,11 +53,10 @@ $switchSize = 50px
.mirror-x .mirror-x
transform(scaleX(-1)); transform(scaleX(-1));
.studyHover .studyHover, .seriesHover
position: absolute position: absolute
z-index: 10000 z-index: 10000
top: 70px top: $switchHeight
left: -350px
width: 400px width: 400px
height: 500px height: 500px
background: black background: black
@ -54,17 +64,13 @@ $switchSize = 50px
border-radius: 5px border-radius: 5px
transition(all 0.3s ease) transition(all 0.3s ease)
.studyHover
left: -350px
width: 400px
.seriesHover .seriesHover
position: absolute
z-index: 10000
top: 70px
left: 50px left: 50px
width: 700px width: 700px
height: 900px
background: black
opacity: 0.8
border-radius: 5px
transition(all 0.3s ease)
&.tiny &.tiny
width: 0 width: 0
@ -76,9 +82,15 @@ $switchSize = 50px
width: 33% width: 33%
display: inline-block display: inline-block
$switchSizeSmall = 30px $switchSizeSmall = 35px
@media screen and (max-width: 1600px) @media screen and (max-width: 1600px)
.quickSwitch div.switchSection .quickSwitch
&.left
left: 'calc(50% - %s - 8px)' % $switchWrapperWidth
&.right
left: calc(50% + 8px)
height: 45px
div.switchSection
.label .label
font-size: 8px font-size: 8px
font-weight: 400 font-weight: 400

View File

@ -60,16 +60,3 @@
min-width: 30px min-width: 30px
stroke: $defaultColor stroke: $defaultColor
text-align: center text-align: center
.quickSwitch
position: absolute
&.middle
left: calc(50% - 60px)
&.left
left: calc(50% - 160px)
&.right
left: 50%
margin-left: 20px