diff --git a/src/stylesheet/widgets/_level-bar.scss b/src/stylesheet/widgets/_level-bar.scss index 512b3b3aefdaa0970edded87823d98cf4d642496..ccbcf3f7729d2115675b0d85d887f7e79cae3d6a 100644 --- a/src/stylesheet/widgets/_level-bar.scss +++ b/src/stylesheet/widgets/_level-bar.scss @@ -1,7 +1,11 @@ -$_levelbar_size: 9px; -$_levelbar_border_radius: 5px; +$_levelbar_size: 11px; +$_levelbar_border_radius: 6px; levelbar { + &:disabled { + filter: opacity(.5); + } + &.horizontal { trough > block { min-height: $_levelbar_size; @@ -23,9 +27,9 @@ levelbar { // segmented level bar &.discrete > trough > block { - min-height: 2px; + min-height: $_levelbar_size - 7px; margin: 1px; - min-width: 24px; + min-width: 26px; border-radius: 0; &:first-child { @@ -41,13 +45,28 @@ levelbar { &.vertical { trough > block { min-width: $_levelbar_size; - border-radius: $_levelbar_border_radius; + border-radius: $_levelbar_border_radius $_levelbar_border_radius 0 0; + + &.empty, + &.full { + border-radius: $_levelbar_border_radius; + } } + // segmented level bar &.discrete > trough > block { min-width: $_levelbar_size - 7px; - margin: 1px 0; - min-height: 32px; + margin: 1px; + min-height: 26px; + border-radius: 0; + + &:first-child { + border-radius: 2px 2px 0 0; + } + + &:last-child { + border-radius: 0 0 2px 2px; + } } } @@ -56,27 +75,25 @@ levelbar { // level bar colours > block { - border: 1px solid; - &.low { - border-color: $warning_color; background-color: $warning_color; } &.high, &:not(.empty) { - border-color: $selected_bg_color; background-color: $selected_bg_color; } &.full { - border-color: $success_color; background-color: $success_color; } &.empty { - background-color: darken($bg_color, 5%); - border-color: darken($bg_color, 5%); + background-color: transparentize($text_color, .85); + + @if $contrast == "high" { + box-shadow: inset 0 0 0 1px $borders_color; + } } } }