/* ------------------------------------------------------------------------ *\
   mixins.component.alert
\* ------------------------------------------------------------------------ */


/**
 * [alert description]
 * @return {[type]} [description]
 */
c-alert()
  u-position(relative 0 0 0 0)
  width: 100%


/**
 * [color description]
 * @param  {[type]} bg-color =             nix.skin.color.default [description]
 * @param  {[type]} fg-color =             nix.skin.color.white   [description]
 * @return {[type]}          [description]
 */
c-alert__content--color(bg-color = nix.skin.color.default, fg-color = nix.skin.color.white)
  color: fg-color
  background-color: bg-color


/**
 * [alert__content description]
 * @return {[type]} [description]
 */
c-alert__content()
  c-alert__content--color()
  position: relative
  margin-bottom: nix.sizes.md
  padding: nix.sizes.md
  border-radius: nix.borders.radius
