Alerts
Alert Notifications Fixed
A fixed positioned container for placing alerts on the top right corner of the page. This component can generally be placed anywhere on the page.
Meeting Rescheduled:
Please complete the attendance form to confirm your attendance: More Info.
Alert Notifications Absolute
An absolute positioned container for placing alerts on the top right corner relative to
.alert-container. Use this to create sticky positioned alerts with javascript, modifying the CSS propertytransform: translateY();ormargin-topwhenscrollYreaches a specific threshold. This component should generally be placed at the top of the page for sticky alerts aligned at the top.
Danger: Something is not right.
Alerts with Embedded Links
Use the class
leadinside of an alert to make the beginning of your message stand out.Use the class
alert-linkto style a link inside your alert.Use the class
alert-btnto specifically style abtninside your alert.
Primary: This is a primary alert. .
Secondary: This is a secondary alert.
Success: You just read the alert message successfully.
Info: This alert needs your attention.
Warning: This alert is a warning message.
Danger: Something is not right.
Light: This is a light alert.
Dark: This is a dark alert.
Dismissible Alerts
Primary: This is a primary alert.
Secondary: This is a secondary alert.
Success: You just read the alert message successfully.
Info: This alert needs your attention.
Warning: This alert is a warning message.
Danger: Something is not right.
Light: This is a light alert.
Dark: This is a dark alert.
Alert Fluid
Must have nestedcontainerorcontainer-fluidinalert-fluid.
Primary This is a primary alert.
Secondary This is a secondary alert.
Success You just read the alert message successfully.
Info This alert needs your attention.
Warning This alert is a warning message.
Danger Something is not right.
Light This is a light alert.
Dark This is a dark alert.