monitoring/module.less: prepare styles for summary

refs #6993

modules/monitoring/public/css/module.less

@@ -53,3 +53,80 @@ div.contacts div.contact > img {
 div.contacts div.notification-periods {
   margin-top: 0.5em;
 }
+
+h3.tinystatesummary {
+    line-height: 2em;
+    font-size: 1em;
+    font-weight: bold;
+    padding-left: 1em;
+    background-color: #555;
+    color: white;
+    border: none;
+    border-radius: 0.2em;
+    -moz-border-radius: 0.2em;
+    -webkit-border-radius: 0.2em;
+}
+
+h3.tinystatesummary a {
+    color: inherit;
+    text-decoration: none;
+    padding: 1px 3px;
+}
+
+h3.tinystatesummary a:hover {
+    text-decoration: underline;
+}
+
+/* State badges */
+span.state {
+    font-size: 0.8em;
+    color: white;
+    font-weight: bold;
+    padding: 1px 2px;
+    margin-right: 5px;
+    border-radius: 5px;
+    -moz-border-radius: 5px;
+    -webkit-border-radius: 5px;
+    border: 2px solid transparent;
+}
+
+span.state.active {
+    border: 2px solid white;
+}
+
+span.state span.state {
+    font-size: 1em;
+    margin: 0 -3px 0 5px;
+}
+
+span.state.ok {
+    background: @colorOk;
+}
+
+span.state.critical {
+    background: @colorCritical;
+}
+
+span.state.handled.critical {
+    background: @colorCriticalHandled;
+}
+
+span.state.warning {
+    background: @colorWarning;
+}
+
+span.state.handled.warning {
+    background: @colorWarningHandled;
+}   
+
+span.state.unknown {
+    background: @colorUnknown;
+}
+
+span.state.handled.unknown {
+    background: @colorUnknownHandled;
+}
+
+span.state.pending {
+    background: @colorPending;
+}