mirror of
https://github.com/nasa/openmct.git
synced 2025-06-23 09:25:29 +00:00
Merge remote-tracking branch 'origin/master' into open933-c
# Conflicts: # platform/commonUI/edit/res/templates/create/create-menu.html # platform/commonUI/general/res/fonts/symbols/wtdsymbols.eot # platform/commonUI/general/res/fonts/symbols/wtdsymbols.svg # platform/commonUI/general/res/fonts/symbols/wtdsymbols.ttf # platform/commonUI/general/res/fonts/symbols/wtdsymbols.woff # platform/commonUI/general/res/sass/_archetypes.scss # platform/commonUI/general/res/sass/_constants.scss # platform/commonUI/general/res/sass/_icons.scss # platform/commonUI/general/res/sass/_main.scss # platform/commonUI/general/res/sass/_mixins.scss # platform/commonUI/general/res/sass/controls/_buttons.scss # platform/commonUI/general/res/templates/controls/time-controller.html # platform/commonUI/themes/snow/res/sass/_constants.scss
This commit is contained in:
Charles Hacskaylo
@ -1,9 +1,9 @@
|
||||
/*****************************************************************************
|
||||
* Open MCT Web, Copyright (c) 2014-2015, United States Government
|
||||
* Open MCT, Copyright (c) 2014-2016, United States Government
|
||||
* as represented by the Administrator of the National Aeronautics and Space
|
||||
* Administration. All rights reserved.
|
||||
*
|
||||
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
|
||||
* Open MCT is licensed under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
* http://www.apache.org/licenses/LICENSE-2.0.
|
||||
@ -14,7 +14,7 @@
|
||||
* License for the specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*
|
||||
* Open MCT Web includes source code licensed under additional open source
|
||||
* Open MCT includes source code licensed under additional open source
|
||||
* licenses. See the Open Source Licenses file (LICENSES.md) included with
|
||||
* this source code distribution or the Licensing information page available
|
||||
* at runtime from the About dialog for additional information.
|
||||
|
||||
@ -2,10 +2,11 @@
|
||||
$colorBodyBg: #333;
|
||||
$colorBodyFg: #999;
|
||||
$colorGenBg: #222;
|
||||
$colorFooterBg: #000;
|
||||
$colorStatusBarBg: #000;
|
||||
$colorKey: #0099cc;
|
||||
$colorKeySelectedBg: #005177;
|
||||
$colorKeyFg: #fff;
|
||||
$colorKeyHov: #00c0f6;
|
||||
$colorEditAreaBg: #31363e;
|
||||
$colorEditAreaFg: #587ab5;
|
||||
$colorInteriorBorder: rgba($colorBodyFg, 0.1);
|
||||
@ -21,11 +22,20 @@ $smallCr: 2px;
|
||||
$colorBtnBg: pullForward($colorBodyBg, $contrastRatioPercent);
|
||||
$colorBtnBgHov: pullForward($colorBtnBg, $hoverRatioPercent);
|
||||
$colorBtnFg: $colorBodyFg;
|
||||
$colorBtnFgHov: pullForward($colorBtnFg, $hoverRatioPercent);
|
||||
$colorBtnIcon: $colorBtnFg;
|
||||
$colorBtnIconHov: $colorBtnFgHov;
|
||||
$colorBtnMajorBg: $colorKey;
|
||||
$colorBtnMajorBgHov: pullForward($colorBtnMajorBg, $hoverRatioPercent);
|
||||
$colorBtnMajorFg: $colorKeyFg;
|
||||
$colorBtnIcon: $colorKey;
|
||||
$colorBtnMajorFgHov: pullForward($colorBtnMajorFg, $hoverRatioPercent);
|
||||
$colorClickIcon: $colorKey;
|
||||
$colorClickIconHov: $colorKeyHov;
|
||||
$colorToggleIcon: rgba($colorBodyFg, 0.5);
|
||||
$colorToggleIconActive: $colorKey;
|
||||
$colorToggleIconHov: rgba($colorToggleIconActive, 0.5);
|
||||
$colorInvokeMenu: #fff;
|
||||
$contrastInvokeMenuPercent: 20%;
|
||||
$contrastInvokeMenuPercent: 30%;
|
||||
$shdwBtns: rgba(black, 0.2) 0 1px 2px;
|
||||
$shdwBtnsOverlay: rgba(black, 0.5) 0 1px 5px;
|
||||
$sliderColorBase: $colorKey;
|
||||
@ -169,7 +179,7 @@ $colorItemTreeSelectedBg: pushBack($colorKey, 15%);
|
||||
$colorItemTreeSelectedFg: pullForward($colorBodyFg, 20%);
|
||||
$colorItemTreeEditingBg: #344154;
|
||||
$colorItemTreeEditingFg: $colorEditAreaFg;
|
||||
$colorItemTreeVC: $colorBodyFg; //rgba(#fff, 0.3);
|
||||
$colorItemTreeVC: $colorBodyFg;
|
||||
$colorItemTreeVCHover: pullForward($colorItemTreeVC, 20%);
|
||||
$colorItemTreeSelectedVC: $colorItemTreeVC;
|
||||
$shdwItemTreeIcon: 0.6;
|
||||
@ -178,23 +188,35 @@ $shdwItemTreeIcon: 0.6;
|
||||
$scrollbarTrackSize: 10px;
|
||||
$scrollbarTrackShdw: rgba(#000, 0.7) 0 1px 5px;
|
||||
$scrollbarTrackColorBg: rgba(#000, 0.4);
|
||||
$scrollbarThumbColor: lighten($colorBodyBg, 10%);
|
||||
$scrollbarThumbColorHov: lighten($scrollbarThumbColor, 2%);
|
||||
$scrollbarThumbColorOverlay: lighten($colorOvrBg, 10%);
|
||||
$scrollbarThumbColorOverlayHov: lighten($scrollbarThumbColorOverlay, 2%);
|
||||
$scrollbarThumbColor: pullForward($colorBodyBg, 10%);
|
||||
$scrollbarThumbColorHov: pullForward($scrollbarThumbColor, 2%);
|
||||
$scrollbarThumbColorOverlay: pullForward($colorOvrBg, 10%);
|
||||
$scrollbarThumbColorOverlayHov: pullForward($scrollbarThumbColorOverlay, 2%);
|
||||
|
||||
// Splitter
|
||||
$splitterD: 17px; // splitterD and $splitterHandleD should both be odd, or even
|
||||
$splitterHandleD: 1px;
|
||||
$splitterDSm: 17px; // Smaller splitter, used inside elements like a Timeline view
|
||||
$colorSplitterBg: rgba(#fff, 0.1); //pullForward($colorBodyBg, 5%);
|
||||
// All splitterD* values MUST both be either odd or even numbers
|
||||
$splitterD: 20px;
|
||||
$splitterDSm: 10px; // Smaller splitter, used inside elements like a Timeline view
|
||||
$splitterHandleD: 2px;
|
||||
$colorSplitterBaseBg: pullForward($colorBodyBg, 10%);
|
||||
$colorSplitterBg: $colorSplitterBaseBg;
|
||||
$splitterShdw: rgba(black, 0.4) 0 0 3px;
|
||||
$splitterEndCr: none;
|
||||
$colorSplitterHover: pullForward($colorBodyBg, 40%);
|
||||
$colorSplitterHover: pullForward($colorSplitterBg, $hoverRatioPercent);
|
||||
$colorSplitterActive: $colorKey;
|
||||
|
||||
// Minitabs
|
||||
$uePaneMiniTabH: 24px;
|
||||
$uePaneMiniTabW: 8px;
|
||||
$colorMiniTabBg: $colorSplitterBg;
|
||||
$colorMiniTabFg: pushBack($colorMiniTabBg, 10%);
|
||||
$colorMiniTabBgHov: $colorSplitterHover;
|
||||
$colorMiniTabFgHov: #fff;
|
||||
|
||||
// Mobile
|
||||
$colorMobilePaneLeft: darken($colorBodyBg, 5%);
|
||||
$colorMobilePaneLeftTreeItemBg: pullForward($colorMobilePaneLeft, 3%);
|
||||
$colorMobileSelectListTreeItemBg: rgba(#fff, 0.05);
|
||||
|
||||
// Datetime Picker
|
||||
$colorCalCellHovBg: $colorKey;
|
||||
|
||||
@ -1,15 +1,9 @@
|
||||
@mixin containerSubtle($bg: $colorBodyBg, $fg: $colorBodyFg, $hover: false) {
|
||||
@mixin containerSubtle($bg: $colorBodyBg, $fg: $colorBodyFg, $gradRatio: 5%) {
|
||||
@include containerBase($bg, $fg);
|
||||
@include background-image(linear-gradient(lighten($bg, 5%), $bg));
|
||||
@include background-image(linear-gradient(pullForward($bg, $gradRatio), $bg));
|
||||
@include boxShdw($shdwBtns);
|
||||
}
|
||||
|
||||
@mixin btnSubtle($bg: $colorBodyBg, $bgHovColor: none, $fg: $colorBodyFg, $ic: $colorBtnIcon) {
|
||||
@include containerSubtle($bg, $fg);
|
||||
@include btnBase($bg, $bgHovColor, $fg, $ic);
|
||||
text-shadow: $shdwItemText;
|
||||
}
|
||||
|
||||
@function pullForward($c: $colorBodyBg, $p: 20%) {
|
||||
// For dark interfaces, lighter things come forward - opposite for light interfaces
|
||||
@return lighten($c, $p);
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
/*****************************************************************************
|
||||
* Open MCT Web, Copyright (c) 2014-2015, United States Government
|
||||
* Open MCT, Copyright (c) 2014-2016, United States Government
|
||||
* as represented by the Administrator of the National Aeronautics and Space
|
||||
* Administration. All rights reserved.
|
||||
*
|
||||
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
|
||||
* Open MCT is licensed under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
* http://www.apache.org/licenses/LICENSE-2.0.
|
||||
@ -14,7 +14,7 @@
|
||||
* License for the specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*
|
||||
* Open MCT Web includes source code licensed under additional open source
|
||||
* Open MCT includes source code licensed under additional open source
|
||||
* licenses. See the Open Source Licenses file (LICENSES.md) included with
|
||||
* this source code distribution or the Licensing information page available
|
||||
* at runtime from the About dialog for additional information.
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
/*****************************************************************************
|
||||
* Open MCT Web, Copyright (c) 2014-2015, United States Government
|
||||
* Open MCT, Copyright (c) 2014-2016, United States Government
|
||||
* as represented by the Administrator of the National Aeronautics and Space
|
||||
* Administration. All rights reserved.
|
||||
*
|
||||
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
|
||||
* Open MCT is licensed under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
* http://www.apache.org/licenses/LICENSE-2.0.
|
||||
@ -14,7 +14,7 @@
|
||||
* License for the specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*
|
||||
* Open MCT Web includes source code licensed under additional open source
|
||||
* Open MCT includes source code licensed under additional open source
|
||||
* licenses. See the Open Source Licenses file (LICENSES.md) included with
|
||||
* this source code distribution or the Licensing information page available
|
||||
* at runtime from the About dialog for additional information.
|
||||
|
||||
@ -2,12 +2,13 @@
|
||||
$colorBodyBg: #fcfcfc;
|
||||
$colorBodyFg: #666;
|
||||
$colorGenBg: #fff;
|
||||
$colorFooterBg: #000;
|
||||
$colorStatusBarBg: #000;
|
||||
$colorKey: #0099cc;
|
||||
$colorKeySelectedBg: $colorKey;
|
||||
$colorKeyFg: #fff;
|
||||
$colorKeyHov: #00c0f6;
|
||||
$colorEditAreaBg: #eafaff;
|
||||
$colorEditAreaFg: #4bb1c7; //587ab5;
|
||||
$colorEditAreaFg: #4bb1c7;
|
||||
$colorInteriorBorder: rgba($colorBodyFg, 0.2);
|
||||
$colorA: #999;
|
||||
$colorAHov: $colorKey;
|
||||
@ -21,9 +22,18 @@ $smallCr: 3px;
|
||||
$colorBtnBg: pullForward($colorBodyBg, $contrastRatioPercent);
|
||||
$colorBtnBgHov: pullForward($colorBtnBg, $hoverRatioPercent);
|
||||
$colorBtnFg: #fff;
|
||||
$colorBtnMajorBg: $colorKey;
|
||||
$colorBtnMajorFg: $colorKeyFg;
|
||||
$colorBtnFgHov: $colorBtnFg;
|
||||
$colorBtnIcon: #eee;
|
||||
$colorBtnIconHov: $colorBtnFgHov;
|
||||
$colorBtnMajorBg: $colorKey;
|
||||
$colorBtnMajorBgHov: $colorKeyHov;
|
||||
$colorBtnMajorFg: $colorKeyFg;
|
||||
$colorBtnMajorFgHov: pushBack($colorBtnMajorFg, $hoverRatioPercent);
|
||||
$colorClickIcon: $colorKey;
|
||||
$colorClickIconHov: $colorKeyHov;
|
||||
$colorToggleIcon: rgba($colorClickIcon, 0.5);
|
||||
$colorToggleIconActive: $colorKey;
|
||||
$colorToggleIconHov: rgba($colorToggleIconActive, 0.5);
|
||||
$colorInvokeMenu: #000;
|
||||
$contrastInvokeMenuPercent: 40%;
|
||||
$shdwBtns: none;
|
||||
@ -106,8 +116,8 @@ $shdwStatusIc: rgba(white, 0.8) 0 0px 5px;
|
||||
$animPausedPulseDur: 1s;
|
||||
|
||||
// Selects
|
||||
$colorSelectBg: #ddd;
|
||||
$colorSelectFg: $colorBodyFg;
|
||||
$colorSelectBg: $colorBtnBg;
|
||||
$colorSelectFg: $colorBtnFg;
|
||||
|
||||
// Limits and staleness colors//
|
||||
$colorTelemFresh: pullForward($colorBodyFg, 20%);
|
||||
@ -134,7 +144,7 @@ $colorFieldHintOverlay: pullForward($colorOvrBg, 40%);
|
||||
|
||||
// Items
|
||||
$colorItemBg: #ddd;
|
||||
$colorItemBgHov: pullForward($colorItemBg, $hoverRatioPercent);
|
||||
$colorItemBgHov: pullForward($colorItemBg, $hoverRatioPercent * 0.7);
|
||||
$colorItemFg: $colorBodyFg;
|
||||
$colorItemFgDetails: pushBack($colorItemFg, 15%);
|
||||
$colorItemIc: $colorKey;
|
||||
@ -184,17 +194,29 @@ $scrollbarThumbColorOverlay: darken($colorOvrBg, 50%);
|
||||
$scrollbarThumbColorOverlayHov: $scrollbarThumbColorHov;
|
||||
|
||||
// Splitter
|
||||
$splitterD: 16px; // splitterD and $splitterHandleD should both be odd, or even
|
||||
// All splitterD* values MUST both be either odd or even numbers
|
||||
$splitterD: 16px;
|
||||
$splitterDSm: 10px; // Smaller splitter, used inside elements like a Timeline view
|
||||
$splitterHandleD: 2px;
|
||||
$splitterDSm: 16px; // Smaller splitter, used inside elements like a Timeline view
|
||||
$colorSplitterBg: pullForward($colorBodyBg, 10%);
|
||||
$colorSplitterBaseBg: $colorBodyBg;
|
||||
$colorSplitterBg: pullForward($colorSplitterBaseBg, 15%);
|
||||
$splitterShdw: none;
|
||||
$splitterEndCr: none;
|
||||
$colorSplitterHover: pullForward($colorBodyBg, 30%);
|
||||
$colorSplitterHover: pullForward($colorSplitterBg, $hoverRatioPercent * 2);
|
||||
$colorSplitterActive: $colorKey;
|
||||
|
||||
// Minitabs
|
||||
$uePaneMiniTabH: 24px;
|
||||
$uePaneMiniTabW: 8px;
|
||||
$colorMiniTabBg: $colorSplitterBg;
|
||||
$colorMiniTabFg: pullForward($colorMiniTabBg, 30%);
|
||||
$colorMiniTabBgHov: $colorSplitterHover;
|
||||
$colorMiniTabFgHov: #fff;
|
||||
|
||||
// Mobile
|
||||
$colorMobilePaneLeft: darken($colorBodyBg, 2%);
|
||||
$colorMobilePaneLeftTreeItemBg: pullForward($colorMobilePaneLeft, 3%);
|
||||
$colorMobileSelectListTreeItemBg: rgba(#000, 0.05);
|
||||
|
||||
// Datetime Picker, Calendar
|
||||
$colorCalCellHovBg: $colorKey;
|
||||
@ -208,4 +230,4 @@ $colorAboutLink: #84b3ff;
|
||||
|
||||
// Loading
|
||||
$colorLoadingFg: $colorAlt1;
|
||||
$colorLoadingBg: rgba($colorLoadingFg, 0.1);
|
||||
$colorLoadingBg: rgba($colorLoadingFg, 0.1);
|
||||
@ -1,4 +1,4 @@
|
||||
.s-btn {
|
||||
.s-button {
|
||||
&.major {
|
||||
.title-label {
|
||||
text-transform: uppercase;
|
||||
|
||||
@ -1,14 +1,8 @@
|
||||
@mixin containerSubtle($bg: $colorBodyBg, $fg: $colorBodyFg, $hover: false) {
|
||||
@mixin containerSubtle($bg: $colorBodyBg, $fg: $colorBodyFg, $gradRatio: 5%) {
|
||||
@include containerBase($bg, $fg);
|
||||
@include boxShdw($shdwBtns);
|
||||
}
|
||||
|
||||
@mixin btnSubtle($bg: $colorBtnBg, $bgHovColor: none, $fg: $colorBtnFg, $ic: $colorBtnIcon) {
|
||||
@include containerSubtle($bg, $fg);
|
||||
@include btnBase($bg, $bgHovColor, $fg, $ic);
|
||||
text-shadow: $shdwItemText;
|
||||
}
|
||||
|
||||
@function pullForward($c: $colorBodyBg, $p: 20%) {
|
||||
// For dark interfaces, lighter things come forward - opposite for light interfaces
|
||||
@return darken($c, $p);
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
/*****************************************************************************
|
||||
* Open MCT Web, Copyright (c) 2014-2015, United States Government
|
||||
* Open MCT, Copyright (c) 2014-2016, United States Government
|
||||
* as represented by the Administrator of the National Aeronautics and Space
|
||||
* Administration. All rights reserved.
|
||||
*
|
||||
* Open MCT Web is licensed under the Apache License, Version 2.0 (the
|
||||
* Open MCT is licensed under the Apache License, Version 2.0 (the
|
||||
* "License"); you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
* http://www.apache.org/licenses/LICENSE-2.0.
|
||||
@ -14,7 +14,7 @@
|
||||
* License for the specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*
|
||||
* Open MCT Web includes source code licensed under additional open source
|
||||
* Open MCT includes source code licensed under additional open source
|
||||
* licenses. See the Open Source Licenses file (LICENSES.md) included with
|
||||
* this source code distribution or the Licensing information page available
|
||||
* at runtime from the About dialog for additional information.
|
||||
|
||||
Reference in New Issue
Block a user