Tile

Copy

Copied

<ThinTile to="#" icon={iconSrc} header="Autonomy">
  Lorem ipsum dolor sit amet, pri putent oportere quaerendum in, ea mea justo invenire aliquando.
  Usu modo suavitate ea. Et sed labitur epicurei adipiscing. Nibh zril labitur an usu.
</ThinTile>
<ThinTile to="#" header="Autonomy" bgImage={gradient} color="#fff" textAlign="left">
  Lorem ipsum dolor sit amet, pri putent oportere quaerendum in, ea mea justo invenire
  aliquando. Usu modo suavitate ea. Et sed labitur epicurei adipiscing. Nibh zril labitur an
  usu. Usu modo suavitate ea. Et sed labitur epicurei adipiscing. Nibh zril labitur an usu. Et
  sed labitur epicurei adipiscing. Nibh zril labitur an usu.
</ThinTile>

<WideTile to="#" header="Opportunity">
  Lorem ipsum dolor sit amet, pri putent oportere quaerendum in, ea mea justo invenire aliquando.
  Usu modo suavitate ea. Et sed labitur epicurei adipiscing. Nibh zril labitur an usu.
</WideTile>
<WideTile to="#" header="Opportunity" icon={themeImg} disableArrow>
  Lorem ipsum dolor sit amet, pri putent oportere quaerendum in, ea mea justo invenire
  aliquando. Usu modo suavitate ea. Et sed labitur epicurei adipiscing. Nibh zril labitur an
  usu.
</WideTile>

Props

Name	Type	Default	Description
to	string		The URL to link to when the tile is clicked.
icon	string		Source of the icon.
header	string		Title of tile.
children	string		Content of tile.
bgColor	string	#ffffff	Defines the background-color style property.
bgImage	string	none	Defines the background-image style property.
color	string		Defines the color of text.
disableArrow	boolean	false	Hides the arrow.
headerAlign	'left' \| 'right' \| 'center' \| 'justify'	left	Defines the text-align property for header.
textAlign	'left' \| 'right' \| 'center' \| 'justify'	left	Defines the text-align property for content.