alihan/openmct
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[Frontend] Fixes to un-squish plots

Browse Source 
Fixes #1022
- min-height added to .gl-plot element;
- Moved plot value definitions out of _plots-main
and into _constants and normalized naming;
This commit is contained in:
Charles Hacskaylo
2016-06-16 17:09:58 -07:00
parent 8ac6ac97f0
commit c7e7e0c302
2 changed files with 37 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
platform/commonUI/general/res/sass/plots/_plots-main.scss
View File

@@ -19,12 +19,10 @@
* this source code distribution or the Licensing information page available
* at runtime from the About dialog for additional information.
*****************************************************************************/
$yBarW: 60px;
$yLabelW: 10px;
$xBarH: 32px;
$legendH: 20px;
$swatchD: 8px;
$plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBarW); // Top, right, bottom, left
.abs.holder-plot {
// Fend off the scrollbar when less than min-height;
right: $interiorMargin;
}
.gl-plot {
color: $colorPlotFg;
@@ -32,6 +30,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
position: relative;
width: 100%;
height: 100%;
min-height: $plotMinH;
.gl-plot-local-controls {
@include trans-prop-nice(opacity, 150ms);
@@ -54,17 +53,17 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
top: auto;
right: 0;
bottom: $interiorMargin;
left: $yBarW;
height: $xBarH;
left: $plotYBarW;
height: $plotXBarH;
width: auto;
overflow: hidden;
}
&.gl-plot-y {
top: $legendH + $interiorMargin;
top: $plotLegendH + $interiorMargin;
right: auto;
bottom: nth($plotDisplayArea, 3);
left: 0;
width: $yBarW;
width: $plotYBarW;
}
}
@@ -146,7 +145,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
@include transform(translateY(-50%));
min-width: 150px; // Need this due to enclosure of .select
top: 50%;
left: $yLabelW + $interiorMargin * 2;
left: $plotYLabelW + $interiorMargin * 2;
}
.t-plot-display-controls {
@@ -174,7 +173,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
right: 0;
bottom: auto;
left: 0;
height: $legendH;
height: $plotLegendH;
overflow-x: hidden;
overflow-y: auto;
}
@@ -236,8 +235,8 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.color-swatch {
border-radius: 2px;
display: inline-block;
height: $swatchD;
width: $swatchD;
height: $plotSwatchD;
width: $plotSwatchD;
}
}
}
@@ -249,8 +248,8 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
padding: 0px $itemPadLR;
.plot-color-swatch {
border: 1px solid $colorBodyBg;
height: $swatchD + 1;
width: $swatchD + 1;
height: $plotSwatchD + 1;
width: $plotSwatchD + 1;
}
}
}