Using CSS in Forms
- 08 Dec 2021
- 1 Minute to read
- Print
- DarkLight
Using CSS in Forms
- Updated on 08 Dec 2021
- 1 Minute to read
- Print
- DarkLight
Article Summary
Share feedback
Thanks for sharing your feedback!
Overview
This article will cover how to apply custom or predefined CSS classes to Form components in Decisions. This example assumes that the provided .css file has already been uploaded to the environment. For more information on how to upload a CSS file, please refer to the Uploading CSS article.
Below is an example CSS file, using a custom-defined class.
Below is an example CSS file, using a custom-defined class.
Example
The Form used in this example has various Form Controls already applied to it. This Form is used only to display the styles on different controls.
Predefined Class
- In the Form Designer, navigate to the Style section within the Form Properties panel.
- Locate and select the Example CSS Style Sheet.
When using predefined classes the Form will update automatically showing the newly applied style.
Custom Class
- In the Form Designer, navigate to the Style section within the Form Properties panel.
- Locate and select the Example CSS Style Sheet.
- Navigate to the Button Properties.
- Expand the View section.
- Use the CSS Class drop-down to select the MyButton class.
Once the class has been selected, it will update the look of the Button component. In addition, the CSS class can be applied to other Button components as well.
Setting a Default Form CSS
To designate a default styling CSS for Forms in a Decisions instance, navigate to where CSS sheets are stored under System > Designers > CSS. Right click on the desired CSS to open the Action menu, and select the Set Default CSS Document Action. Once selected, this CSS sheet will automatically apply to all Forms.
If this default CSS includes custom CSS classes, these will need to be selected manually for every component wishing to use one.
Was this article helpful?
