OliveTin/docs/modules/ROOT/pages/dashboards/css.adoc

[#dashboard-css]
= Change component style

You can change the style of any dashboard component by adding a `cssClass` property to the component. This is useful for styling actions, displays, fieldsets and folders. Here is an example of how to add a class to an action;

[source,yaml]
----
themeName: my-theme

actions:
  - title: My Action
    shell: echo "Hello"

dashboards:
  - title: My Dashboard
    contents:
      - title: My Fieldset
        type: fieldset
        contents:
          - title: My Action
            cssClass: big-button
----

You can then create a theme, and add the following CSS to style the action;

[source,css]
.`custom-webui/themes/my-theme/theme.css`
----
.big-button {
  background-color: red;
  color: white;
  font-size: 20px;
  grid-column: span 2;
  grid-row: span 2;
}
----