mirror of
https://github.com/nasa/openmct.git
synced 2024-12-22 22:42:24 +00:00
747afa6200
Fixes #1677 Refactor and re-organize alert and status colors; Rename _limits.scss to _status.scss; Style Guide additions in progress; VERY WIP, NEEDS UNIT TESTING FOR REGRESSION.
87 lines
3.3 KiB
SCSS
87 lines
3.3 KiB
SCSS
/*****************************************************************************
|
|
* Open MCT, Copyright (c) 2014-2017, United States Government
|
|
* as represented by the Administrator of the National Aeronautics and Space
|
|
* Administration. All rights reserved.
|
|
*
|
|
* 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.
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
|
|
* WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
|
|
* License for the specific language governing permissions and limitations
|
|
* under the License.
|
|
*
|
|
* 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.
|
|
*****************************************************************************/
|
|
/*************************************************** MIXINS */
|
|
@mixin formulateStatusColors($c) {
|
|
// Sets bg and icon colors for elements
|
|
background: rgba($c, 0.4) !important;
|
|
&:before { color: $c !important; }
|
|
}
|
|
|
|
|
|
|
|
/*************************************************** GENERAL */
|
|
.s-limit-yellow,
|
|
.s-limit-red,
|
|
.s-limit-yellow-icon,
|
|
.s-limit-red-icon,
|
|
.s-status-warning-lo,
|
|
.s-status-warning-hi,
|
|
.s-status-diagnostic,
|
|
.s-status-command,
|
|
.s-status-info,
|
|
.s-status-ok,
|
|
.s-status-warning-lo-icon,
|
|
.s-status-warning-hi-icon,
|
|
.s-status-diagnostic-icon,
|
|
.s-status-command-icon,
|
|
.s-status-info-icon,
|
|
.s-status-ok-icon {
|
|
@include trans-prop-nice($props: background, $dur: 500ms);
|
|
&:before {
|
|
content:'';
|
|
font-family: symbolsfont;
|
|
font-size: 0.8em;
|
|
display: inline;
|
|
margin-right: $interiorMarginSm;
|
|
}
|
|
}
|
|
|
|
|
|
/*************************************************** LIMITS */
|
|
.s-limit-yellow, .s-limit-yellow-icon {
|
|
@include formulateStatusColors($colorWarningLo);
|
|
}
|
|
|
|
.s-limit-red, .s-limit-red-icon {
|
|
@include formulateStatusColors($colorWarningHi);
|
|
}
|
|
|
|
.s-limit-upr:before { content: $glyph-icon-arrow-double-up; }
|
|
.s-limit-lwr:before { content: $glyph-icon-arrow-double-down; }
|
|
.s-limit-yellow-icon:before,
|
|
.s-limit-red-icon:before { content: $glyph-icon-alert-triangle; }
|
|
|
|
/*************************************************** STATUS */
|
|
.s-status-warning-hi, .s-status-warning-hi-icon { @include formulateStatusColors($colorWarningHi); }
|
|
.s-status-warning-lo, .s-status-warning-lo-icon { @include formulateStatusColors($colorWarningLo); }
|
|
.s-status-diagnostic, .s-status-diagnostic-icon { @include formulateStatusColors($colorDiagnostic); }
|
|
.s-status-info, .s-status-info-icon { @include formulateStatusColors($colorInfo); }
|
|
.s-status-ok, .s-status-ok-icon { @include formulateStatusColors($colorOk); }
|
|
|
|
.s-status-warning-hi-icon:before { content: $glyph-icon-alert-triangle; }
|
|
.s-status-warning-lo-icon:before { content: $glyph-icon-alert-rect; }
|
|
.s-status-diagnostic-icon:before { content: $glyph-icon-eye-open; }
|
|
.s-status-info-icon:before { content: $glyph-icon-info; }
|
|
.s-status-ok-icon:before { content: $glyph-icon-check; }
|
|
|
|
|