diff --git a/platform/commonUI/general/res/sass/controls/_buttons.scss b/platform/commonUI/general/res/sass/controls/_buttons.scss index 17e03941df..fe2c6d660c 100644 --- a/platform/commonUI/general/res/sass/controls/_buttons.scss +++ b/platform/commonUI/general/res/sass/controls/_buttons.scss @@ -104,9 +104,17 @@ body.desktop .mini-tab-icon { } } +@mixin btnSetButtonFirst() { + @include border-left-radius($controlCr); + margin-left: 0; +} + +@mixin btnSetButtonLast() { + @include border-right-radius($controlCr); +} + .l-btn-set { // Buttons that have a very tight conceptual grouping - no internal space between them. - // Structure: .btn-set > mct-representation class=first|last > .s-button font-size: 0; // Remove space between s-button elements due to white space in markup .s-button { @@ -114,20 +122,16 @@ body.desktop .mini-tab-icon { margin-left: 1px; } - .first { - .s-button, - &.s-button { - @include border-left-radius($controlCr); - margin-left: 0; - } + > .s-button { + // Styles for .s-button as immediate descendants in .l-btn-set + &:first-child { @include btnSetButtonFirst(); } + &:last-child { @include btnSetButtonLast(); } } - .last { - .s-button, - &.s-button { - @include border-right-radius($controlCr); - } - } + // Must use following due to DOM structure of action buttons, + // which have structure like .l-btn-set > mct-representation class=first|last > .s-button + .first > .s-button { @include btnSetButtonFirst(); } + .last > .s-button { @include btnSetButtonLast(); } } .paused { diff --git a/platform/features/plot/res/templates/plot.html b/platform/features/plot/res/templates/plot.html index 461389e2c1..53b5d348b0 100644 --- a/platform/features/plot/res/templates/plot.html +++ b/platform/features/plot/res/templates/plot.html @@ -23,12 +23,12 @@ class="abs holder holder-plot has-control-bar">
- PNG - JPG