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

Merged from master

Browse Source
This commit is contained in:
Henry
2015-11-25 09:04:11 -08:00
parent 7849803a5d
commit 268a2c2427
64 changed files with 3200 additions and 231 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
platform/commonUI/general/res/sass/controls/_buttons.scss
View File

@@ -108,10 +108,7 @@ $pad: $interiorMargin * $baseRatio;
.s-icon-btn {
@extend .ui-symbol;
color: $colorBtnIcon;
&:hover {
color: lighten($colorBtnIcon, $ltGamma);
}
// Color and styling additionally in _controls.scss
}
.mini-tab {

3
platform/commonUI/general/res/sass/controls/_controls.scss
View File

@@ -187,7 +187,8 @@ label.checkbox.custom {
}
}
.context-available {
.context-available,
.s-icon-btn {
$c: $colorKey;
color: $c;
&:hover {

52
platform/commonUI/general/res/sass/features/_time-display.scss
View File

@@ -1,46 +1,32 @@
.l-time-display {
$transTime: 200ms;
// Layout
line-height: 140%;
&:hover {
.l-btn.control {
opacity: 1;
}
}
.l-elem-wrapper {
position: relative;
}
.l-elem {
display: inline-block;
}
&.l-timer {
.l-elem.l-value {
@include trans-prop-nice(left, $transTime);
position: absolute;
left: 0;
z-index: 1;
.ui-symbol.direction {
font-size: 0.8em;
}
}
&:hover .l-elem.l-value {
left: 20px;
.control {
@include trans-prop-nice((width, opacity), $transTime);
line-height: inherit;
margin-right: 0;
opacity: 0;
width: 0;
}
&:hover .control {
margin-right: $interiorMargin;
opacity: 1;
width: 1em;
}
}
// Look-and-feel
.l-elem {
.value.active,
&.value.active {
color: $colorKeyFg;
}
}
.l-btn.control {
@include trans-prop-nice-fade($transTime);
opacity: 0;
font-size: 0.65em;
vertical-align: top;
//line-height: 1em;
}
.value {
color: pullForward($colorBodyFg, 50%);
font-weight: 400;
.direction {
font-size: 0.8em;
}
}
}

1
platform/commonUI/general/res/sass/forms/_selects.scss
View File

@@ -25,7 +25,6 @@
margin: 0 0 2px 0; // Needed to avoid dropshadow from being clipped by parent containers
}
padding: 0 $interiorMargin;
overflow: hidden;
position: relative;
line-height: $formInputH;
select {

46
platform/commonUI/general/res/sass/mobile/_constants.scss
View File

@@ -34,51 +34,31 @@ $mobileTreeItemH: 35px;
$mobileTreeItemIndent: 20px;
$mobileTreeRightArrowW: 30px;
/************************** WINDOW DIMENSIONS FOR RWD */
/************************** DEVICE WIDTHS */
// IMPORTANT! Usage assumes that ranges are mutually exclusive and have no gaps
$phoMaxW: 514px;
$phoMaxH: 740px;
$tabMinW: 515px;
$tabMaxW: 799px;
$tabMinH: 741px;
$tabMaxH: 1024px;
$compMinW: 800px;
$compMinH: 1025px;
$tabMaxW: 1280px;
$desktopMinW: 1281px;
/************************** MEDIA QUERIES: WINDOW CHECKS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
$screenPortrait: "screen and (orientation: portrait)";
$screenLandscape: "screen and (orientation: landscape)";
$mobileDevice: "(max-device-width: #{$tabMaxW}) and (max-device-height: #{$tabMaxH})";
$mobileDeviceEmu: "(max-device-width: #{$tabMaxH}) and (max-device-height: #{$tabMaxW})";
$mobileDevice: "(max-device-width: #{$tabMaxW})";
$phonePortraitCheck: "(max-width: #{$phoMaxW}) and (max-height: #{$phoMaxH})";
$phoneLandscapeCheck: "(max-height: #{$phoMaxW}) and (max-width: #{$phoMaxH})";
$tabWidPorCheck: "(min-width: #{$tabMinW}) and (max-width: #{$tabMaxW})";
$tabHeiPorCheck: "(min-height: #{$tabMinH}) and (max-height: #{$tabMaxH})";
$tabletPortraitCheck: "#{$tabWidPorCheck} and #{$tabHeiPorCheck}";
$tabWidLanCheck: "(min-height: #{$tabMinW}) and (max-height: #{$tabMaxW})";
$tabHeiLanCheck: "(min-width: #{$tabMinH}) and (max-width: #{$tabMaxH})";
$tabletLandscapeCheck: "#{$tabWidLanCheck} and #{$tabHeiLanCheck}";
$desktopPortraitCheck: "(min-device-width: #{$compMinW}) and (min-device-height: #{$compMinH})";
$desktopLandscapeCheck: "(min-device-width: #{$compMinH}) and (min-device-height: #{$compMinW})";
$phoneCheck: "(max-device-width: #{$phoMaxW})";
$tabletCheck: $mobileDevice;
$desktopCheck: "(min-device-width: #{$desktopMinW})";
/************************** MEDIA QUERIES: WINDOWS FOR SPECIFIC ORIENTATIONS FOR EACH DEVICE */
$phonePortrait: "#{$screenPortrait} and #{$phonePortraitCheck} and #{$mobileDevice}";
$phoneLandscape: "#{$screenLandscape} and #{$phoneLandscapeCheck} and #{$mobileDevice}";
$phoneLandscapeEmu: "#{$screenLandscape} and #{$phoneLandscapeCheck} and #{$mobileDeviceEmu}";
$phonePortrait: "#{$screenPortrait} and #{$phoneCheck} and #{$mobileDevice}";
$phoneLandscape: "#{$screenLandscape} and #{$phoneCheck} and #{$mobileDevice}";
$tabletPortrait: "#{$screenPortrait} and #{$tabletPortraitCheck} and #{$mobileDevice}";
$tabletLandscape: "#{$screenLandscape} and #{$tabletLandscapeCheck} and #{$mobileDevice}";
$tabletLandscapeEmu: "#{$screenLandscape} and #{$tabletLandscapeCheck} and #{$mobileDeviceEmu}";
$tabletPortrait: "#{$screenPortrait} and #{$tabletCheck} and #{$mobileDevice}";
$tabletLandscape: "#{$screenLandscape} and #{$tabletCheck} and #{$mobileDevice}";
$desktopPortrait: "screen and #{$desktopPortraitCheck}";
$desktopLandscape: "screen and #{$desktopLandscapeCheck}";
$desktop: "screen and #{$desktopCheck}";
/************************** DEVICE PARAMETERS FOR MENUS/REPRESENTATIONS */
$proporMenuOnly: 90%;

23
platform/commonUI/general/res/sass/mobile/_mixins.scss
View File

@@ -25,8 +25,7 @@
// Phones in any orientation
@mixin phone {
@media #{$phonePortrait},
#{$phoneLandscape},
#{$phoneLandscapeEmu} {
#{$phoneLandscape} {
@content
}
}
@@ -40,8 +39,7 @@
// Phones in landscape orientation
@mixin phoneLandscape {
@media #{$phoneLandscape},
#{$phoneLandscapeEmu} {
@media #{$phoneLandscape} {
@content
}
}
@@ -49,8 +47,7 @@
// Tablets in any orientation
@mixin tablet {
@media #{$tabletPortrait},
#{$tabletLandscape},
#{$tabletLandscapeEmu} {
#{$tabletLandscape} {
@content
}
}
@@ -64,8 +61,7 @@
// Tablets in landscape orientation
@mixin tabletLandscape {
@media #{$tabletLandscape},
#{$tabletLandscapeEmu} {
@media #{$tabletLandscape} {
@content
}
}
@@ -74,10 +70,8 @@
@mixin phoneandtablet {
@media #{$phonePortrait},
#{$phoneLandscape},
#{$phoneLandscapeEmu},
#{$tabletPortrait},
#{$tabletLandscape},
#{$tabletLandscapeEmu} {
#{$tabletLandscape} {
@content
}
}
@@ -86,17 +80,14 @@
@mixin desktopandtablet {
@media #{$tabletPortrait},
#{$tabletLandscape},
#{$tabletLandscapeEmu},
#{$desktopPortrait},
#{$desktopLandscape} {
#{$desktop} {
@content
}
}
// Desktop monitors in any orientation
@mixin desktop {
@media #{$desktopPortrait},
#{$desktopLandscape} {
@media #{$desktop} {
@content
}
}

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

@@ -20,11 +20,9 @@
* at runtime from the About dialog for additional information.
*****************************************************************************/
$yBarW: 60px;
$yLabelW: auto;
$yLabelW: 10px;
$xBarH: 32px;
$legendH: 20px;
//$colorHash: rgba(white, 0.3); // MOVED INTO CONSTANTS
//$styleHash: dashed; // MOVED INTO CONSTANTS
$swatchD: 8px;
$plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBarW); // Top, right, bottom, left
@@ -36,7 +34,6 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
height: 100%;
.gl-plot-axis-area {
// @include test(green);
position: absolute;
&.gl-plot-x {
top: auto;
@@ -59,7 +56,7 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.gl-plot-coords {
@include box-sizing(border-box);
@include border-radius($controlCr);
background: black; //rgba($colorKey, 0.5);
background: black;
color: lighten($colorBodyFg, 30%);
padding: 2px 5px;
position: absolute;
@@ -88,11 +85,9 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.gl-plot-label,
.l-plot-label {
// @include test(yellow);
color: $colorPlotLabelFg;
position: absolute;
text-align: center;
// text-transform: uppercase;
&.gl-plot-x-label,
&.l-plot-x-label {
@@ -117,20 +112,26 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
}
}
.gl-plot-y-options {
.gl-plot-x-options,
.gl-plot-y-options {
$h: 32px;
// @include test();
position: absolute;
top: 50%;
right: auto;
bottom: auto;
left: $yLabelW + $interiorMargin;
margin-top: $h / -2;
height: auto;
min-height: $h;
width: $h;
z-index: 2;
}
.gl-plot-x-options {
top: $interiorMargin;
}
.gl-plot-y-options {
@include transform(translateY(-50%));
min-width: 150px; // Need this due to enclosure of .select
top: 50%;
left: $yLabelW + $interiorMargin * 2;
}
.gl-plot-hash {
position: absolute;
border: 0 $colorPlotHash $stylePlotHash;
@@ -214,21 +215,13 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
display: inline-block;
height: $swatchD;
width: $swatchD;
//margin-right: $interiorMarginSm;
}
&[class*='s-limit'] {
.title-label {
//color: #fff;
}
}
}
}
.gl-plot-legend {
.plot-legend-item {
//@include test();
@include border-radius($smallCr);
//color: #fff;
line-height: 1.5em;
padding: 0px $itemPadLR;
.plot-color-swatch {
@@ -250,7 +243,6 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
.gl-plot-tick,
.tick-label {
// @include test(red);
font-size: 0.7rem;
position: absolute;
overflow: hidden;
@@ -277,7 +269,6 @@ $plotDisplayArea: ($legendH + $interiorMargin, 0, $xBarH + $interiorMargin, $yBa
}
.gl-plot-tick {
// @include test(red);
&.gl-plot-x-tick-label {
top: $interiorMargin;
}

2
platform/commonUI/themes/snow/res/sass/_mixins.scss
View File

@@ -1,4 +1,4 @@
@mixin containerSubtle($bg: $colorBodyBg, $fg: $colorBodyFg) {
@mixin containerSubtle($bg: $colorBodyBg, $fg: $colorBodyFg, $hover: false) {
@include containerBase($bg, $fg);
@include boxShdw($shdwBtns);
}