@ddsys/material/lib/styles/card.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,
      card = variables.card;


  return {
    style: {
      position: "relative",
      display: "flex",
      flexDirection: "column",
      minWidth: "0",
      wordWrap: "break-word",
      backgroundColor: colors.white,
      backgroundClip: "border-box",
      border: "1px solid " + (0, _color2.default)(colors.gray_900).alpha(0.2).string(),
      borderRadius: card.borderRadius + "rem"
    },
    header: {
      padding: "0.75rem 1.25rem",
      marginBottom: "0",
      backgroundColor: colors.gray_200,
      borderBottom: "1px solid " + (0, _color2.default)(colors.gray_900).alpha(0.2).string(),
      "&:first-child": {
        borderRadius: "calc(" + card.borderRadius + "rem - 1px) calc(" + card.borderRadius + "rem - 1px) 0 0"
      }
    },
    body: {
      flex: "1 1 auto",
      padding: common.spacing * 1.25 + "rem"
    },
    footer: {
      padding: common.spacing * 0.75 + "rem " + common.spacing * 1.25 + "rem",
      backgroundColor: colors.gray_200,
      borderTop: "1px solid " + (0, _color2.default)(colors.gray_900).alpha(0.2).string()
    }
  };
};

var _color = require("color");

var _color2 = _interopRequireDefault(_color);

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