Skip to content 
Alert - CSS Component
The Alert component can be used imported from:
Playground
Construction
The CSS component uses the div tag with an z-alert HTML custom attribute.
z-alert
The z-alert parameter is the main parameter used to render the alert component.
Action card content
The default state of the alert is info. There are four states available: info, alert, negative, and positive.
Action card content
Action card content
Action card content
TIP
You can add a confirm button to the alert component, before the closebutton.
Action card content
Attention!
Make sure to only use two buttons inside the z-alert component. First button it's used for interaction. Second button will render an X icon, the main goal of the second button is to close the alert.
icon
The icon parameter is used to render an icon inside the alert component.
Action card content
Browser support
Detected engine:
Chromium
Webkit
Gecko