Empty content

Give different contents with empty content component.

Steps#

Example#

Simple empty content with title and description. content prop cannot be empty.

Larry the Bird.

Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time.

<>
	<EmptyContent  content={{steps:[{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. "}]}} />
</>

Button#

Add button with link by adding url prop to steps array. Hover the button text to see link.

Larry the Bird.

<>
	<EmptyContent  content={{steps:[{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. ", url:"/"}]}} />
</>

Button text#

Add button text by adding urlText prop to steps array.

Larry the Bird.

<>
	<EmptyContent  content={{steps:[{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. ", url:"/", urlText:"urlText"}]}} />
</>

isOutside#

Button without link.

Larry the Bird.

urlText

<>
	<EmptyContent  content={{steps:[{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. ", url:"/", urlText:"urlText", isOutside:true}]}} />
</>

Icon#

Add icon instead of content number by adding icon prop to steps array.

Larry the Bird.

<>
	<EmptyContent  content={{steps:[{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. ", icon:"lightbulb-alt"}]}} />
</>

Title#

Add content title by title prop and description by description prop to content array.

Title

Description

Larry the Bird.

<>
	<EmptyContent  content={{title:"Title", description:"Description", steps:[{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. "}]}} />
</>

Url#

Add url by url and urlText props to content array.

Title

Description url Text

Larry the Bird.

<>
	<EmptyContent  content={{title:"Title", description:"Description", steps:[{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. "}], url:"url", urlText:"url Text"}} />
</>

Vertical#

Show content boxes vertically by vertical prop. In this state maxItemWidth will be "420px".

Title

Description

Larry the Bird.

<>
	<EmptyContent  content={{title:"Title", description:"Description", steps:[{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. "},{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. "}], url:"", urlText:""}} vertical={true} />
</>

Max width#

Declare max width of content box by maxItemWidth prop.

Title

Description

Larry the Bird.

<>
	<EmptyContent  content={{title:"Title", description:"Description", steps:[{title:"Larry the Bird.", description:"Larry the Bird. Larry Joe Bird (born December 7, 1956) is an American former professional basketball player, coach and executive in the National Basketball Association (NBA). Nicknamed 'the Hick from French Lick' and 'Larry Legend,' Bird is widely regarded as one of the greatest basketball players of all time. "}], url:"", urlText:""}} maxItemWidth="300px" />
</>

API#

import Namecard from "erxes-ui/lib/components/namecard/Namecard";

* required prop

Name			Type	Description
content*	steps	title	string	Define title of step
		description	string	Define description of step
		url	string	Define url of button
		urlText	string	Define url text of button
		icon	string	Replace step number with icon
		isOutside	boolean	Hides button link
	title		string	Define title of content
	description		string	Define description of content
	url		string	Define url link of content
	urlText		string	Define url text of content
vertical			boolean	Shows content box vertically
maxItemWidth			string	Declare max width of content box