From 710499c10b635cf423ad9a85b651a7b31195d628 Mon Sep 17 00:00:00 2001 From: Bruno Alves de Faria Date: Mon, 3 Oct 2016 11:33:01 -0300 Subject: [PATCH] PWV-1: Fixing studylist and viewer links styles --- LesionTracker/client/components/app/app.html | 2 +- LesionTracker/client/components/app/app.styl | 21 ++++++++++------ .../components/ohifViewer/ohifViewer.html | 2 +- .../components/ohifViewer/ohifViewer.styl | 21 ++++++++++------ .../client/components/app/app.html | 2 +- .../client/components/app/app.styl | 21 ++++++++++------ .../standaloneViewer/standaloneViewer.styl | 24 +++++++++++++++---- 7 files changed, 65 insertions(+), 28 deletions(-) diff --git a/LesionTracker/client/components/app/app.html b/LesionTracker/client/components/app/app.html index ce2a7a557..9669c60fb 100644 --- a/LesionTracker/client/components/app/app.html +++ b/LesionTracker/client/components/app/app.html @@ -12,7 +12,7 @@ {{ #if studyListToggleText }} - + {{studyListToggleText}} {{ /if }} diff --git a/LesionTracker/client/components/app/app.styl b/LesionTracker/client/components/app/app.styl index 93597de02..7f13ff777 100644 --- a/LesionTracker/client/components/app/app.styl +++ b/LesionTracker/client/components/app/app.styl @@ -9,12 +9,14 @@ $expandedHeight = 160px .topBar height: $topBarHeight - overflow: hidden - padding: 1rem $studyListPadding 0 + padding: 10px 10px 0 theme('color', '$textPrimaryColor') theme('background-color', '$primaryBackgroundColor') transition(all 0.5s ease) + &>.clearfix + position: relative + .brandSection height: 30px display: inline-block @@ -33,6 +35,8 @@ $expandedHeight = 160px .studyListLinkSection theme('border-left', '%s solid $uiBorderColor' % $uiBorderThickness) + margin: 3px 0 0 10px + padding: 0 0 0 10px .btn theme('color', '$textSecondaryColor') @@ -40,7 +44,6 @@ $expandedHeight = 160px font-size: 13px font-weight: 500 line-height: 26px - margin-top: 3px &:hover theme('color', '$hoverColor') @@ -51,11 +54,13 @@ $expandedHeight = 160px &.studyList background-color: rgba(21, 25, 30, 0.7) height: $expandedHeight + padding-left: $studyListPadding + padding-right: $studyListPadding .brandSection height: 100% width: 80% - line-height: $expandedHeight + line-height: $expandedHeight - 10px .logoImage width: 50px @@ -65,10 +70,12 @@ $expandedHeight = 160px font-size: 30px .studyListLinkSection - position: absolute border: none - top: 5px - left: 5px + left: 0 + margin: 0 + padding: 0 + position: absolute + top: 0 #studylistTabs height: "calc(100% - %s)" % $topBarHeight diff --git a/OHIFViewer/client/components/ohifViewer/ohifViewer.html b/OHIFViewer/client/components/ohifViewer/ohifViewer.html index 0a22a6be3..77a41fe54 100644 --- a/OHIFViewer/client/components/ohifViewer/ohifViewer.html +++ b/OHIFViewer/client/components/ohifViewer/ohifViewer.html @@ -12,7 +12,7 @@ {{#if studyListToggleText}} - + {{studyListToggleText}} {{/if}} diff --git a/OHIFViewer/client/components/ohifViewer/ohifViewer.styl b/OHIFViewer/client/components/ohifViewer/ohifViewer.styl index 93597de02..7f13ff777 100644 --- a/OHIFViewer/client/components/ohifViewer/ohifViewer.styl +++ b/OHIFViewer/client/components/ohifViewer/ohifViewer.styl @@ -9,12 +9,14 @@ $expandedHeight = 160px .topBar height: $topBarHeight - overflow: hidden - padding: 1rem $studyListPadding 0 + padding: 10px 10px 0 theme('color', '$textPrimaryColor') theme('background-color', '$primaryBackgroundColor') transition(all 0.5s ease) + &>.clearfix + position: relative + .brandSection height: 30px display: inline-block @@ -33,6 +35,8 @@ $expandedHeight = 160px .studyListLinkSection theme('border-left', '%s solid $uiBorderColor' % $uiBorderThickness) + margin: 3px 0 0 10px + padding: 0 0 0 10px .btn theme('color', '$textSecondaryColor') @@ -40,7 +44,6 @@ $expandedHeight = 160px font-size: 13px font-weight: 500 line-height: 26px - margin-top: 3px &:hover theme('color', '$hoverColor') @@ -51,11 +54,13 @@ $expandedHeight = 160px &.studyList background-color: rgba(21, 25, 30, 0.7) height: $expandedHeight + padding-left: $studyListPadding + padding-right: $studyListPadding .brandSection height: 100% width: 80% - line-height: $expandedHeight + line-height: $expandedHeight - 10px .logoImage width: 50px @@ -65,10 +70,12 @@ $expandedHeight = 160px font-size: 30px .studyListLinkSection - position: absolute border: none - top: 5px - left: 5px + left: 0 + margin: 0 + padding: 0 + position: absolute + top: 0 #studylistTabs height: "calc(100% - %s)" % $topBarHeight diff --git a/PETSUVMeasurements/client/components/app/app.html b/PETSUVMeasurements/client/components/app/app.html index bc2b71641..18967a48a 100644 --- a/PETSUVMeasurements/client/components/app/app.html +++ b/PETSUVMeasurements/client/components/app/app.html @@ -12,7 +12,7 @@ {{ #if studyListToggleText }} - + {{studyListToggleText}} {{ /if }} diff --git a/PETSUVMeasurements/client/components/app/app.styl b/PETSUVMeasurements/client/components/app/app.styl index 93597de02..7f13ff777 100644 --- a/PETSUVMeasurements/client/components/app/app.styl +++ b/PETSUVMeasurements/client/components/app/app.styl @@ -9,12 +9,14 @@ $expandedHeight = 160px .topBar height: $topBarHeight - overflow: hidden - padding: 1rem $studyListPadding 0 + padding: 10px 10px 0 theme('color', '$textPrimaryColor') theme('background-color', '$primaryBackgroundColor') transition(all 0.5s ease) + &>.clearfix + position: relative + .brandSection height: 30px display: inline-block @@ -33,6 +35,8 @@ $expandedHeight = 160px .studyListLinkSection theme('border-left', '%s solid $uiBorderColor' % $uiBorderThickness) + margin: 3px 0 0 10px + padding: 0 0 0 10px .btn theme('color', '$textSecondaryColor') @@ -40,7 +44,6 @@ $expandedHeight = 160px font-size: 13px font-weight: 500 line-height: 26px - margin-top: 3px &:hover theme('color', '$hoverColor') @@ -51,11 +54,13 @@ $expandedHeight = 160px &.studyList background-color: rgba(21, 25, 30, 0.7) height: $expandedHeight + padding-left: $studyListPadding + padding-right: $studyListPadding .brandSection height: 100% width: 80% - line-height: $expandedHeight + line-height: $expandedHeight - 10px .logoImage width: 50px @@ -65,10 +70,12 @@ $expandedHeight = 160px font-size: 30px .studyListLinkSection - position: absolute border: none - top: 5px - left: 5px + left: 0 + margin: 0 + padding: 0 + position: absolute + top: 0 #studylistTabs height: "calc(100% - %s)" % $topBarHeight diff --git a/StandaloneViewer/StandaloneViewer/client/components/standaloneViewer/standaloneViewer.styl b/StandaloneViewer/StandaloneViewer/client/components/standaloneViewer/standaloneViewer.styl index 4e7d88c68..7f13ff777 100644 --- a/StandaloneViewer/StandaloneViewer/client/components/standaloneViewer/standaloneViewer.styl +++ b/StandaloneViewer/StandaloneViewer/client/components/standaloneViewer/standaloneViewer.styl @@ -9,12 +9,14 @@ $expandedHeight = 160px .topBar height: $topBarHeight - overflow: hidden - padding: 1rem $studyListPadding 0 + padding: 10px 10px 0 theme('color', '$textPrimaryColor') theme('background-color', '$primaryBackgroundColor') transition(all 0.5s ease) + &>.clearfix + position: relative + .brandSection height: 30px display: inline-block @@ -31,13 +33,17 @@ $expandedHeight = 160px theme('color', '$textPrimaryColor') line-height: 30px + .studyListLinkSection + theme('border-left', '%s solid $uiBorderColor' % $uiBorderThickness) + margin: 3px 0 0 10px + padding: 0 0 0 10px + .btn theme('color', '$textSecondaryColor') cursor: pointer font-size: 13px font-weight: 500 line-height: 26px - margin-top: 3px &:hover theme('color', '$hoverColor') @@ -48,11 +54,13 @@ $expandedHeight = 160px &.studyList background-color: rgba(21, 25, 30, 0.7) height: $expandedHeight + padding-left: $studyListPadding + padding-right: $studyListPadding .brandSection height: 100% width: 80% - line-height: $expandedHeight + line-height: $expandedHeight - 10px .logoImage width: 50px @@ -61,6 +69,14 @@ $expandedHeight = 160px .logoText font-size: 30px + .studyListLinkSection + border: none + left: 0 + margin: 0 + padding: 0 + position: absolute + top: 0 + #studylistTabs height: "calc(100% - %s)" % $topBarHeight