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

React library of Procore Design Guidelines

import styled, { css } from 'styled-components';
import { StyledFormRow } from '../Form/Form.styles';
import { Title } from '../Title/Title';
import { colors } from '../_styles/colors';
import { getGapOutlineFocus } from '../_styles/mixins';
import { spacing } from '../_styles/spacing';
export var StyledSectionBanner = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledSectionBanner",
  componentId: "core-12_44_0__sc-1lxbrwv-0"
})(["margin-bottom:", "px;> * + *{margin-top:", "px;}"], spacing.sm, spacing.sm);
export var StyledSectionInner = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledSectionInner",
  componentId: "core-12_44_0__sc-1lxbrwv-1"
})([""]);
export var StyledSectionCollapseHeading = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledSectionCollapseHeading",
  componentId: "core-12_44_0__sc-1lxbrwv-2"
})(["align-self:flex-start;margin-right:", "px;"], spacing.sm);
export var sectionClassnames = {
  divide: 'section--divide',
  levelAnonymous: 'section--level-anon',
  level: function level(num) {
    return "section--level-".concat(num);
  }
};
export var StyledSection = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledSection",
  componentId: "core-12_44_0__sc-1lxbrwv-3"
})(["padding-left:", "px;padding-right:", "px;padding-bottom:", "px;& > ", "{padding-top:", "px;}&.", "{& > ", "{border-top:1px solid ", ";}}&:first-child > ", "{border-top:0;}& &{padding-left:0;padding-right:0;&:first-child > ", "{border-top:1px solid ", ";}&:last-child{padding-bottom:0;}}", ":last-of-type{margin-bottom:", "px;}", " + &&&{padding-top:", "px;}"], spacing.lg, spacing.lg, spacing.lg, StyledSectionInner, spacing.lg, sectionClassnames.divide, StyledSectionInner, colors.gray85, StyledSectionInner, StyledSectionInner, colors.gray85, StyledFormRow, spacing.lg * -1, StyledFormRow, spacing.xs);
export var StyledSectionContentRegion = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledSectionContentRegion",
  componentId: "core-12_44_0__sc-1lxbrwv-4"
})(["padding-top:", "px;&:focus-visible{", "}", " ", " & > :not(", ") + ", "{padding-top:", "px;}", " ", " &:last-of-type{padding-bottom:0;}"], spacing.sm, getGapOutlineFocus('inside'), function (_ref) {
  var $closed = _ref.$closed;
  return $closed && css(["padding-top:0;"]);
}, function (_ref2) {
  var $noHeader = _ref2.$noHeader;
  return $noHeader && css(["padding-top:0;"]);
}, StyledSection, StyledSection, spacing.xl, StyledSection, StyledSection);
export var StyledSectionHeader = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledSectionHeader",
  componentId: "core-12_44_0__sc-1lxbrwv-5"
})(["align-items:center;display:flex;min-height:36px;word-break:break-word;"]);
export var StyledTitle = /*#__PURE__*/styled(Title).withConfig({
  displayName: "StyledTitle",
  componentId: "core-12_44_0__sc-1lxbrwv-6"
})(["width:100%;"]);
//# sourceMappingURL=Section.styles.js.map