The Quick Button Unified Interface allows you to fully customize the appearance of your buttons. 

Note: instructions on how to configure a Quick Button can be found here. It is presumed you have a working Quick Button for this article. 

To make the changes we change the CSSClass UI Property highlighted in the screenshot below:

The supported options are below. These are based on the Bootstrap 3 framework:

Vertical and Horizontal Buttons

By default, the buttons will be displayed horizontally. However, you can display them vertically:

To do this you will need to change the value in the buttongroupclass to btn-group-vertical in the FinalOutput cell in the Decision Table:


If you want your buttons to take up the full width of the container you can use btn-block as part of the buttongroupclass

In the following example, the buttongroupclass is set to btn-group-vertical btn-block and the CCSStyle UI Property of each button has had the width:100px style removed:


Style: Colors

The options for the predefined colors are:

Primary (Blue)

CSSClass: 'btn btn-primary'

Success (Green)

CSSClass: 'btn btn-success'

Info (Light Blue)

CSSClass: 'btn btn-info'

Warning (Orange)

CSSClass: 'btn btn-warning'

Danger (Red)

CSSClass: 'btn btn-danger'

Style: Sizes 

The options for the predefined sizes are:


CSSClass: 'btn btn-lg'


CSSClass: 'btn btn-sm'


CSSClass: 'btn btn-xs'

Multiple CSS Class Parameters 

You can create combinations of these parameters by simply combining them. A large red button would be 'btn btn-lg btn-danger'

Custom Styles

You can override the predefined classes by adding custom inline CSS to the CSSStyle UI Property. This provides you with full control over the appearance of your buttons.

For example 'width:100px; background-color: lightblue; padding-left: 8px;

Field Listeners

It is possible to have a North52 Quick Button Unified Interface rebuild itself from its configuration formula based on the change of fields on the form.

To do this, add a comma separated list of field names into the fieldlisteners property of the Final Output

The Formula below is configured to listen to the  jobtitle and north52_type fields: