diff --git a/example/styleguide/res/templates/status.html b/example/styleguide/res/templates/status.html index d692c11b70..bfc03d601f 100644 --- a/example/styleguide/res/templates/status.html +++ b/example/styleguide/res/templates/status.html @@ -37,7 +37,12 @@
Many elements in Open MCT need to articulate a dynamic status.
+Many elements in Open MCT need to articulate a dynamic status; Open MCT provides the following styles and conventions to handle this:
+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.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.
+ s-limit-lwr: Lower limit.
+ Classes here can be applied to elements as needed.
s-status-warning-his-status-warning-los-status-diagnostics-status-infos-status-oks-status-warning-hi-icons-status-warning-lo-icons-status-diagnostic-icons-status-info-icons-status-ok-icons-status-warning-his-status-warning-los-status-diagnostics-status-infos-status-oks-status-warning-hi-icons-status-warning-lo-icons-status-diagnostic-icons-status-info-icons-status-ok-icon