othmane/ohif-viewer
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

LT-281: Replacing variables for theme calls

Browse Source
This commit is contained in:
Bruno Alves de Faria 2016-08-23 14:24:51 -03:00 committed by Erik Ziegler
parent 52770dc79c
commit e9ec386e72
55 changed files with 341 additions and 446 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
OHIFViewer/client/components/flexboxLayout/flexboxLayout.styl
View File

@ -27,11 +27,11 @@ $lesionsSidebarMenuWidth = 450px
transform(translateX(0%)) transform(translateX(0%))
.sidebar-left .sidebar-left
max-width: $studiesSidebarMenuWidth theme('border-right', '%s solid $uiBorderColor' % $uiBorderThickness)
order: 1
flex: 1 flex: 1
margin-left: - $studiesSidebarMenuWidth margin-left: - $studiesSidebarMenuWidth
border-right: $uiBorderThickness $uiBorderColor solid max-width: $studiesSidebarMenuWidth
order: 1
&.sidebar-open &.sidebar-open
margin-left: 0 margin-left: 0
@ -62,7 +62,7 @@ $lesionsSidebarMenuWidth = 450px
max-width: $lesionsSidebarMenuWidth + 270px max-width: $lesionsSidebarMenuWidth + 270px
&:before &:before
background-color: $uiBorderColor theme('background-color', '$uiBorderColor')
content: '' content: ''
display: block display: block
height: 100% height: 100%
@ -75,6 +75,6 @@ $lesionsSidebarMenuWidth = 450px
margin-right: 0 margin-right: 0
.studiesListedChanger .studiesListedChanger
theme('border-bottom', '%s solid $uiBorderColor' % $uiBorderThickness)
padding: 20px 10px padding: 20px 10px
text-align: center text-align: center
border-bottom: $uiBorderThickness $uiBorderColor solid

20
OHIFViewer/client/components/ohifViewer/ohifViewer.styl
View File

@ -9,8 +9,8 @@ $expandedHeight = 160px
.topBar .topBar
height: $topBarHeight height: $topBarHeight
color: $textPrimaryColor theme('color', '$textPrimaryColor')
background-color: $primaryBackgroundColor theme('background-color', '$primaryBackgroundColor')
transition(all 0.5s ease) transition(all 0.5s ease)
.brandSection .brandSection
@ -26,14 +26,14 @@ $expandedHeight = 160px
display: inline-block display: inline-block
font-family: $logoFontFamily font-family: $logoFontFamily
font-weight: $logoFontWeight font-weight: $logoFontWeight
color: $textPrimaryColor theme('color', '$textPrimaryColor')
line-height: 30px line-height: 30px
.studyListLinkSection .studyListLinkSection
border-left: $uiBorderThickness solid $uiBorderColor; theme('border-left', '%s solid $uiBorderColor' % $uiBorderThickness)
.btn .btn
color: $textSecondaryColor theme('color', '$textSecondaryColor')
cursor: pointer cursor: pointer
font-size: 13px font-size: 13px
font-weight: 500 font-weight: 500
@ -41,10 +41,10 @@ $expandedHeight = 160px
margin-top: 3px margin-top: 3px
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')
&.studyList &.studyList
background-color: rgba(21, 25, 30, 0.7) background-color: rgba(21, 25, 30, 0.7)
@ -75,5 +75,5 @@ $expandedHeight = 160px
.tab-pane .tab-pane
.viewerContainer .viewerContainer
.loadingTextDiv .loadingTextDiv
color: $textSecondaryColor theme('color', '$textSecondaryColor')
font-size: 30px font-size: 30px

4
OHIFViewer/client/components/toolbarSection/toolbarSection.styl
View File

@ -1,7 +1,7 @@
@import "{design}/app" @import "{design}/app"
.toolbarSection .toolbarSection
border-bottom: $uiBorderColor $uiBorderThickness solid theme('border-bottom', '%s solid $uiBorderColor' % $uiBorderThickness)
flex: 0 0 auto flex: 0 0 auto
height: $toolbarHeight height: $toolbarHeight
overflow: hidden overflow: hidden
@ -11,4 +11,4 @@
width: 100% width: 100%
&.expanded &.expanded
height: $toolbarHeight + $toolbarDrawerHeight height: $toolbarHeight + $toolbarDrawerHeight

2
OHIFViewer/client/components/viewer/viewer.styl
View File

@ -6,5 +6,5 @@
width: 100% width: 100%
.loadingTextDiv .loadingTextDiv
color: $textSecondaryColor theme('color', '$textSecondaryColor')
font-size: 30px font-size: 30px

30
Packages/design/components/roundedButtonGroup/roundedButtonGroup.styl
View File

@ -1,7 +1,7 @@
@import "{design}/app" @import "{design}/app"
$height = 25px $height = 25px
$textColorActive = #2D2D2D $textColorButtonActive = #2D2D2D
.roundedButtonGroup .roundedButtonGroup
@ -15,9 +15,9 @@ $textColorActive = #2D2D2D
.roundedButton .roundedButton
align-items: center align-items: center
background-color: $uiGrayDark theme('background-color', '$uiGrayDark')
border: 2px $uiBorderColorDark solid theme('border', '2px solid $uiBorderColorDark')
color: $textSecondaryColor theme('color', '$textSecondaryColor')
display: flex display: flex
font-size: 11px font-size: 11px
font-weight: 500 font-weight: 500
@ -29,19 +29,19 @@ $textColorActive = #2D2D2D
transition: transition($sidebarTransition) transition: transition($sidebarTransition)
svg svg
fill: $defaultColor theme('fill', '$defaultColor')
stroke: $defaultColor theme('stroke', '$defaultColor')
svg svg
span span
margin: 0 2px margin: 0 2px
i i
line-height: 15px line-height: 15px
font-size: 15px font-size: 15px
.bottomLabel .bottomLabel
color: $textSecondaryColor theme('color', '$textSecondaryColor')
font-size: 12px font-size: 12px
font-weight: 500 font-weight: 500
line-height: 12px line-height: 12px
@ -58,16 +58,16 @@ $textColorActive = #2D2D2D
border-top-right-radius: $height border-top-right-radius: $height
&:hover .roundedButton &:hover .roundedButton
background-color: $boxBackgroundColor theme('color', '$uiGrayDark')
color: $uiGrayDark theme('background-color', '$boxBackgroundColor')
&.active .roundedButton &.active .roundedButton
background-color: $activeColor theme('background-color', '$activeColor')
border-color: $uiBorderColorActive theme('border-color', '$uiBorderColorActive')
color: $textColorActive color: $textColorButtonActive
&:hover .roundedButton &:hover .roundedButton
&.active .roundedButton &.active .roundedButton
svg svg
fill: $uiGrayDark theme('fill', '$uiGrayDark')
stroke: $uiGrayDark theme('stroke', '$uiGrayDark')

12
Packages/design/styles/common/global.styl
View File

@ -2,11 +2,9 @@
html body html body
font-family: 'Roboto', 'OpenSans', 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif font-family: 'Roboto', 'OpenSans', 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif
// Try to fix LT-273, need a monitor to test on though.
//text-rendering: optimizeLegibility
html hr html hr
border-top: 1px solid $uiBorderColor theme('border-top', '1px solid $uiBorderColor')
label.form-group label.form-group
width: 100% width: 100%
@ -49,9 +47,9 @@ label.form-group
.modal-dialog .modal-dialog
.modal-content .modal-content
background: $primaryBackgroundColor theme('background', '$primaryBackgroundColor')
border-color: $uiBorderColor theme('border-color', '$uiBorderColor')
color: $textSecondaryColor theme('color', '$textSecondaryColor')
.modal-header, .modal-footer .modal-header, .modal-footer
border-color: $uiBorderColor theme('border-color', '$uiBorderColor')

12
Packages/design/styles/components/radio.styl
View File

@ -3,12 +3,12 @@
.group-radio .group-radio
label label
cursor: pointer cursor: pointer
input input
height: 0 height: 0
width: 0 width: 0
visibility: hidden visibility: hidden
span span
padding-left: 23px padding-left: 23px
position: relative position: relative
@ -23,14 +23,14 @@
top: 50% top: 50%
transform(translateY(-50%)) transform(translateY(-50%))
width: 16px width: 16px
input:focus + span:before input:focus + span:before
// TODO: [design] define a outline for the design // TODO: [design] define a outline for the design
theme('box-shadow', '0 0 2px 2px $textSecondaryColor')
outline: none outline: none
box-shadow: 0 0 2px 2px $textSecondaryColor
input:checked + span:after input:checked + span:after
background: $uiBorderColorDark theme('background', '$uiBorderColorDark')
border-radius: 5px border-radius: 5px
content: '' content: ''
height: 10px height: 10px

4
Packages/design/styles/components/select2.styl
View File

@ -22,8 +22,8 @@ span.select2.select2-container
padding-left: 11px padding-left: 11px
span.select2-selection__arrow span.select2-selection__arrow
theme('border-left', '1px solid $primaryBackgroundColor')
background-color: $gray1 background-color: $gray1
border-left: 1px solid $primaryBackgroundColor
border-top-right-radius: $borderRadius border-top-right-radius: $borderRadius
border-bottom-right-radius: $borderRadius border-bottom-right-radius: $borderRadius
right: 0 right: 0
@ -42,8 +42,8 @@ span.select2.select2-container
placeholder-color($gray4) placeholder-color($gray4)
li.select2-selection__choice li.select2-selection__choice
theme('border-color', '$uiGray')
background-color: #FFF background-color: #FFF
border-color: $uiGray
border-radius: $borderRadius border-radius: $borderRadius
color: $gray4 color: $gray4
font-size: 12px font-size: 12px

82
Packages/design/styles/imports/theme-tide.styl
View File

@ -18,7 +18,6 @@ $themes['tide'] = {
$uiBorderColorActive: #00a4d9 $uiBorderColorActive: #00a4d9
$primaryBackgroundColor: #000000 $primaryBackgroundColor: #000000
$boxBackgroundColor: #344a61 $boxBackgroundColor: #344a61
$boxBackgroundColorDark: #22374D
// Text Colors // Text Colors
$textColorActive: black //#89bae5 $textColorActive: black //#89bae5
@ -26,86 +25,5 @@ $themes['tide'] = {
$textSecondaryColor: #6a8fb1 $textSecondaryColor: #6a8fb1
// Other Colors // Other Colors
$menuBackgroundColor: #F2F2F2
$imageSliderColor: #163239 $imageSliderColor: #163239
// Viewport Settings
$viewportBorderThickness: 1px
$viewportBorderColor: $uiBorderColorDark
$viewportBorderColorHover: $uiBorderColor
$viewportBorderColorActive: $uiBorderColorActive
// Sizes
$topBarHeight: 40px
$toolbarHeight: 78px
$toolbarDrawerHeight: 62px
// Thicknesses
$uiBorderThickness: 1px
// Fonts
$logoFontFamily: "Sanchez"
$logoFontWeight: 300
// Transitions
$transitionDuration: 0.3s
$transitionEffect: ease
$sidebarTransition: all $transitionDuration $transitionEffect
$studiesSidebarMenuWidth: 307px
$lesionsSidebarMenuWidth: 323px
} }
// Common pallete
$uiYellow = #E29E4A
$uiSkyBlue = #6FBDE2
$uiLightGray = #516873
$uiGray = #263340
$uiGrayDark = #16202B
$uiGrayDarker = #151A1F
$uiGrayDarkest = #14191E
// Interface UI Colors
$defaultColor = #9cd0fe
$hoverColor = #ffffff
$activeColor = #00a4d9
$uiBorderColor = #436270
$uiBorderColorDark = #3C5D80
$uiBorderColorActive = #00a4d9
$primaryBackgroundColor = #000000
$boxBackgroundColor = #344a61
$boxBackgroundColorDark = #22374D
// Text Colors
$textColorActive = black //#89bae5
$textPrimaryColor = #ffffff
$textSecondaryColor = #6a8fb1
// Other Colors
$menuBackgroundColor = #F2F2F2
$imageSliderColor = #163239
// Viewport Settings
$viewportBorderThickness = 1px
$viewportBorderColor = $uiBorderColorDark
$viewportBorderColorHover = $uiBorderColor
$viewportBorderColorActive = $uiBorderColorActive
// Sizes
$topBarHeight = 40px
$toolbarHeight = 78px
$toolbarDrawerHeight = 62px
// Thicknesses
$uiBorderThickness = 1px
// Fonts
$logoFontFamily = "Sanchez"
$logoFontWeight = 300
// Transitions
$transitionDuration = 0.3s
$transitionEffect = ease
$sidebarTransition = all $transitionDuration $transitionEffect
$studiesSidebarMenuWidth = 307px
$lesionsSidebarMenuWidth = 323px

27
Packages/design/styles/imports/theme-tigerlilly.styl
View File

@ -18,7 +18,6 @@ $themes['tigerlilly'] = {
$uiBorderColorActive: #ff8a3d $uiBorderColorActive: #ff8a3d
$primaryBackgroundColor: #000000 $primaryBackgroundColor: #000000
$boxBackgroundColor: #5b3a59 $boxBackgroundColor: #5b3a59
$boxBackgroundColorDark: #4b2f40
// Text Colors // Text Colors
$textColorActive: black $textColorActive: black
@ -26,31 +25,5 @@ $themes['tigerlilly'] = {
$textSecondaryColor: #6a8fb1 $textSecondaryColor: #6a8fb1
// Other Colors // Other Colors
$menuBackgroundColor: #F2F2F2
$imageSliderColor: #4b2c3c //#163239 $imageSliderColor: #4b2c3c //#163239
// Viewport Settings
$viewportBorderThickness: 1px
$viewportBorderColor: $uiBorderColorDark
$viewportBorderColorHover: $uiBorderColor
$viewportBorderColorActive: $uiBorderColorActive
// Sizes
$topBarHeight: 40px
$toolbarHeight: 78px
$toolbarDrawerHeight: 62px
// Thicknesses
$uiBorderThickness: 1px
// Fonts
$logoFontFamily: "Sanchez"
$logoFontWeight: 300
// Transitions
$transitionDuration: 0.3s
$transitionEffect: ease
$sidebarTransition: all $transitionDuration $transitionEffect
$studiesSidebarMenuWidth: 307px
$lesionsSidebarMenuWidth: 323px
} }

11
Packages/design/styles/imports/theming.styl
View File

@ -1,3 +1,9 @@
$themes = {}
$defaultTheme = 'tide'
@import "./theme-tide.styl"
@import "./theme-tigerlilly.styl"
parseSpaceVars($theme, $value) parseSpaceVars($theme, $value)
$valueSplit = split(' ', $value) $valueSplit = split(' ', $value)
$list = '' $list = ''
@ -21,5 +27,6 @@ theme($property, $value)
/ {selector()} / {selector()}
{$property}: parseCommaVars($themes[$defaultTheme], $value) {$property}: parseCommaVars($themes[$defaultTheme], $value)
for $themeName, $theme in $themes for $themeName, $theme in $themes
/ body.theme-{$themeName} {selector()} for $selectorPiece in split(',', selector())
{$property}: parseCommaVars($theme, $value) / body.theme-{$themeName} {$selectorPiece}
{$property}: parseCommaVars($theme, $value)

25
Packages/design/styles/imports/variables.styl
View File

@ -1,7 +1,22 @@
$themes = {}
$defaultTheme = 'tide'
@import "./theming.styl" @import "./theming.styl"
@import "./theme-tide.styl" // Sizes
@import "./theme-tigerlilly.styl" $topBarHeight = 40px
$toolbarHeight = 78px
$toolbarDrawerHeight = 62px
$studiesSidebarMenuWidth = 307px
$lesionsSidebarMenuWidth = 323px
// Fonts
$logoFontFamily = "Sanchez"
$logoFontWeight = 300
// Transitions
$transitionDuration = 0.3s
$transitionEffect = ease
$sidebarTransition = all $transitionDuration $transitionEffect
// Thicknesses
$viewportBorderThickness = 1px
$uiBorderThickness = 1px

32
Packages/hangingprotocols/client/components/protocolEditor/protocolEditor.styl
View File

@ -3,12 +3,12 @@
$height = 20px $height = 20px
#protocolEditor #protocolEditor
theme('background', '$primaryBackgroundColor')
height: 100% height: 100%
width: 450px width: 450px
padding: 10px 0 padding: 10px 0
position: absolute position: absolute
top: 0 top: 0
background: $primaryBackgroundColor
.navigationButtons .navigationButtons
ul ul
@ -35,27 +35,27 @@ $height = 20px
cursor: pointer cursor: pointer
text-decoration: none text-decoration: none
outline: none outline: none
background-color: $uiGrayDark theme('background-color', '$uiGrayDark')
border: 2px $uiBorderColorDark solid theme('border', '2px solid $uiBorderColorDark')
color: $textSecondaryColor theme('color', '$textSecondaryColor')
transition: transition($sidebarTransition) transition: transition($sidebarTransition)
border-radius: $height border-radius: $height
&.active a &.active a
background-color: $activeColor theme('background-color', '$activeColor')
border-color: $uiBorderColorActive theme('border-color', '$uiBorderColorActive')
color: $textColorActive theme('color', '$textColorActive')
transition: transition($sidebarTransition) transition: transition($sidebarTransition)
p p
h2 h2
h3 h3
h4 h4
color: $defaultColor theme('color', '$defaultColor')
label label
ul ul
color: $defaultColor theme('color', '$defaultColor')
font-weight: 400 font-weight: 400
label label
@ -68,7 +68,7 @@ $height = 20px
width: 40% width: 40%
border: none border: none
background: #212121 background: #212121
color: $defaultColor theme('color', '$defaultColor')
text-align: center text-align: center
button.btn button.btn
@ -85,11 +85,11 @@ $height = 20px
bottom: 0 bottom: 0
width: 100% width: 100%
margin-bottom: 0 margin-bottom: 0
background: $uiGrayDarker theme('background', '$uiGrayDarker')
p p
font-size: 8pt font-size: 8pt
color: $defaultColor theme('color', '$defaultColor')
margin: 0 10px margin: 0 10px
display: inline-block display: inline-block
@ -107,11 +107,11 @@ $height = 20px
#selectProtocol #selectProtocol
text-align: center text-align: center
.btn-file .btn-file
position: relative position: relative
overflow: hidden overflow: hidden
.btn-file input[type=file] .btn-file input[type=file]
position: absolute position: absolute
top: 0 top: 0
right: 0 right: 0
@ -141,4 +141,4 @@ $height = 20px
padding: 40px padding: 40px
h3 h3
color: $defaultColor theme('color', '$defaultColor')

9
Packages/hangingprotocols/client/components/ruleEntryDialog/ruleEntryDialog.styl
View File

@ -1,6 +1,9 @@
@import "{design}/app.styl" @import "{design}/app.styl"
.ruleEntryDialog .ruleEntryDialog
theme('background', '$uiGrayDarkest')
theme('border', '1px solid $uiBorderColor')
theme('color', '$textSecondaryColor')
display: none display: none
position: absolute position: absolute
top: 0 top: 0
@ -14,12 +17,8 @@
padding: 10px padding: 10px
background-color: rgba(255,255,255,1) background-color: rgba(255,255,255,1)
outline: none outline: none
opacity: 0.95 opacity: 0.95
border-radius: 8px border-radius: 8px
border: 1px solid $uiBorderColor
background: $uiGrayDarkest
color: $textSecondaryColor
.dialogContent .dialogContent
text-align: center text-align: center
@ -44,4 +43,4 @@
color: black color: black
height: 30px height: 30px
border-radius: 2px border-radius: 2px
border: 0 border: 0

14
Packages/hangingprotocols/client/components/ruleTable/ruleTable.styl
View File

@ -4,7 +4,7 @@ table.ruleTable
thead thead
tr tr
th th
color: $defaultColor theme('color', '$defaultColor')
text-align: center text-align: center
th:first-child th:first-child
@ -13,7 +13,7 @@ table.ruleTable
tbody tbody
tr tr
td td
color: $defaultColor theme('color', '$defaultColor')
text-align: center text-align: center
.failWarning .failWarning
@ -26,10 +26,10 @@ table.ruleTable
transition(all 0.1s ease) transition(all 0.1s ease)
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')
td:first-child td:first-child
text-align: left text-align: left
@ -37,14 +37,14 @@ table.ruleTable
.addRuleContainer .addRuleContainer
margin: 10px 0 margin: 10px 0
text-align: center text-align: center
color: $defaultColor theme('color', '$defaultColor')
.addRule .addRule
cursor: pointer cursor: pointer
transition(all 0.1s ease) transition(all 0.1s ease)
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')

9
Packages/hangingprotocols/client/components/settingEntryDialog/settingEntryDialog.styl
View File

@ -1,6 +1,9 @@
@import "{design}/app.styl" @import "{design}/app.styl"
.settingEntryDialog .settingEntryDialog
theme('border', '1px solid $uiBorderColor')
theme('background', '$uiGrayDarkest')
theme('color', '$textSecondaryColor')
display: none display: none
position: absolute position: absolute
top: 0 top: 0
@ -13,12 +16,8 @@
margin: auto margin: auto
padding: 10px padding: 10px
outline: none outline: none
opacity: 0.95 opacity: 0.95
border-radius: 8px border-radius: 8px
border: 1px solid $uiBorderColor
background: $uiGrayDarkest
color: $textSecondaryColor
.dialogContent .dialogContent
text-align: center text-align: center
@ -43,4 +42,4 @@
color: black color: black
height: 30px height: 30px
border-radius: 2px border-radius: 2px
border: 0 border: 0

14
Packages/hangingprotocols/client/components/settingsTable/settingsTable.styl
View File

@ -4,7 +4,7 @@ table.settingsTable
thead thead
tr tr
th th
color: $defaultColor theme('color', '$defaultColor')
text-align: center text-align: center
th:first-child th:first-child
@ -15,7 +15,7 @@ table.settingsTable
tr tr
td td
color: $defaultColor theme('color', '$defaultColor')
text-align: center text-align: center
.editSetting .editSetting
@ -24,10 +24,10 @@ table.settingsTable
transition(all 0.1s ease) transition(all 0.1s ease)
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')
td:first-child td:first-child
text-align: left text-align: left
@ -35,14 +35,14 @@ table.settingsTable
.addSettingContainer .addSettingContainer
margin: 10px 0 margin: 10px 0
text-align: center text-align: center
color: $defaultColor theme('color', '$defaultColor')
.addSetting .addSetting
cursor: pointer cursor: pointer
transition(all 0.1s ease) transition(all 0.1s ease)
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')

8
Packages/hangingprotocols/client/components/stageDetails/stageDetails.styl
View File

@ -14,19 +14,19 @@
h3 h3
label label
color: $defaultColor theme('color', '$defaultColor')
label label
margin-right: 10px margin-right: 10px
width: 25% width: 25%
input input
theme('background-color', '$boxBackgroundColor')Dark
min-width: 50px min-width: 50px
width: 40% width: 40%
border: none border: none
background: $boxBackgroundColorDark theme('color', '$defaultColor')
color: $defaultColor
text-align: center text-align: center
.stageEditorSection .stageEditorSection
margin: 30px 0 margin: 30px 0

24
Packages/hangingprotocols/client/components/stageSortable/stageSortable.styl
View File

@ -8,14 +8,14 @@
padding: 3px padding: 3px
span span
color: $defaultColor theme('color', '$defaultColor')
cursor: pointer cursor: pointer
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&.active &.active
color: $activeColor theme('color', '$activeColor')
.sortable-handle .sortable-handle
cursor: move cursor: move
@ -36,44 +36,44 @@
.deleteStage .deleteStage
cursor: pointer cursor: pointer
color: $defaultColor theme('color', '$defaultColor')
transition(all 0.1s ease) transition(all 0.1s ease)
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')
.addStage .addStage
margin: 10px 0 margin: 10px 0
text-align: center text-align: center
color: $defaultColor theme('color', '$defaultColor')
#addStage #addStage
transition(all 0.1s ease) transition(all 0.1s ease)
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')
.moveStageButtons .moveStageButtons
margin: 10px 0 margin: 10px 0
text-align: center text-align: center
a a
color: $defaultColor theme('color', '$defaultColor')
cursor: pointer cursor: pointer
text-decoration: none text-decoration: none
transition(all 0.1s ease) transition(all 0.1s ease)
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')
&[disabled="true"] &[disabled="true"]
opacity: 0.7 opacity: 0.7

9
Packages/hangingprotocols/client/components/textEntryDialog/textEntryDialog.styl
View File

@ -1,6 +1,9 @@
@import "{design}/app.styl" @import "{design}/app.styl"
.textEntryDialog .textEntryDialog
theme('border', '1px solid $uiBorderColor')
theme('background', '$uiGrayDarkest')
theme('color', '$textSecondaryColor')
display: none display: none
position: absolute position: absolute
top: 0 top: 0
@ -13,12 +16,8 @@
margin: auto margin: auto
padding: 10px padding: 10px
outline: none outline: none
opacity: 0.95 opacity: 0.95
border-radius: 8px border-radius: 8px
border: 1px solid $uiBorderColor
background: $uiGrayDarkest
color: $textSecondaryColor
.dialogContent .dialogContent
margin-bottom: 10px margin-bottom: 10px
@ -36,4 +35,4 @@
color: black color: black
height: 30px height: 30px
border-radius: 2px border-radius: 2px
border: 0 border: 0

20
Packages/lesiontracker/client/components/additionalFindings/additionalFindings.styl
View File

@ -22,22 +22,22 @@
display: none display: none
.header .header
theme('background-color', '$uiGray')
theme('color', '$textPrimaryColor')
height: 33px height: 33px
line-height: 33px line-height: 33px
font-weight: bold font-weight: bold
font-size: 14px font-size: 14px
padding: 1px 13px 0 padding: 1px 13px 0
color: $textPrimaryColor
background-color: $uiGray
.form-group .form-group
color: $textPrimaryColor theme('color', '$textPrimaryColor')
margin-bottom: 0 margin-bottom: 0
padding: 7px 27px 7px 11px padding: 7px 27px 7px 11px
width: 100% width: 100%
&:not(:last-child) &:not(:last-child)
border-bottom: $uiBorderThickness solid $uiBorderColorDark theme('border-bottom', '%s solid $uiBorderColorDark' % $uiBorderThickness)
& > .wrapperText & > .wrapperText
display: block display: block
@ -81,21 +81,21 @@
.buttonSection .buttonSection
cursor: pointer cursor: pointer
height: 90px height: 90px
color: $defaultColor theme('color', '$defaultColor')
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
.svgContainer .svgContainer
svg svg
fill: $hoverColor theme('fill', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')
.svgContainer .svgContainer
svg svg
fill: $activeColor theme('fill', '$activeColor')
div div
float: left float: left
@ -112,4 +112,4 @@
svg svg
width: 36px width: 36px
height: 36px height: 36px
fill: $textPrimaryColor theme('fill', '$textPrimaryColor')

6
Packages/lesiontracker/client/components/caseProgress/caseProgress.styl
View File

@ -13,15 +13,15 @@
margin-left: 22px margin-left: 22px
h5 h5
color: $textPrimaryColor theme('color', '$textPrimaryColor')
line-height: 46px line-height: 46px
margin: 0 margin: 0
font-size: 15px font-size: 15px
font-weight: bold font-weight: bold
button.btn button.btn
background-color: $activeColor theme('background-color', '$activeColor')
border: 1px solid $uiBorderColorActive theme('border', '1px solid $uiBorderColorActive')
color: #000 color: #000
cursor: pointer cursor: pointer
font-size: 15px font-size: 15px

6
Packages/lesiontracker/client/components/flexboxLayout/flexboxLayout.styl
View File

@ -25,11 +25,11 @@
transform(translateX(0%)) transform(translateX(0%))
.sidebar-left .sidebar-left
theme('border-right', '%s solid $uiBorderColor' % $uiBorderThickness)
max-width: $studiesSidebarMenuWidth max-width: $studiesSidebarMenuWidth
order: 1 order: 1
flex: 1 flex: 1
margin-left: - $studiesSidebarMenuWidth margin-left: - $studiesSidebarMenuWidth
border-right: $uiBorderThickness $uiBorderColor solid
&.sidebar-open &.sidebar-open
margin-left: 0 margin-left: 0
@ -60,7 +60,7 @@
max-width: $lesionsSidebarMenuWidth + 270px max-width: $lesionsSidebarMenuWidth + 270px
&:before &:before
background-color: $uiBorderColor theme('background-color', '$uiBorderColor')
content: '' content: ''
display: block display: block
height: 100% height: 100%
@ -73,6 +73,6 @@
margin-right: 0 margin-right: 0
.studiesListedChanger .studiesListedChanger
theme('border-bottom', '%s solid $uiBorderColor' % $uiBorderThickness)
padding: 20px 10px padding: 20px 10px
text-align: center text-align: center
border-bottom: $uiBorderThickness $uiBorderColor solid

2
Packages/lesiontracker/client/components/lesionTable/lesionTable.styl
View File

@ -1,7 +1,7 @@
@import "{design}/app" @import "{design}/app"
#lesionTableContainer #lesionTableContainer
background-color: $primaryBackgroundColor theme('background-color', '$primaryBackgroundColor')
height: 100% height: 100%
width: 100% width: 100%

30
Packages/lesiontracker/client/components/lesionTableHUD/lesionTableHUD.styl
View File

@ -22,9 +22,9 @@ $borderColor = rgba(77, 99, 110, 0.81)
padding-left: 0 padding-left: 0
.header .header
background: $uiGrayDarkest theme('background', '$uiGrayDarkest')
theme('color', '$textSecondaryColor')
border-bottom: $uiBorderThickness solid $borderColor border-bottom: $uiBorderThickness solid $borderColor
color: $textSecondaryColor
font-weight: 300 font-weight: 300
font-size: 20px font-size: 20px
height: 55px height: 55px
@ -34,12 +34,12 @@ $borderColor = rgba(77, 99, 110, 0.81)
width: 100% width: 100%
svg.buttonClose svg.buttonClose
color: $defaultColor theme('color', '$defaultColor')
cursor: pointer cursor: pointer
height: 14px height: 14px
position: absolute position: absolute
right: 14px right: 14px
stroke: $defaultColor theme('stroke', '$defaultColor')
top: 20px top: 20px
width: 14px width: 14px
@ -48,19 +48,19 @@ $borderColor = rgba(77, 99, 110, 0.81)
padding-bottom: 20px padding-bottom: 20px
.footer .footer
theme('background', '$uiGrayDarkest')
border-top: $uiBorderThickness solid $borderColor
width: 100% width: 100%
height: 70px height: 70px
position: absolute position: absolute
bottom: 0 bottom: 0
background: $uiGrayDarkest
border-top: $uiBorderThickness solid $borderColor
padding: 10px padding: 10px
.toolbarSectionButton .toolbarSectionButton
display: inline-block display: inline-block
color: $defaultColor theme('color', '$defaultColor')
fill: $defaultColor theme('fill', '$defaultColor')
stroke: $defaultColor theme('stroke', '$defaultColor')
padding: 0 10px padding: 0 10px
height: $toolbarHeight height: $toolbarHeight
min-width: 30px min-width: 30px
@ -85,15 +85,15 @@ $borderColor = rgba(77, 99, 110, 0.81)
height: 21px height: 21px
&:active, &.active &:active, &.active
color: $activeColor theme('color', '$activeColor')
svg svg
fill: $activeColor theme('fill', '$activeColor')
stroke: $activeColor theme('stroke', '$activeColor')
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
svg svg
fill: $hoverColor theme('fill', '$hoverColor')
stroke: $hoverColor theme('stroke', '$hoverColor')

20
Packages/lesiontracker/client/components/lesionTableHeaderRow/lesionTableHeaderRow.styl
View File

@ -3,10 +3,10 @@
$headerRowHeight = 63px $headerRowHeight = 63px
.lesionTableHeaderRow .lesionTableHeaderRow
background-color: $uiGrayDarker theme('background-color', '$uiGrayDarker')
color: $textSecondaryColor theme('color', '$textSecondaryColor')
display: flex display: flex
fill: $textSecondaryColor theme('fill', '$textSecondaryColor')
height: $headerRowHeight height: $headerRowHeight
line-height: $headerRowHeight line-height: $headerRowHeight
margin-top: 2px margin-top: 2px
@ -35,13 +35,13 @@ $headerRowHeight = 63px
max-width: 11px max-width: 11px
&:hover &:hover
fill: $hoverColor theme('fill', '$hoverColor')
&:active &:active
fill: $activeColor theme('fill', '$activeColor')
.type .type
color: $textSecondaryColor theme('color', '$textSecondaryColor')
font-size: 22px font-size: 22px
font-weight: 300 font-weight: 300
line-height: $headerRowHeight line-height: $headerRowHeight
@ -49,8 +49,8 @@ $headerRowHeight = 63px
text-align: left text-align: left
.numberOfLesions .numberOfLesions
theme('color', '$uiSkyBlue')
float: right float: right
color: $uiSkyBlue
font-weight: 300 font-weight: 300
font-size: 40px font-size: 40px
max-width: 54px max-width: 54px
@ -63,7 +63,7 @@ $headerRowHeight = 63px
text-align: right text-align: right
.maxNumLesions .maxNumLesions
background-color: $textSecondaryColor theme('background-color', '$textSecondaryColor')
border-radius: 3px border-radius: 3px
color: black color: black
display: table display: table
@ -79,5 +79,5 @@ $headerRowHeight = 63px
&.warning &.warning
.maxNumLesions .maxNumLesions
color: $textPrimaryColor theme('background-color', '$uiYellow')
background-color: $uiYellow theme('color', '$textPrimaryColor')

34
Packages/lesiontracker/client/components/lesionTableRow/lesionTableRow.styl
View File

@ -10,7 +10,7 @@
width: calc(100% + 6px) width: calc(100% + 6px)
&:before &:before
background-color: $activeColor theme('background-color', '$activeColor')
border-top-left-radius: 7px border-top-left-radius: 7px
border-bottom-left-radius: 7px border-bottom-left-radius: 7px
content: '' content: ''
@ -30,16 +30,16 @@
opacity: 1 opacity: 1
.lesionRowSidebar .lesionRowSidebar
color: $activeColor theme('color', '$activeColor')
.rowOptions .rowOptions
height: 35px height: 35px
visibility: visible visibility: visible
&.response-status .lesionRowSidebar .response-status-icon &.response-status .lesionRowSidebar .response-status-icon
background-color: $defaultColor theme('background-color', '$defaultColor')
theme('color', '$uiGray')
border-radius: 11px border-radius: 11px
color: $uiGray
font-size: 12px font-size: 12px
font-weight: 700 font-weight: 700
height: 21px height: 21px
@ -49,8 +49,8 @@
width: 21px width: 21px
&.warning .lesionRowSidebar &.warning .lesionRowSidebar
color: $textPrimaryColor theme('background-color', '$uiYellow')
background-color: $uiYellow theme('color', '$textPrimaryColor')
.warning-icon, svg .warning-icon, svg
width: 22px width: 22px
@ -60,31 +60,31 @@
margin: 7px auto 0 margin: 7px auto 0
svg svg
fill: $textPrimaryColor theme('fill', '$textPrimaryColor')
.rowOptions .rowOptions
background-color: $uiGrayDarker theme('background-color', '$uiGrayDarker')
height: 0 height: 0
overflow: hidden overflow: hidden
transition(all 0.3s ease) transition(all 0.3s ease)
visibility: hidden visibility: hidden
.rowAction .rowAction
color: $defaultColor theme('color', '$defaultColor')
cursor: pointer cursor: pointer
line-height: 35px line-height: 35px
transition(all 0.3s ease) transition(all 0.3s ease)
&:hover, &:active &:hover, &:active
color: $textPrimaryColor theme('color', '$textPrimaryColor')
svg svg
fill: $textPrimaryColor theme('fill', '$textPrimaryColor')
stroke: $textPrimaryColor theme('stroke', '$textPrimaryColor')
svg svg
fill: $defaultColor theme('fill', '$defaultColor')
stroke: $defaultColor theme('stroke', '$defaultColor')
transition(all 0.3s ease) transition(all 0.3s ease)
&.edit-icon &.edit-icon
@ -96,8 +96,8 @@
height: 11px height: 11px
.lesionRowSidebar .lesionRowSidebar
background: $uiGray theme('background', '$uiGray')
color: $textSecondaryColor theme('color', '$textSecondaryColor')
cursor: pointer cursor: pointer
flex: 1 flex: 1
max-width: 30px max-width: 30px
@ -120,7 +120,7 @@
.location .location
font-weight: 400 font-weight: 400
font-size: 14px font-size: 14px
color: $textSecondaryColor theme('color', '$textSecondaryColor')
height: 30px height: 30px
line-height: 30px line-height: 30px
margin-left: -2px margin-left: -2px

4
Packages/lesiontracker/client/components/lesionTableTimepointCell/lesionTableTimepointCell.styl
View File

@ -1,6 +1,6 @@
@import "{design}/app" @import "{design}/app"
.lesionTableTimepointCell .lesionTableTimepointCell
border-left: $uiBorderThickness $uiBorderColor solid theme('border-left', '%s solid $uiBorderColor' % $uiBorderThickness)
color: $textPrimaryColor theme('color', '$textPrimaryColor')
padding: 0 10px padding: 0 10px

6
Packages/lesiontracker/client/components/lesionTableTimepointHeader/lesionTableTimepointHeader.styl
View File

@ -5,18 +5,18 @@
justify-content: space-around justify-content: space-around
div div
border-left: $uiBorderColor $uiBorderThickness solid theme('border-left', '%s solid $uiBorderColor' % $uiBorderThickness)
font-weight: 400 font-weight: 400
padding-left: 12px padding-left: 12px
text-align: left text-align: left
.timepointName .timepointName
color: $textSecondaryColor theme('color', '$textSecondaryColor')
font-size: 12px font-size: 12px
line-height: 12px line-height: 12px
.timepointDate .timepointDate
color: $textPrimaryColor theme('color', '$textPrimaryColor')
font-size: 14px font-size: 14px
line-height: 20px line-height: 20px
padding-bottom: 6px padding-bottom: 6px

18
Packages/lesiontracker/client/components/lesionTracker/lesionTracker.styl
View File

@ -9,8 +9,8 @@ $expandedHeight = 160px
.topBar .topBar
height: $topBarHeight height: $topBarHeight
color: $textPrimaryColor theme('color', '$textPrimaryColor')
background-color: $primaryBackgroundColor theme('background-color', '$primaryBackgroundColor')
transition(all 0.5s ease) transition(all 0.5s ease)
.brandSection .brandSection
@ -26,14 +26,14 @@ $expandedHeight = 160px
display: inline-block display: inline-block
font-family: $logoFontFamily font-family: $logoFontFamily
font-weight: $logoFontWeight font-weight: $logoFontWeight
color: $textPrimaryColor theme('color', '$textPrimaryColor')
line-height: 30px line-height: 30px
.studyListLinkSection .studyListLinkSection
border-left: $uiBorderThickness solid $uiBorderColor; theme('border-left', '%s solid $uiBorderColor' % $uiBorderThickness)
.btn .btn
color: $textSecondaryColor theme('color', '$textSecondaryColor')
cursor: pointer cursor: pointer
font-size: 13px font-size: 13px
font-weight: 500 font-weight: 500
@ -41,10 +41,10 @@ $expandedHeight = 160px
margin-top: 3px margin-top: 3px
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')
&.studyList &.studyList
background-color: rgba(21, 25, 30, 0.7) background-color: rgba(21, 25, 30, 0.7)
@ -75,5 +75,5 @@ $expandedHeight = 160px
.tab-pane .tab-pane
.viewerContainer .viewerContainer
.loadingTextDiv .loadingTextDiv
color: $textSecondaryColor theme('color', '$textSecondaryColor')
font-size: 30px font-size: 30px

9
Packages/lesiontracker/client/components/measureFlow/measureFlow.styl
View File

@ -10,9 +10,6 @@
opacity: 0 opacity: 0
.btn-add .btn-add
// color: $textColorActive
// background-color: $activeColor
// border: 2px solid $uiBorderColor
theme('color', '$textColorActive') theme('color', '$textColorActive')
theme('background-color', '$activeColor') theme('background-color', '$activeColor')
theme('border', '2px solid $uiBorderColor') theme('border', '2px solid $uiBorderColor')
@ -46,7 +43,7 @@
position: relative position: relative
.icon-check .icon-check
background-color: $activeColor theme('background-color', '$activeColor')
left: -46px left: -46px
position: absolute position: absolute
top: 3px top: 3px
@ -73,10 +70,10 @@
animateFadeOut() animateFadeOut()
button button
theme('border', '1px solid $uiBorderColor')
theme('color', '$textPrimaryColor')
background-color: transparent background-color: transparent
border-radius: 16px border-radius: 16px
border: 1px solid $uiBorderColor
color: $textPrimaryColor
font-weight: normal font-weight: normal
height: 31px height: 31px
line-height: 31px line-height: 31px

10
Packages/lesiontracker/client/components/radialProgressBar/radialProgressBar.styl
View File

@ -11,12 +11,12 @@ $circleSize = 46px
#svg circle #svg circle
stroke-dashoffset: 0 stroke-dashoffset: 0
stroke: $uiBorderColorDark theme('stroke', '$uiBorderColorDark')
stroke-width: 3px stroke-width: 3px
vendorize(transition, stroke-dashoffset 1s linear) vendorize(transition, stroke-dashoffset 1s linear)
#svg #bar #svg #bar
stroke: $activeColor theme('stroke', '$activeColor')
vendorize(transform, rotate(270deg)) vendorize(transform, rotate(270deg))
vendorize(transform-origin, center center) vendorize(transform-origin, center center)
@ -28,14 +28,14 @@ $circleSize = 46px
font-weight: 700 font-weight: 700
font-size: 17px font-size: 17px
text-align: center text-align: center
color: $activeColor theme('color', '$activeColor')
top: 0 top: 0
svg svg
fill: $activeColor theme('fill', '$activeColor')
left: 50% left: 50%
position: absolute position: absolute
stroke: $activeColor theme('stroke', '$activeColor')
top: 50% top: 50%
transform(translateX(-50%) translateY(-50%)) transform(translateX(-50%) translateY(-50%))

18
Packages/lesiontracker/client/components/studySeriesQuickSwitch/studySeriesQuickSwitch.styl
View File

@ -15,7 +15,7 @@ $seriesSpacing = 2px
transform(translateX(-50%)) transform(translateX(-50%))
&.left &.left
border-right: 1px solid $uiBorderColor theme('border-right', '1px solid $uiBorderColor')
right: 50% right: 50%
&.right &.right
@ -26,7 +26,7 @@ $seriesSpacing = 2px
z-index: 3 z-index: 3
&:before &:before
background-color: $primaryBackgroundColor theme('background-color', '$primaryBackgroundColor')
bottom: 0 bottom: 0
content: '' content: ''
left: 0 left: 0
@ -98,10 +98,10 @@ $seriesSpacing = 2px
.studyTimepointBrowser .studyTimepointBrowser
background-color: transparent background-color: transparent
.studyTimepointStudy.active .studyModality .studyTimepointStudy.active .studyModality
box-shadow: inset 0 0 0 3px $activeColor theme('box-shadow', 'inset 0 0 0 3px $activeColor')
.studyBox .studyBox
background-color: $uiGrayDark theme('background-color', '$uiGrayDark')
border: solid 1px $activeColor theme('border', 'solid 1px $activeColor')
border-radius: 11px border-radius: 11px
display: block display: block
height: $switchSize height: $switchSize
@ -113,7 +113,7 @@ $seriesSpacing = 2px
width: $switchSize + $seriesSpacing width: $switchSize + $seriesSpacing
.seriesItem .seriesItem
background-color: $boxBackgroundColorDark theme('background-color', '$boxBackgroundColor')Dark
border-radius: 3px border-radius: 3px
height: 15px height: 15px
margin: $seriesSpacing margin: $seriesSpacing
@ -121,17 +121,17 @@ $seriesSpacing = 2px
&.count &.count
background-color: transparent background-color: transparent
color: $textPrimaryColor theme('color', '$textPrimaryColor')
font-size: 12px font-size: 12px
font-weight: 500 font-weight: 500
line-height: 17px line-height: 17px
text-align: center text-align: center
&.active &.active
background-color: $activeColor theme('background-color', '$activeColor')
.label .label
color: $textSecondaryColor theme('color', '$textSecondaryColor')
display: block display: block
font-size: 12px font-size: 12px
font-weight: 300 font-weight: 300

18
Packages/lesiontracker/client/components/studyTimepointBrowser/studyTimepointBrowser.styl
View File

@ -3,15 +3,15 @@
$timepointButtonHeight = 55px $timepointButtonHeight = 55px
.studyTimepointBrowser .studyTimepointBrowser
background-color: $primaryBackgroundColor theme('background-color', '$primaryBackgroundColor')
float: left float: left
height: 100% height: 100%
position: relative position: relative
width: 100% width: 100%
.timepointButtonContainer .timepointButtonContainer
background-color: $primaryBackgroundColor theme('background-color', '$primaryBackgroundColor')
border-bottom: 1px solid $uiBorderColor theme('border-bottom', '1px solid $uiBorderColor')
display: none display: none
height: $timepointButtonHeight height: $timepointButtonHeight
left: 10px left: 10px
@ -38,7 +38,7 @@ $timepointButtonHeight = 55px
transform: rotateX(180deg) transform: rotateX(180deg)
.timepointFollowupTitle .timepointFollowupTitle
font-size: 14px font-size: 14px
color: $textSecondaryColor theme('color', '$textSecondaryColor')
text-transform: uppercase text-transform: uppercase
.timepointHeader .timepointHeader
@ -50,7 +50,7 @@ $timepointButtonHeight = 55px
.timepointFollowupTitle .timepointFollowupTitle
.timepointDate .timepointDate
.timepointModalities .timepointModalities
color: $textSecondaryColor theme('color', '$textSecondaryColor')
transition($sidebarTransition) transition($sidebarTransition)
&:hover &:hover
@ -59,7 +59,7 @@ $timepointButtonHeight = 55px
.expandIcon i .expandIcon i
.timepointDate .timepointDate
.timepointModalities .timepointModalities
color: $textPrimaryColor !important theme('color', '$textPrimaryColor') !important
.timepointDetails .timepointDetails
.timepointModalities .timepointModalities
@ -70,10 +70,10 @@ $timepointButtonHeight = 55px
overflow: hidden overflow: hidden
.expandIcon i .expandIcon i
color: $defaultColor theme('color', '$defaultColor')
.timepointFollowupTitle .timepointFollowupTitle
color: $textPrimaryColor theme('color', '$textPrimaryColor')
padding-top: 2px padding-top: 2px
.studyTimepointScrollArea .studyTimepointScrollArea
@ -91,7 +91,7 @@ $timepointButtonHeight = 55px
margin-right: 16px margin-right: 16px
.studySidebarTimepoint .thumbnailEntry.active:before .studySidebarTimepoint .thumbnailEntry.active:before
background-color: $activeColor theme('background-color', '$activeColor')
border-top-right-radius: 7px border-top-right-radius: 7px
border-bottom-right-radius: 7px border-bottom-right-radius: 7px
content: '' content: ''

20
Packages/lesiontracker/client/components/studyTimepointBrowser/studyTimepointStudy.styl
View File

@ -3,8 +3,6 @@
$boxBorderColor = transparent $boxBorderColor = transparent
$boxHoverBackgroundColor = #14191E $boxHoverBackgroundColor = #14191E
$boxHoverBorderColor = #2d4660 $boxHoverBorderColor = #2d4660
$boxActiveBackgroundColor = $activeColor
$boxActiveTextColor = $primaryBackgroundColor
$boxActiveBorderColor = #131D29 $boxActiveBorderColor = #131D29
$boxWidth = 50px $boxWidth = 50px
$borderThickness = 2px $borderThickness = 2px
@ -41,11 +39,11 @@ $spacerY = 12px
&.active &.active
.studyModality .studyModality
.studyModalityBox .studyModalityBox
color: $boxActiveTextColor theme('color', '$primaryBackgroundColor')
& &
&:before &:before
&:after &:after
background-color: $boxActiveBackgroundColor theme('background-color', '$activeColor')
border-color: $boxActiveBorderColor border-color: $boxActiveBorderColor
&:not(.active) .studyTimepointThumbnails &:not(.active) .studyTimepointThumbnails
@ -69,10 +67,10 @@ $spacerY = 12px
border-color: $boxHoverBorderColor border-color: $boxHoverBorderColor
&.additional &.additional
color: $textSecondaryColor theme('color', '$textSecondaryColor')
&.additional &.additional
color: $textPrimaryColor theme('color', '$textPrimaryColor')
font-size: 16px font-size: 16px
font-weight: normal font-weight: normal
height: 91px height: 91px
@ -89,13 +87,13 @@ $spacerY = 12px
top: $spacerY top: $spacerY
.studyDate .studyDate
margin-top: 8px margin-top: 8px
color: $textSecondaryColor theme('color', '$textSecondaryColor')
.studyDescription .studyDescription
margin-top: 8px margin-top: 8px
color: $textPrimaryColor theme('color', '$textPrimaryColor')
.studyModalityBox .studyModalityBox
color: $textSecondaryColor theme('color', '$textSecondaryColor')
line-height: $boxWidth line-height: $boxWidth
margin-left: $nestingMargin * 2 margin-left: $nestingMargin * 2
margin-top: $nestingMargin * 2 margin-top: $nestingMargin * 2
@ -109,8 +107,8 @@ $spacerY = 12px
& &
&:before &:before
&:after &:after
background-color: $boxBackgroundColor theme('border', '$borderThickness solid $primaryBackgroundColor')
border: $borderThickness solid $primaryBackgroundColor theme('background-color', '$boxBackgroundColor')
border-radius: $boxBorderRadius border-radius: $boxBorderRadius
height: $boxWidth + ($borderThickness * 2) height: $boxWidth + ($borderThickness * 2)
transition($sidebarTransition) transition($sidebarTransition)

10
Packages/lesiontracker/client/components/toolbarSection/toolbarSection.styl
View File

@ -1,7 +1,7 @@
@import "{design}/app" @import "{design}/app"
.toolbarSection .toolbarSection
border-bottom: $uiBorderColor $uiBorderThickness solid theme('border-bottom', '%s solid $uiBorderColor' % $uiBorderThickness)
flex: 0 0 auto flex: 0 0 auto
height: $toolbarHeight height: $toolbarHeight
overflow: hidden overflow: hidden
@ -14,11 +14,11 @@
height: $toolbarHeight + $toolbarDrawerHeight height: $toolbarHeight + $toolbarDrawerHeight
.toolbarSectionEntry .toolbarSectionEntry
color: $defaultColor theme('color', '$defaultColor')
cursor: pointer cursor: pointer
display: inline-block display: inline-block
fill: $defaultColor theme('fill', '$defaultColor')
margin-top: 3px margin-top: 3px
min-width: 30px min-width: 30px
stroke: $defaultColor theme('stroke', '$defaultColor')
text-align: center text-align: center

8
Packages/lesiontracker/client/components/userAccountMenu/userAccountMenu.styl
View File

@ -5,7 +5,7 @@
height: 100% height: 100%
.dropdown-toggle .dropdown-toggle
color: $defaultColor theme('color', '$defaultColor')
cursor: pointer cursor: pointer
font-size: 13px font-size: 13px
font-weight: 400 font-weight: 400
@ -13,19 +13,19 @@
text-decoration: none text-decoration: none
.menuButton .menuButton
border-left: solid 1px $defaultColor theme('border-left', 'solid 1px $defaultColor')
display: inline-block display: inline-block
height: 18px height: 18px
padding: 0 8px padding: 0 8px
.fa .fa
color: $defaultColor theme('color', '$defaultColor')
font-size: 17px font-size: 17px
line-height: 18px line-height: 18px
.caret-down .caret-down
theme('color', '$uiLightGray')
margin: 0 4px 4px 2px margin: 0 4px 4px 2px
color: $uiLightGray
ul.dropdown-menu ul.dropdown-menu
li li

2
Packages/lesiontracker/client/components/viewer/viewer.styl
View File

@ -19,4 +19,4 @@
&:not(:last-child) &:not(:last-child)
.removable .removable
.imageViewerViewport .imageViewerViewport
border-right: $uiBorderThickness solid $uiBorderColor theme('border-right', '%s solid $uiBorderColor' % $uiBorderThickness)

2
Packages/viewerbase/client/components/basic/aboutModal/aboutModal.styl
View File

@ -6,7 +6,7 @@
display: inline-block display: inline-block
font-family: $logoFontFamily font-family: $logoFontFamily
font-weight: $logoFontWeight font-weight: $logoFontWeight
color: $textPrimaryColor theme('color', '$textPrimaryColor')
font-size: 20pt font-size: 20pt
line-height: 45px line-height: 45px
text-decoration: none text-decoration: none

10
Packages/viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.styl
View File

@ -1,15 +1,15 @@
@import "{design}/app" @import "{design}/app"
.thumbnailEntry.active .imageThumbnail .thumbnailEntry.active .imageThumbnail
border-color: $activeColor theme('border-color', '$activeColor')
box-shadow: none box-shadow: none
transition($sidebarTransition) transition($sidebarTransition)
.imageThumbnail .imageThumbnail
background-color: $primaryBackgroundColor theme('box-shadow', 'inset 0 0 0 1px $uiBorderColorDark')
theme('background-color', '$primaryBackgroundColor')
border: 5px solid transparent border: 5px solid transparent
border-radius: 12px border-radius: 12px
box-shadow: inset 0 0 0 1px $uiBorderColorDark
height: 135px height: 135px
margin: 0 auto margin: 0 auto
padding 1px 7px padding 1px 7px
@ -18,7 +18,7 @@
width: 217px width: 217px
&:hover &:hover
border-color: $hoverColor theme('border-color', '$hoverColor')
box-shadow: none box-shadow: none
.imageThumbnailCanvas .imageThumbnailCanvas
@ -28,7 +28,7 @@
.thumbnailLoadingIndicator .thumbnailLoadingIndicator
display: none display: none
pointer-events: none pointer-events: none
color: $textSecondaryColor theme('color', '$textSecondaryColor')
height: 20px height: 20px
width: 100% width: 100%
top: 0 top: 0

10
Packages/viewerbase/client/components/studyBrowser/thumbnailEntry/thumbnailEntry.styl
View File

@ -13,7 +13,7 @@ $seriesCountBackgroundColor = #678696
cursor: -moz-grab cursor: -moz-grab
.seriesDetails .seriesDetails
color: $textPrimaryColor theme('color', '$textPrimaryColor')
font-size: 14px font-size: 14px
line-height: 1.3em line-height: 1.3em
min-height: 36px min-height: 36px
@ -33,7 +33,7 @@ $seriesCountBackgroundColor = #678696
margin-right: 4px margin-right: 4px
.seriesInformationNumbers .seriesInformationNumbers
color: $textSecondaryColor theme('color', '$textSecondaryColor')
float: left float: left
font-size: 12px font-size: 12px
@ -42,7 +42,7 @@ $seriesCountBackgroundColor = #678696
text-align: right text-align: right
strong strong
color: $activeColor theme('color', '$activeColor')
font-size: 10px font-size: 10px
font-weight: 900 font-weight: 900
@ -52,7 +52,7 @@ $seriesCountBackgroundColor = #678696
position: relative position: relative
&:after &:after
background-color: $activeColor theme('background-color', '$activeColor')
box-shadow: 1px 1px rgba(0, 0, 0, .115) box-shadow: 1px 1px rgba(0, 0, 0, .115)
left: -5px left: -5px
position: absolute position: absolute
@ -60,7 +60,7 @@ $seriesCountBackgroundColor = #678696
& &
&:after &:after
border: 1px solid $primaryBackgroundColor theme('border', '1px solid $primaryBackgroundColor')
content: '' content: ''
display: block display: block
height: 11px height: 11px

10
Packages/viewerbase/client/components/viewer/annotationDialogs/annotationDialogs.styl
View File

@ -1,6 +1,9 @@
@import "{design}/app.styl" @import "{design}/app.styl"
.annotationDialog .annotationDialog
theme('border', '1px solid $uiBorderColor')
theme('background', '$uiGrayDarkest')
theme('color', '$textSecondaryColor')
display: none display: none
z-index: 1000 z-index: 1000
position: absolute position: absolute
@ -9,17 +12,12 @@
left: 0 left: 0
right: 0 right: 0
margin: auto margin: auto
overflow: hidden overflow: hidden
padding: 10px padding: 10px
width: 300px width: 300px
height: 140px height: 140px
opacity: 0.95 opacity: 0.95
border-radius: 8px border-radius: 8px
border: 1px solid $uiBorderColor
background: $uiGrayDarkest
color: $textSecondaryColor
h5, label h5, label
font-weight: 400 font-weight: 400
@ -31,4 +29,4 @@
margin-left: 5px margin-left: 5px
.annotationDialogConfirm .annotationDialogConfirm
float: right float: right

18
Packages/viewerbase/client/components/viewer/cineDialog/cineDialog.styl
View File

@ -1,6 +1,9 @@
@import "{design}/app.styl" @import "{design}/app.styl"
#cineDialog #cineDialog
theme('border', '1px solid $uiBorderColor')
theme('background', '$uiGrayDarkest')
theme('color', '$textSecondaryColor')
display: none display: none
z-index: 1000 z-index: 1000
position: absolute position: absolute
@ -8,17 +11,12 @@
left: auto left: auto
bottom: 3px bottom: 3px
right: 3px right: 3px
overflow: hidden overflow: hidden
padding: 10px padding: 10px
width: 300px width: 300px
height: 175px height: 175px
opacity: 0.95 opacity: 0.95
border-radius: 8px border-radius: 8px
border: 1px solid $uiBorderColor
background: $uiGrayDarkest
color: $textSecondaryColor
h5, label h5, label
font-weight: 400 font-weight: 400
@ -26,18 +24,18 @@
box-sizing: border-box box-sizing: border-box
.btn .btn
background: $uiGrayDarkest theme('background', '$uiGrayDarkest')
color: $textSecondaryColor theme('color', '$textSecondaryColor')
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active, &.active &:active, &.active
color: $activeColor theme('color', '$activeColor')
#cineOptions #cineOptions
padding: 5px 0 padding: 5px 0
overflow: auto overflow: auto
#loopSection #loopSection
padding-right: 12px padding-right: 12px

12
Packages/viewerbase/client/components/viewer/imageControls/imageControls.styl
View File

@ -75,7 +75,7 @@ $imageSliderCursor = grab
// --- Style the range thumb --- // // --- Style the range thumb --- //
&::-webkit-slider-thumb &::-webkit-slider-thumb
-webkit-appearance: none !important -webkit-appearance: none !important
background-color: $imageSliderColor theme('background-color', '$imageSliderColor')
border-radius: $imageSliderBorderRadius border-radius: $imageSliderBorderRadius
border: $imageSliderBorder border: $imageSliderBorder
height: $imageSliderWidth height: $imageSliderWidth
@ -84,10 +84,10 @@ $imageSliderCursor = grab
margin-top: -7px margin-top: -7px
&:active &:active
background-color: $activeColor theme('background-color', '$activeColor')
&::-moz-range-thumb &::-moz-range-thumb
background-color: $imageSliderColor theme('background-color', '$imageSliderColor')
border-radius: $imageSliderBorderRadius border-radius: $imageSliderBorderRadius
border: $imageSliderBorder border: $imageSliderBorder
height: $imageSliderWidth height: $imageSliderWidth
@ -96,10 +96,10 @@ $imageSliderCursor = grab
z-index: 7 z-index: 7
&:active &:active
background-color: $activeColor theme('background-color', '$activeColor')
&::-ms-thumb &::-ms-thumb
background-color: $imageSliderColor theme('background-color', '$imageSliderColor')
border-radius: $imageSliderBorderRadius border-radius: $imageSliderBorderRadius
border: $imageSliderBorder border: $imageSliderBorder
height: $imageSliderWidth height: $imageSliderWidth
@ -107,7 +107,7 @@ $imageSliderCursor = grab
cursor: $imageSliderCursor cursor: $imageSliderCursor
&:active &:active
background-color: $activeColor theme('background-color', '$activeColor')
// Set left position in IE, border-width attribute breaks left position of imageSlider // Set left position in IE, border-width attribute breaks left position of imageSlider
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)

2
Packages/viewerbase/client/components/viewer/imageViewerViewport/imageViewerViewport.styl
View File

@ -15,7 +15,7 @@
.viewportInstructions .viewportInstructions
display: none display: none
font-size: 13px font-size: 13px
color: $textSecondaryColor theme('color', '$textSecondaryColor')
line-height: 18px line-height: 18px
pointer-events: none // Necessary for drag/drop through to cornerstone element below pointer-events: none // Necessary for drag/drop through to cornerstone element below
text-align: center text-align: center

15
Packages/viewerbase/client/components/viewer/layoutChooser/layoutChooser.styl
View File

@ -3,29 +3,28 @@
$borderColor = rgba(77, 99, 110, 0.81) $borderColor = rgba(77, 99, 110, 0.81)
.layoutChooser .layoutChooser
theme('background', '$uiGrayDarkest')
width: 92px width: 92px
height: 92px height: 92px
min-width: 92px // to override bootstrap's dropdown-menu class min-width: 92px // to override bootstrap's dropdown-menu class
min-height: 92px min-height: 92px
// theme('background-color', '$primaryBackgroundColor')
//background-color: $primaryBackgroundColor
opacity: 0.95 opacity: 0.95
border-radius: 8px border-radius: 8px
border: 1px solid $borderColor; border: 1px solid $borderColor;
background: $uiGrayDarkest
&.open &.open
display: block display: block
table table
margin: 0 auto margin: 0 auto
td td
theme('border', '1px solid $uiBorderColorDark')
cursor: pointer cursor: pointer
border: 1px solid $uiBorderColorDark
width: 20px
height: 20px height: 20px
transition(background-color 0.1s ease) transition(background-color 0.1s ease)
width: 20px
&:hover, &.hover // Add the hover class here to be triggered by mouseenter/mouseleave &:hover, &.hover // Add the hover class here to be triggered by mouseenter/mouseleave
background-color: $activeColor theme('background-color', '$activeColor')

14
Packages/viewerbase/client/components/viewer/loadingIndicator/loadingIndicator.styl
View File

@ -1,21 +1,21 @@
@import "{design}/app.styl" @import "{design}/app.styl"
.imageViewerLoadingIndicator .imageViewerLoadingIndicator
color: $textSecondaryColor theme('color', '$textSecondaryColor')
.faded .faded
opacity: 0.5 opacity: 0.5
.imageViewerErrorLoadingIndicator .imageViewerErrorLoadingIndicator
color: $uiYellow theme('color', '$uiYellow')
p, h4 p, h4
text-align: center text-align: center
padding: 4px 0 padding: 4px 0
p p
font-size: 11pt font-size: 11pt
.loadingIndicator .loadingIndicator
display: none display: none
pointer-events: none // Necessary for click-through to cornerstone element below pointer-events: none // Necessary for click-through to cornerstone element below
@ -26,11 +26,11 @@
font-size: 18px font-size: 18px
z-index: 100 z-index: 100
background-color: rgba(0,0,0,0.75) background-color: rgba(0,0,0,0.75)
.indicatorContents .indicatorContents
position: absolute position: absolute
top: 40% top: 40%
width: 100% width: 100%
font-size: 30px font-size: 30px
font-weight: 300 font-weight: 300
text-align: center text-align: center

24
Packages/viewerbase/client/components/viewer/toolbarSectionButton/toolbarSectionButton.styl
View File

@ -2,9 +2,9 @@
.toolbarSectionButton .toolbarSectionButton
display: inline-block display: inline-block
color: $defaultColor theme('color', '$defaultColor')
fill: $defaultColor theme('fill', '$defaultColor')
stroke: $defaultColor theme('stroke', '$defaultColor')
min-width: 30px min-width: 30px
cursor: pointer cursor: pointer
text-align: center text-align: center
@ -14,7 +14,7 @@
cursor: not-allowed cursor: not-allowed
.buttonLabel .buttonLabel
color: $textSecondaryColor theme('color', '$textSecondaryColor')
font-size: 12px font-size: 12px
font-weight: 500 font-weight: 500
@ -34,22 +34,22 @@
&:hover &:hover
.buttonLabel .buttonLabel
color: $hoverColor theme('color', '$hoverColor')
svg svg
fill: $hoverColor theme('fill', '$hoverColor')
stroke: $hoverColor theme('stroke', '$hoverColor')
i i
color: $hoverColor theme('color', '$hoverColor')
&:active, &.active &:active, &.active
.buttonLabel .buttonLabel
color: $activeColor theme('color', '$activeColor')
svg svg
fill: $activeColor theme('fill', '$activeColor')
stroke: $activeColor theme('stroke', '$activeColor')
i i
color: $activeColor theme('color', '$activeColor')

4
Packages/viewerbase/client/components/viewer/toolbarSectionTools/toolbarSectionTools.styl
View File

@ -14,9 +14,9 @@ $distance = 12px
white-space: nowrap white-space: nowrap
.toolbarSectionDrawer .toolbarSectionDrawer
background-color: $uiGrayDarker theme('background-color', '$uiGrayDarker')
border-radius: 7px border-radius: 7px
color: $textPrimaryColor theme('color', '$textPrimaryColor')
content: '' content: ''
display: block display: block
font-size: 18px font-size: 18px

10
Packages/viewerbase/client/components/viewer/viewerMain/viewerMain.styl
View File

@ -11,8 +11,8 @@
#imageViewerViewports #imageViewerViewports
.viewportContainer .viewportContainer
theme('border', '%s solid $uiBorderColorDark' % $viewportBorderThickness)
float: left float: left
border: $viewportBorderThickness solid $viewportBorderColor
outline: 0 // Prevent blue outline in Chrome outline: 0 // Prevent blue outline in Chrome
@ -22,12 +22,12 @@
outline: 0 // Prevent blue outline in Chrome outline: 0 // Prevent blue outline in Chrome
&:hover &:hover
border: $viewportBorderThickness solid $viewportBorderColorHover theme('border', '%s solid $uiBorderColor' % $viewportBorderThickness)
&.active, &:hover.active &.active, &:hover.active
border: $viewportBorderThickness solid $viewportBorderColorActive theme('border', '%s solid $uiBorderColorActive' % $viewportBorderThickness)
.removable .removable
width: 100% width: 100%
height: 100% height: 100%
position: relative // Necessary so that the viewportOverlay is on top of the viewports position: relative // Necessary so that the viewportOverlay is on top of the viewports

2
Packages/viewerbase/client/components/viewer/viewportOverlay/viewportOverlay.styl
View File

@ -3,7 +3,7 @@
$viewportTagPadding = 20px $viewportTagPadding = 20px
.imageViewerViewportOverlay .imageViewerViewportOverlay
color: $textSecondaryColor theme('color', '$textSecondaryColor')
.dicomTag .dicomTag
position: absolute position: absolute

2
Packages/worklist/client/components/studyContextMenu/studyContextMenu.styl
View File

@ -50,7 +50,7 @@
color: black color: black
&:not(.disabled):hover &:not(.disabled):hover
color: $activeColor theme('color', '$activeColor')
text-decoration: none text-decoration: none
&.disabled &.disabled

8
Packages/worklist/client/components/worklist.styl
View File

@ -1,17 +1,17 @@
@import "{design}/app" @import "{design}/app"
body body
background-color: $primaryBackgroundColor theme('background-color', '$primaryBackgroundColor')
#tblStudyList #tblStudyList
tr tr
height: 20px height: 20px
#worklistTab #worklistTab
background-color: $primaryBackgroundColor theme('background-color', '$primaryBackgroundColor')
.worklistContainer .worklistContainer
background-color: $primaryBackgroundColor theme('background-color', '$primaryBackgroundColor')
margin: 0 auto margin: 0 auto
color: white color: white
float: left; float: left;
@ -22,7 +22,7 @@ body
height: calc(100% - 91px) height: calc(100% - 91px)
.loadingTextDiv .loadingTextDiv
color: $textSecondaryColor theme('color', '$textSecondaryColor')
font-size: 30px font-size: 30px
.tab-pane .tab-pane

39
Packages/worklist/client/components/worklistResult/worklistResult.styl
View File

@ -1,20 +1,19 @@
@import "{design}/app" @import "{design}/app"
$hoverColor = #2c363f $tableHoverColor = #2c363f
$textPrimaryColor = white $tableTextPrimaryColor = white
$textSecondaryColor = #91b9cd $tableTextSecondaryColor = #91b9cd
$inputBackgroundColor = #2c363f $inputBackgroundColor = #2c363f
$inputPlaceholderColor = lightgray $inputPlaceholderColor = lightgray
$studyListToolbarHeight = 75px $studyListToolbarHeight = 75px
$theadBackgroundColor = $uiGrayDarker
$tablePadding = 8% $tablePadding = 8%
$bodyCellHeight = 40px $bodyCellHeight = 40px
.studyListToolbar .studyListToolbar
theme('background', '$uiGrayDarker')
height: $studyListToolbarHeight height: $studyListToolbarHeight
background: $uiGrayDarker
border-bottom: 2px solid black border-bottom: 2px solid black
padding: 0 30px padding: 0 30px
@ -24,7 +23,7 @@ $bodyCellHeight = 40px
.header .header
font-size: 22px font-size: 22px
font-weight: 300 font-weight: 300
color: $textSecondaryColor color: $tableTextSecondaryColor
padding: 0 10px padding: 0 10px
line-height: $studyListToolbarHeight line-height: $studyListToolbarHeight
@ -33,14 +32,14 @@ $bodyCellHeight = 40px
line-height: $studyListToolbarHeight line-height: $studyListToolbarHeight
.studyCount .studyCount
theme('color', '$uiSkyBlue')
font-size: 40px font-size: 40px
font-weight: 100 font-weight: 100
color: $uiSkyBlue
padding: 0 10px padding: 0 10px
line-height: $studyListToolbarHeight line-height: $studyListToolbarHeight
.theadBackground .theadBackground
background-color: $theadBackgroundColor theme('background-color', '$uiGrayDarker')
width: 100% width: 100%
height: 122px height: 122px
position: absolute position: absolute
@ -54,18 +53,18 @@ $bodyCellHeight = 40px
z-index: 2 z-index: 2
.loadingTextDiv .loadingTextDiv
color: $textSecondaryColor color: $tableTextSecondaryColor
font-size: 30px font-size: 30px
.notFound .notFound
color: $textSecondaryColor color: $tableTextSecondaryColor
font-size: 30px font-size: 30px
font-weight: 200 font-weight: 200
text-align: center text-align: center
table#tblStudyList table#tblStudyList
thead thead
background-color: $theadBackgroundColor theme('background-color', '$uiGrayDarker')
white-space: nowrap white-space: nowrap
tr tr
@ -85,7 +84,7 @@ $bodyCellHeight = 40px
width: 100% width: 100%
min-width: 95px min-width: 95px
margin: 0 auto margin: 0 auto
color: $textPrimaryColor color: $tableTextPrimaryColor
font-weight: 400 font-weight: 400
padding: 20px padding: 20px
@ -97,10 +96,10 @@ $bodyCellHeight = 40px
margin: 0 5px margin: 0 5px
&:hover &:hover
color: $activeColor theme('color', '$activeColor')
&.active, &:active &.active, &:active
color: $activeColor theme('color', '$activeColor')
input.worklist-search input.worklist-search
height: 34px height: 34px
@ -136,16 +135,15 @@ $bodyCellHeight = 40px
background-color: black background-color: black
&:nth-child(even) &:nth-child(even)
background-color: $uiGrayDarker theme('background-color', '$uiGrayDarker')
td td
height: $bodyCellHeight height: $bodyCellHeight
line-height: $bodyCellHeight line-height: $bodyCellHeight
color: $textPrimaryColor color: $tableTextPrimaryColor
font-weight: 300 font-weight: 300
border-top: 1px solid #436270 border-top: 1px solid #436270
white-space: nowrap white-space: nowrap
transition(all 0.1s ease) transition(all 0.1s ease)
&:first-child &:first-child
@ -155,15 +153,14 @@ $bodyCellHeight = 40px
padding-right: $tablePadding padding-right: $tablePadding
&:hover, &:active, &.active &:hover, &:active, &.active
background-color: $hoverColor background-color: $tableHoverColor
color: white color: white
td td
// This selector is necessary to override bootstrap's 'table' class // This selector is necessary to override bootstrap's 'table' class
border-top: 1px solid #436270 border-top: 1px solid #436270
border-bottom: 1px solid #436270 border-bottom: 1px solid #436270
background-color: $hoverColor background-color: $tableHoverColor
@media only screen and (max-width: 1000px) @media only screen and (max-width: 1000px)
$tablePaddingMediumScreen = 10px $tablePaddingMediumScreen = 10px
@ -188,4 +185,4 @@ $bodyCellHeight = 40px
th.accessionNumber, td.accessionNumber, th.accessionNumber, td.accessionNumber,
th.modalities, td.modalities, th.modalities, td.modalities,
th.numberOfStudyRelatedInstances, td.numberOfStudyRelatedInstances th.numberOfStudyRelatedInstances, td.numberOfStudyRelatedInstances
display: none display: none

6
Packages/worklist/client/components/worklistToolbar/worklistToolbar.styl
View File

@ -5,7 +5,7 @@
margin: 0 10px margin: 0 10px
label label
color: $textSecondaryColor theme('color', '$textSecondaryColor')
font-weight: 400 font-weight: 400
cursor: pointer cursor: pointer
@ -13,10 +13,10 @@
pointer-events: none pointer-events: none
&:hover &:hover
color: $hoverColor theme('color', '$hoverColor')
&:active &:active
color: $activeColor theme('color', '$activeColor')
input input
width: 0.1px; width: 0.1px;