The <button> tag adds a button to your widget form. This element behavior is similar to React's.
Available attributes:
Attribute | Type | Mandatory | Description |
---|---|---|---|
buttonType | String | N | Specify button displaying style for forms and lists.
|
To set a button, follow the example below:
Button
<button buttonType="approve" event-click="window.s_widget_custom.approve();"> {data.approveBtnTitle} </button> <button buttonType="destructive" event-click="window.s_widget_custom.reject();"> {data.rejectBtnTitle} </button>
See below all the icon-mini editing capabilities:
icon-mini
<button buttonType="icon-mini" .IconMini { @include btnIconCommonStyles; width: 20px; height: 20px; border: 1px solid $colorNeutral000; background-color: $colorNeutral000; @include svgIcon(16px, 16px, $colorNeutral800); &:hover { background-color: $colorNeutral070; border-color: $colorNeutral070; } &:active { background-color: $colorBlue010; border-color: $colorBlue010; } &[readonly], &[disabled] { cursor: default; &, &:focus, &:hover, &:active { background-color: transparent; @include svgIconColor($colorNeutral090); } } }