Alert Info

AlertInfo

This component describes specific styling for success, warning and error messages, an example of this being put in good use would be if a user has put in their password incorrectly. You could display an error message to make them aware of this.

Props

The props needed for this component are listed and explained below:

• icon - This prop must be a string and will add the classname of icon-[icon], e.g. "icon-star"

• type - This prop must be a string. You have the ability to add a type of warning, info and success.

• text - This prop must be a string. This is the message that will displayed.

Example

<AlertInfo 
	type="warning"
	icon="cloud-crossed"
	text="Your changes have not been saved"
/>,
<AlertInfo 
	type="info"
	icon="cloud-sync"
	text="Saving your changes"
/>,
<AlertInfo 
	type="success"
	icon="cloud-check"
	text="All changes have been saved"
/>

Related

• Button