@ddsys/material/lib/index.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
});

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _color = require("color");

var _color2 = _interopRequireDefault(_color);

var _light = require("./themes/light");

var _light2 = _interopRequireDefault(_light);

var _dark = require("./themes/dark");

var _dark2 = _interopRequireDefault(_dark);

var _warm = require("./themes/warm");

var _warm2 = _interopRequireDefault(_warm);

var _styles = require("./base/styles");

var _styles2 = _interopRequireDefault(_styles);

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

var Themes = [_light2.default, _dark2.default, _warm2.default].map(function (theme) {
  var colors = theme.colors;

  var styles = (0, _styles2.default)(theme);
  return {
    themeName: theme.name,
    palette: {
      primary: { main: colors.primary },
      secondary: { main: colors.secondary }
    },
    typography: {
      title: { color: colors.dark },
      body1: { color: colors.dark },
      subheading: { color: colors.dark },
      caption: { color: colors.dark }
    },
    overrides: {
      MuiPaper: {
        root: {
          backgroundColor: colors.light
        }
      },
      MuiDialogContentText: {
        root: { color: colors.dark }
      },
      MuiDivider: {
        root: {
          backgroundColor: (0, _color2.default)(colors.dark).alpha(0.2).string()
        }
      },
      MuiCheckbox: {
        checked: {
          color: colors.dark + " !important"
        },
        root: {
          color: colors.dark
        }
      },
      MuiListItem: {
        button: {
          backgroundColor: colors.light,
          "&:hover": {
            backgroundColor: colors.selected_item_hover
          }
        }
      },
      MuiInput: {
        input: {
          backgroundColor: colors.light,
          color: colors.dark,
          border: "1px solid " + (0, _color2.default)(colors.dark).alpha(0.2).string(),
          "&:focus": {
            color: colors.black
          }
        }
      },
      MuiSelect: {
        icon: { color: colors.dark }
      },
      MuiButton: {
        root: {
          color: (0, _color2.default)(colors.dark).alpha(0.87).string()
        }
      },
      MuiCard: {
        root: {
          backgroundColor: colors.gray_100
        }
      }
    },
    styles: _extends({}, styles),
    colors: _extends({}, colors)
  };
});

exports.default = Themes;