@helpscout/hsds-react/components/SimpleModal/SimpleModal.css.js

React component library for Help Scout's Design System

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.SimpleModalUI = exports.SimpleModalOverlayUI = exports.CloseModalButtonUI = void 0;

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _color = require("../../styles/utilities/color");

var _color2 = require("../../utilities/color");

var _useAnimatedRender = require("../../hooks/useAnimatedRender");

var _IconButton = _interopRequireDefault(require("../IconButton"));

var _focusRing = require("../../styles/mixins/focusRing.css");

var CloseModalButtonUI = (0, _styledComponents.default)(_IconButton.default).withConfig({
  displayName: "SimpleModalcss__CloseModalButtonUI",
  componentId: "yvi5ov-0"
})(["position:absolute;top:10px;right:10px;z-index:", ";"], function (_ref) {
  var $zIndex = _ref.$zIndex;
  return $zIndex;
});
exports.CloseModalButtonUI = CloseModalButtonUI;
var SimpleModalOverlayUI = (0, _styledComponents.default)('div').withConfig({
  displayName: "SimpleModalcss__SimpleModalOverlayUI",
  componentId: "yvi5ov-1"
})(["position:absolute;display:flex;flex-direction:column;align-items:center;justify-content:center;top:0;right:0;bottom:0;left:0;background-color:", ";z-index:", ";", ""], (0, _color2.rgba)((0, _color.getColor)('blue.800'), 0.7), function (_ref2) {
  var $zIndex = _ref2.$zIndex;
  return $zIndex;
}, _useAnimatedRender.defaultAnimation);
exports.SimpleModalOverlayUI = SimpleModalOverlayUI;
var SimpleModalUI = (0, _styledComponents.default)('div').withConfig({
  displayName: "SimpleModalcss__SimpleModalUI",
  componentId: "yvi5ov-2"
})(["", ";--focusRingColor:", ";--focusRingRadius:8px;position:relative;width:", ";height:", ";display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#fff;box-shadow:0px 4px 8px rgba(0,0,0,0.1);border-radius:6px;"], _focusRing.focusRing, (0, _color.getColor)('yellow.600'), function (_ref3) {
  var width = _ref3.width;
  return width;
}, function (_ref4) {
  var height = _ref4.height;
  return height;
});
exports.SimpleModalUI = SimpleModalUI;