@ddsys/material/lib/styles/alert.js

<p> <a href="https://bhp-dev.gitlab.io/dds-digital-design-system/">Read the docs</a> · <a href="mailto:UserExperience@bhpbilliton.com">Request feature</a> </p>

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

exports.default = function (theme) {
  var colors = theme.colors,
      variables = theme.variables;
  var common = variables.common,
      alert = variables.alert;


  return [{ name: "success", color: colors.success }, { name: "info", color: colors.info }, { name: "warning", color: colors.warning }, { name: "danger", color: colors.danger }].reduce(function (result, style) {
    result[style.name] = {
      display: "flex",
      border: "none",
      alignItems: "center",
      position: "relative",
      transition: "opacity 0.15s linear",
      padding: common.spacing * 0.75 + "rem " + common.spacing * 1.25 + "rem",
      color: colors.gray_900,
      marginBottom: common.spacing + "rem",
      borderRadius: common.spacing * 0.25 + "rem",
      borderLeft: alert.leftBorderWidth + "px solid " + style.color,
      backgroundColor: (0, _color2.default)(style.color).alpha(0.35).string(),
      "&:not($.show)": {
        opacity: 0
      }
    };
    return result;
  }, {});
};

var _color = require("color");

var _color2 = _interopRequireDefault(_color);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }