ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-05-05 02:03:00 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #1024 from nasa/plots-1022

Browse Source 
R&I un-squished plots fix
This commit is contained in:
Victor Woeltjen 2016-06-17 10:36:40 -07:00 committed by GitHub
commit 53e8e7c688
2 changed files with 37 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
platform/commonUI/general/res/sass/_constants.scss
View File

@ -49,7 +49,7 @@ $uePaneMiniTabCollapsedW: 11px;
$ueEditLeftPaneW: 75%; $ueEditLeftPaneW: 75%;
$treeSearchInputBarH: 25px; $treeSearchInputBarH: 25px;
$ueTimeControlH: (33px, 18px, 20px); $ueTimeControlH: (33px, 18px, 20px);
// Panes /*************** Panes */
$ueBrowseLeftPaneTreeMinW: 150px; $ueBrowseLeftPaneTreeMinW: 150px;
$ueBrowseLeftPaneTreeMaxW: 35%; $ueBrowseLeftPaneTreeMaxW: 35%;
$ueBrowseLeftPaneTreeW: 25%; $ueBrowseLeftPaneTreeW: 25%;
@ -57,48 +57,59 @@ $ueBrowseRightPaneInspectMinW: 200px;
$ueBrowseRightPaneInspectMaxW: 35%; $ueBrowseRightPaneInspectMaxW: 35%;
$ueBrowseRightPaneInspectW: 20%; $ueBrowseRightPaneInspectW: 20%;
$ueDesktopMinW: 600px; $ueDesktopMinW: 600px;
/*************** Overlay */
// Overlay
$ovrTopBarH: 45px; $ovrTopBarH: 45px;
$ovrFooterH: 24px; $ovrFooterH: 24px;
$overlayMargin: 25px; $overlayMargin: 25px;
// Items /*************** Items */
$ueBrowseGridItemLg: 200px; $ueBrowseGridItemLg: 200px;
$ueBrowseGridItemTopBarH: 20px; $ueBrowseGridItemTopBarH: 20px;
$ueBrowseGridItemBottomBarH: 30px; $ueBrowseGridItemBottomBarH: 30px;
$itemPadLR: 5px; $itemPadLR: 5px;
// Tree /*************** Tree */
$treeVCW: 10px; $treeVCW: 10px;
$treeTypeIconH: 1.4em; // was 16px $treeTypeIconH: 1.4em; // was 16px
$treeTypeIconHPx: 16px; $treeTypeIconHPx: 16px;
$treeTypeIconW: 18px; $treeTypeIconW: 18px;
$treeContextTriggerW: 20px; $treeContextTriggerW: 20px;
// Tabular /*************** Tabular */
$tabularHeaderH: 22px; //18px $tabularHeaderH: 22px; //18px
$tabularTdPadLR: $itemPadLR; $tabularTdPadLR: $itemPadLR;
$tabularTdPadTB: 3px; $tabularTdPadTB: 3px;
// Imagery /*************** Imagery */
$imageMainControlBarH: 25px; $imageMainControlBarH: 25px;
$imageThumbsD: 120px; $imageThumbsD: 120px;
$imageThumbsWrapperH: $imageThumbsD * 1.4; $imageThumbsWrapperH: $imageThumbsD * 1.4;
$imageThumbPad: 1px; $imageThumbPad: 1px;
// Ticks /*************** Ticks */
$ticksH: 25px; $ticksH: 25px;
$tickLblVMargin: 3px; $tickLblVMargin: 3px;
$tickLblH: 15px; $tickLblH: 15px;
$tickLblW: 50px; $tickLblW: 50px;
$tickH: $ticksH - $tickLblVMargin - $tickLblH; $tickH: $ticksH - $tickLblVMargin - $tickLblH;
$tickW: 1px; $tickW: 1px;
// Bubbles /*************** Plots */
$plotYBarW: 60px;
$plotYLabelMinH: 20px;
$plotYLabelW: 10px;
$plotXBarH: 32px;
$plotLegendH: 20px;
$plotSwatchD: 8px;
// 1: Top, 2: right, 3: bottom, 4: left
$plotDisplayArea: ($plotLegendH + $interiorMargin, 0, $plotXBarH + $interiorMargin, $plotYBarW);
/* Based on current implementation of ~ 5 ticks per plot element;
Include legend, plot-display-area and X ticks */
$plotMinH: $plotLegendH + ($interiorMargin * 2) + ($plotYLabelMinH * 5) + nth($plotDisplayArea,3);
/*************** Bubbles */
$bubbleArwSize: 10px; $bubbleArwSize: 10px;
$bubblePad: $interiorMargin; $bubblePad: $interiorMargin;
$bubbleMinW: 100px; $bubbleMinW: 100px;
$bubbleMaxW: 300px; $bubbleMaxW: 300px;
// Forms /*************** Forms */
$reqSymbolW: 15px; $reqSymbolW: 15px;
$reqSymbolM: $interiorMargin * 2; $reqSymbolM: $interiorMargin * 2;
$reqSymbolFontSize: 0.7em; $reqSymbolFontSize: 0.7em;
// Wait Spinner Defaults /*************** Wait Spinner Defaults */
$waitSpinnerD: 32px; $waitSpinnerD: 32px;
$waitSpinnerTreeD: 20px; $waitSpinnerTreeD: 20px;
$waitSpinnerBorderW: 5px; $waitSpinnerBorderW: 5px;

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