<mk-box-info header="Header text" footer="Footer text" progressWidth="70" backgroundColor="yellow" iconStyleClass="fa fa-comments-o">
Content text
</mk-box-info>
<mk-box-info progressWidth="70" backgroundColor="yellow" iconStyleClass="fa fa-comments-o">
<mk-box-info-header>Header HTML</mk-box-info-header>
<mk-box-info-content>Content HTML</mk-box-info-content>
<mk-box-info-footer>Footer HTML</mk-box-info-footer>
</mk-box-info>
Name | Type | Default | Description |
---|---|---|---|
backgroundColor | string (aqua | green | red | yellow) | null | The box background color. |
contentStyleClass | string | info-box-number | The box content style classes. |
contentColor | string (green | aqua | light-blue | red | yellow | mutted | rgb | rgba | hex) | null | The box content font color. |
footer | string | null |
Footer text of the panel. Note: You can use <mk-box-info-footer> for HTML footer. |
footerColor | string (green | aqua | light-blue | red | yellow | mutted | rgb | rgba | hex) | null | The box footer font color. |
footerStyleClass | string | progress-description | The box footer style classes. |
header | string | null |
Header text of the box. Note: You can use <mk-box-info-header> for HTML header. |
headerColor | string (green | aqua | light-blue | red | yellow | mutted | rgb | rgba | hex) | null | The box header font color. |
headerStyleClass | string | info-box-text | The box header style classes. |
iconBackgroundColor | string (aqua | green | red | yellow) | null | The box icon background color. |
iconColor | string (green | aqua | light-blue | red | yellow | mutted | rgb | rgba | hex) | null | The box icon font color. |
iconStyleClass | string | ion ion-bag | The box icon style classes. |
progressWidth | number | null | The progress bar width of the box in percentage. |
styleClass | string | info-box | The box style classes. |