Styling

Global Variables

The following are CSS variables used by each of the form generated. They are scoped within class .ng-dynamic-json-form.

• --color-primary
• --color-primary-lighter
• --color-error
• --color-border
• --font-family
• --font-size-title
• --font-size-label
• --font-size-description
• --font-size-error
• --font-weight-title
• --font-weight-label
• --input-border-width
• --column-gap
• --row-gap
• --options-column-gap
• --options-row-gap

We can overwrite any of the variable with new value:

.ng-dynamic-json-form {
  --color-primary: teal;
  ...;
}