Styling Options

Dashbrew provides various styling options to customize the appearance of your dashboard. You can configure styles at both the global and component levels to create visually appealing and easy-to-navigate dashboards.

Style Configuration

Styles are configured in the root level of your dashboard configuration:

{
  "style": {
    "global": {
      "textColor": "#ffffff",
      "highlightedColor": "#00ff00"
    },
    "border": {
      "type": "rounded",
      "color": "#444444",
      "focusedColor": "#00aaff"
    }
  },
  "layout": {
    // Your layout configuration
  }
}

Global Style Options

Global styles apply to the entire dashboard:

Property	Description	Default Value
textColor	Default text color for all components	Terminal Default
highlightedColor	Color for highlighted elements (selected items)	Brighter Terminal Default

Border Style Options

Border styles control the appearance of component borders:

Property	Description	Default Value
type	Border style type	"thicc"
color	Default border color	Brighter Terminal Default
focusedColor	Border color when component is focused	Terminal Default

Available Border Types

Type	Description
rounded	Smooth, rounded corners
thicc	Bold, thick lines
double	Double-lined borders
normal	Standard single-line
hidden	No visible borders
ascii	Plain ASCII characters
block	Solid block elements
md	Markdown style borders

Color Configuration

Colors should be specified in full Hex Color Codes

"#ff0000" (red), "#00ff00" (green), etc.