Document display cssClass

OliveTin · Aug 16, 2024 · 19251ef · 19251ef
1 parent 1da40fa
commit 19251ef
Showing 1 changed file with 31 additions and 0 deletions.
diff --git a/modules/ROOT/pages/dashboards.adoc b/modules/ROOT/pages/dashboards.adoc
@@ -207,6 +207,37 @@ dashboards:
           - title: 'Stop {{ container.Names }}'
 ----
 
+==== CSS Classes
+
+You can also add CSS classes to the display, which can be useful for styling.
+
+[source,yaml]
+----
+dashboards:
+  - title: My Containers
+    contents:
+      - title: 'Container {{ container.Names.0 }} ({{ container.Image }})'
+        entity: container
+        type: fieldset
+        contents:
+          - type: display
+            cssClass: '{{ container.State }}'
+            title: |
+              {{ container.Status }} <br /><br /><strong>{{ container.State }}</strong>
+          - title: 'Start {{ container.Names.0 }}'
+          - title: 'Stop {{ container.Names.0 }}'
+          - title: 'Remove {{ container.Names.0 }}'
+----
+
+You can then use the following CSS to style the display;
+
+[source,css]
+----
+div.display.running {
+  color: green;
+}
+----
+
 [#output-views]
 === Most recent action output