Open MCT Style Guide
Many elements in Open MCT need to articulate a dynamic status.
Limit CSS classes can be applied to any block or inline element. Open MCT limit classes set color and optionally an icon, but don't effect other properties. Yellow and red limit classes can be used as is, or allow the application of any custom icon available in Open MCT's glyphs library. "Level" limit classes - upper and lower - always use an icon in addition to a color; Open MCT doesn't support level limits without color.
s-limit-yellow
: A yellow limit.s-limit-red
: A red limit.s-limit-yellow-icon
: A yellow limit with icon.s-limit-red-icon
: A red limit with icon.s-limit-upr
: Upper limit. Use this class in concert with a yellow or red limit class.s-limit-lwr
: Lower limit. Use this class in concert with a yellow or red limit class.Name | Value 1 | Value 2 |
ENG_PWR 4991 | 7.023 | 70.23 |
ENG_PWR 4992 | 49.784 | -121.22 |
ENG_PWR 4993 | 0.451 | 1.007 |
Classes here can be applied to elements as needed.
s-status-warning-hi
: Nuke the entire site from orbit - it's the only way to be sure.s-status-warning-lo
: Pay attention to this.s-status-diagnostic
: Something in the code wants to talk to you.s-status-info
: What?! What?! Oh, ok.s-status-ok
: Whew! Hand me a beer would'ya?When the system is operating in real-time streaming mode, it is important for views that display real-time data to clearly articulate when they are not, such as when a user zooms or pans a plot view, freezing that view. In that case, the CSS class s-unsynced
should be applied to that view.