@mui-treasury/mockup/brands/dailyShopping/DailySummary.js

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _react = _interopRequireDefault(require("react"));

var _styles = require("@material-ui/core/styles");

var _Box = _interopRequireDefault(require("@material-ui/core/Box"));

var _Button = _interopRequireDefault(require("@material-ui/core/Button"));

var _Grid = _interopRequireDefault(require("@material-ui/core/Grid"));

var _Divider = _interopRequireDefault(require("@material-ui/core/Divider"));

var _KeyboardArrowLeft = _interopRequireDefault(require("@material-ui/icons/KeyboardArrowLeft"));

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

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var useStyles = (0, _styles.makeStyles)(function (_ref) {
  var palette = _ref.palette,
      breakpoints = _ref.breakpoints;
  return {
    btn: _defineProperty({
      width: '100%',
      paddingTop: 16,
      paddingBottom: 16,
      borderRadius: 40,
      border: '1px solid',
      borderColor: palette.grey[400],
      '& > *': {
        fontWeight: 'bold',
        textTransform: 'none'
      },
      marginRight: 72
    }, breakpoints.up('sm'), {
      marginRight: 'unset'
    }),
    big: {
      fontSize: 16
    },
    large: {
      fontSize: 24
    },
    mainGrid: _defineProperty({}, breakpoints.up('sm'), {
      flexDirection: 'row-reverse'
    })
  };
});

var DailySummary = function DailySummary() {
  var styles = useStyles();
  return /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    container: true,
    justify: 'space-between',
    className: styles.mainGrid,
    spacing: 2
  }, /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    item: true,
    xs: 12,
    sm: 5,
    md: 4
  }, /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    container: true,
    spacing: 1
  }, /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    item: true,
    xs: 5
  }, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
    align: 'right'
  }, /*#__PURE__*/_react["default"].createElement("b", {
    className: styles.big
  }, "Subtotal:"))), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    item: true,
    xs: 7
  }, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
    px: 2,
    align: 'right',
    className: styles.big
  }, /*#__PURE__*/_react["default"].createElement("span", null, "$149.96"))), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    item: true,
    xs: 5
  }, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
    align: 'right'
  }, /*#__PURE__*/_react["default"].createElement("b", {
    className: styles.big
  }, "Shipping:"))), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    item: true,
    xs: 7
  }, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
    px: 2,
    align: 'right',
    className: styles.big
  }, /*#__PURE__*/_react["default"].createElement("span", null, "$0")))), /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement(_Divider["default"], null), /*#__PURE__*/_react["default"].createElement("br", null), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    container: true,
    spacing: 1
  }, /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    item: true,
    xs: 5
  }, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
    align: 'right'
  }, /*#__PURE__*/_react["default"].createElement("b", {
    className: styles.big
  }, "Total:"))), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    item: true,
    xs: 7
  }, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
    px: 2,
    align: 'right',
    className: styles.large
  }, /*#__PURE__*/_react["default"].createElement("span", null, "$149.96"))))), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
    item: true,
    xs: 12,
    sm: 5,
    md: 4,
    container: true,
    alignItems: 'flex-end'
  }, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
    className: styles.btn,
    startIcon: /*#__PURE__*/_react["default"].createElement(_KeyboardArrowLeft["default"], null)
  }, "Continue Shopping")));
};

var _default = DailySummary;
exports["default"] = _default;