mirror of
https://github.com/OliveTin/OliveTin
synced 2026-10-25 08:10:36 +00:00
jamesreadandCursor
c132eacc00
Move the docs.olivetin.app AsciiDoc component into this repository, add local Antora playbooks for contributors and CI, and document the split between this repo and the docs build repository. Co-authored-by: Cursor <cursoragent@cursor.com>
39 lines
814 B
Plaintext
39 lines
814 B
Plaintext
[#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;
|
|
}
|
|
----
|
|
|
|
|