<mk-box header="Box header" footer="Box footer">
Box content
</mk-box>
<mk-box>
<mk-box-header>HTML Box header</mk-box-header>
<mk-box-tools><button>Additionnal Box Buttons</button></mk-box-tools>
<mk-box-content>HTML Box content</mk-box-content>
<mk-box-footer>HTML Box footer</mk-box-footer>
</mk-box>
| Name | Type | Default | Description |
|---|---|---|---|
| boxColor | string (default | primary | success | info | warning | danger | rgb | rgba | hex) | box-default | The box color. |
| buttonsStyleClass | string | null | The box collapse & remove buttons style classes. |
| contentStyleClass | string | box-content-wrapper | The box content style classes. |
| footer | string | null |
Footer text of the box. Note: You can use <mk-box-footer> for HTML footer. |
| footerStyleClass | string | box-footer | The box footer style classes. |
| header | string | null |
Header text of the box. Note: You can use <mk-box-content> for HTML header. |
| headerBorder | boolean | true | Defines if header and content is separated with a border. |
| headerStyleClass | string | box-header | The box header style classes. |
| isCollapsable | boolean | true | Defines if box content can be expanded and collapsed. |
| isCollapsed | boolean | false | Defines if box content is collapsed. |
| isLoading | boolean | false | Show a loading animation. |
| isRemovable | boolean | true | Defines if box can be removed. |
| isSolid | boolean | false | If false the box have border top color, if true the box have filled header and borders. |
| loadingColor | string | null | The box loading icon font color. |
| loadingStyleClass | string | fa fa-refresh fa-spin | The box loading icon style classes. |
| styleClass | string | box | The box style classes. |
| Name | Parameters | Description |
|---|---|---|
| onCollapseStart | event: browser event | Callback to invoke before content toggle |
| onCollapseDone | event: browser event | Callback to invoke after content toggle |