Version:

Install ​

npm i @mate/callout

Import ​

javascript
import '@mate/callout';

Variants ​

Neutral ​

html
<mate-callout title-text="Heading text">
    Every possible content like text or an unordered list
</mate-callout>

Secondary ​

html
<mate-callout theme="secondary" title-text="Heading text">
  Every possible content like text or an unordered list
</mate-callout>

Info ​

html
<mate-callout theme="info" title-text="Heading text">
  Every possible content like text or an unordered list
</mate-callout>

Success ​

html
<mate-callout theme="success" title-text="Heading text">
  Every possible content like text or an unordered list
</mate-callout>

Warning ​

html
<mate-callout theme="warning" title-text="Heading text">
  Every possible content like text or an unordered list
</mate-callout>

Error ​

html
<mate-callout theme="danger" title-text="Heading text">
  Every possible content like text or an unordered list
</mate-callout>

No heading ​

html
<mate-callout theme="danger">
  Every possible content like text or an unordered list
</mate-callout>