@procore/core-react/dist/AvatarStack/AvatarStack.styles.js

React library of Procore Design Guidelines

import styled from 'styled-components';
import { Avatar } from '../Avatar';
import { ContactItem } from '../ContactItem';
import { Modal } from '../Modal';
import { colors } from '../_styles/colors';
import { spacing } from '../_styles/spacing';
var maxModalWidth = 528;
var StyledBaseAvatar = /*#__PURE__*/styled(Avatar).withConfig({
  displayName: "StyledBaseAvatar",
  componentId: "core-12_44_0__sc-ft72hu-0"
})(["border-color:", ";border-style:solid;border-width:1px;&:hover{z-index:1;}"], colors.white);
export var StyledAvatar = /*#__PURE__*/styled(StyledBaseAvatar).withConfig({
  displayName: "StyledAvatar",
  componentId: "core-12_44_0__sc-ft72hu-1"
})(["background-color:", ";"], function (props) {
  return colors[props.$color];
});
export var StyledContactItems = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledContactItems",
  componentId: "core-12_44_0__sc-ft72hu-2"
})(["padding-top:", "px;padding-bottom:", "px;padding-left:", "px;"], spacing.sm, spacing.sm, spacing.xs);
export var StyledWrapper = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledWrapper",
  componentId: "core-12_44_0__sc-ft72hu-3"
})(["display:flex;", " + ", "{margin-left:-", "px;}"], StyledAvatar, StyledAvatar, spacing.sm);
export var StyledViewAllWrapper = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledViewAllWrapper",
  componentId: "core-12_44_0__sc-ft72hu-4"
})(["display:flex;margin-left:", "px;margin-bottom:", "px;"], spacing.md, spacing.lg);
export var StyledModalBody = /*#__PURE__*/styled(Modal.Body).withConfig({
  displayName: "StyledModalBody",
  componentId: "core-12_44_0__sc-ft72hu-5"
})(["max-width:", "px;"], maxModalWidth);
export var StyledContactItem = /*#__PURE__*/styled(ContactItem).withConfig({
  displayName: "StyledContactItem",
  componentId: "core-12_44_0__sc-ft72hu-6"
})(["flex-shrink:0;"]);
//# sourceMappingURL=AvatarStack.styles.js.map