Sticker
Stickers are a visual way to quickly identify content in a different way than badges and labels.
install | yarn add @clayui/sticker |
---|---|
version | 3.111.0 |
Stable3.111.0View in LexiconCHANGELOG
Display Type
Stickers can be any color. Set sticker's color using displayType
property.
Also, you can use the following sizes on your Sticker just setting up size
:
User Icon
Use a ClaySticker as User Icon just adding sticker-user-icon
on className of the ClaySticker
component like the example below:
Positioning
You can set a desired alignment of sticker according to a parent element, just setting up the position
property. If you want to set the position of the sticker on the outside corners, use outside
property in conjunction with position
property.
Overlay content over stickers by nesting sticker-overlay
elements as children of ClaySticker. Check our example on Storybook