Alerts

Congratulations! You are now logged in.
= ui_component('alert', properties: {as_below} )
{
  type: "success",
  title: "Congratulations!",
  message: "You are now logged in."
}
Congratulations! You are now logged in.
= ui_component('alert', properties: {as_below} )
{
  type: "success",
  title: "Congratulations!",
  message: "You are now logged in.",
  subtle: true
}
Oops! Maybe check yourself before...
= ui_component('alert', properties: {as_below} )
{
  type: "error",
  title: "Oops!",
  message: "Maybe check yourself before..."
}
Oops! Maybe check yourself before...
= ui_component('alert', properties: {as_below} )
{
  type: "error",
  title: "Oops!",
  message: "Maybe check yourself before...",
  subtle: true
}
Be careful Mind the gap.
= ui_component('alert', properties: {as_below} )
{
  type: "warning",
  title: "Be careful",
  message: "Mind the gap."
}
Be careful Mind the gap.
= ui_component('alert', properties: {as_below} )
{
  type: "warning",
  title: "Be careful",
  message: "Mind the gap.",
  subtle: true
}
Half price books Get them now, they're hot.
= ui_component('alert', properties: {as_below} )
{
  type: "announcement",
  title: "Half price books",
  message: "Get them now, they're hot."
}
Half price books Get them now, they're hot.
= ui_component('alert', properties: {as_below} )
{
  type: "announcement",
  title: "Half price books",
  message: "Get them now, they're hot.",
  subtle: true
}