@procore/core-react/dist/FileSelect/FileExplorer/FileExplorer.styles.js

React library of Procore Design Guidelines

import styled from 'styled-components';
import { Modal } from '../../Modal/Modal';
import { colors } from '../../_styles/colors';
import { spacing } from '../../_styles/spacing';
export var modalBodyHeight = 460;
var modalBodyMinHeight = 460;
var sourcePadding = spacing.md * 2;
var modalContainerMinWidth = 968;
var modalContainerMinHeight = 637;
var modalContainerMaxWidth = 1682;
var modalContainerMaxHeight = 996;
var modalContainerMargin = 80;
export var StyledModalOverlay = /*#__PURE__*/styled(Modal.Overlay).withConfig({
  displayName: "StyledModalOverlay",
  componentId: "core-12_44_0__sc-343gts-0"
})(["opacity:0;pointer-events:none;transition:opacity 0.3s linear;visibility:hidden;", ""], function (props) {
  return props.$open && "\n  opacity: 1;\n  pointer-events: all;\n  visibility: visible;\n  ";
});
export var StyledModalContainer = /*#__PURE__*/styled(Modal.Container).withConfig({
  displayName: "StyledModalContainer",
  componentId: "core-12_44_0__sc-343gts-1"
})(["width:calc(100% - ", "px);height:calc(100% - ", "px);top:calc(50vh - ", "px);left:calc(50vw - ", "px);margin:", "px;min-width:", "px;min-height:", "px;max-width:", "px;max-height:", "px;"], modalContainerMargin * 2, modalContainerMargin * 2, modalContainerMargin, modalContainerMargin, modalContainerMargin, modalContainerMinWidth, modalContainerMinHeight, modalContainerMaxWidth, modalContainerMaxHeight);
export var StyledModalBody = /*#__PURE__*/styled(Modal.Body).withConfig({
  displayName: "StyledModalBody",
  componentId: "core-12_44_0__sc-343gts-2"
})(["min-height:", "px;height:100%;margin:0;max-width:none;padding:0;border-bottom:1px solid ", ";"], modalBodyMinHeight, colors.gray85);
export var StyledModalInnerBody = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledModalInnerBody",
  componentId: "core-12_44_0__sc-343gts-3"
})(["display:flex;flex-direction:row;height:100%;overflow:hidden;"]);
export var StyledModalHeader = /*#__PURE__*/styled(Modal.Header).withConfig({
  displayName: "StyledModalHeader",
  componentId: "core-12_44_0__sc-343gts-4"
})(["border-bottom:1px solid ", ";"], colors.gray85);
export var StyledModalContent = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledModalContent",
  componentId: "core-12_44_0__sc-343gts-5"
})(["display:flex;width:100%;height:100%;overflow-y:auto;outline:none;"]);
export var StyledSource = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledSource",
  componentId: "core-12_44_0__sc-343gts-6"
})(["width:100%;height:100%;"]);
export var StyledAttachButton = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledAttachButton",
  componentId: "core-12_44_0__sc-343gts-7"
})(["margin-left:", "px;"], spacing.md);
export var StyledFileTreeSpinner = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledFileTreeSpinner",
  componentId: "core-12_44_0__sc-343gts-8"
})(["display:flex;align-items:center;justify-content:center;height:100%;"]);
//# sourceMappingURL=FileExplorer.styles.js.map