@procore/core-react
Version:
React library of Procore Design Guidelines
39 lines • 2.9 kB
JavaScript
import styled from 'styled-components';
import { Box } from '../Box/Box';
import { Card } from '../Card/Card';
import { Page } from '../PageLayout/PageLayout';
import { getActions, StyledPageBanner } from '../PageLayout/PageLayout.styles';
import { sectionClassnames, StyledSection, StyledSectionInner } from '../Section/Section.styles';
import { colors } from '../_styles/colors';
import { spacing } from '../_styles/spacing';
export var StyledDetailPage = /*#__PURE__*/styled.div.withConfig({
displayName: "StyledDetailPage",
componentId: "core-12_44_0__sc-cytnlo-0"
})(["background-color:", ";height:100%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;"], colors.gray96);
export var StyledDetailPageBody = /*#__PURE__*/styled.div.withConfig({
displayName: "StyledDetailPageBody",
componentId: "core-12_44_0__sc-cytnlo-1"
})(["padding-bottom:", "px;"], spacing.xl);
export var StyledDetailPageFooterNotation = /*#__PURE__*/styled.div.withConfig({
displayName: "StyledDetailPageFooterNotation",
componentId: "core-12_44_0__sc-cytnlo-2"
})(["flex-grow:1;z-index:1;"]);
export var StyledDetailPageFooter = /*#__PURE__*/styled(Page.Footer).withConfig({
displayName: "StyledDetailPageFooter",
componentId: "core-12_44_0__sc-cytnlo-3"
})(["display:flex;padding:", "px 0;background-color:", ";justify-content:center;"], spacing.lg, colors.white);
export var StyledDetailPageFooterActions = /*#__PURE__*/styled(Box).withConfig({
displayName: "StyledDetailPageFooterActions",
componentId: "core-12_44_0__sc-cytnlo-4"
})(["", ""], getActions());
var maxFooterContentWidth = 1920;
export var StyledDetailPageFooterContent = /*#__PURE__*/styled.div.withConfig({
displayName: "StyledDetailPageFooterContent",
componentId: "core-12_44_0__sc-cytnlo-5"
})(["width:100%;align-items:center;display:flex;justify-content:flex-end;padding:0 ", "px;max-width:", "px;"], spacing.xl, maxFooterContentWidth);
var detailPageCardBorderRadius = 8;
export var StyledDetailPageCard = /*#__PURE__*/styled(Card).withConfig({
displayName: "StyledDetailPageCard",
componentId: "core-12_44_0__sc-cytnlo-6"
})(["width:100%;border-radius:", "px;margin-top:", "px;margin-bottom:", "px;& + &{margin-top:", "px;}&:first-child{margin-top:0;}&:last-child{margin-bottom:", "px;}& > ", "{padding:", "px ", "px 0 ", "px;max-width:100%;&:empty{padding:0;}}& > ", " + ", " > ", "{border-top:0;}> .", ":first-child + .", ",> ", " + .", " + .", "{margin-top:", "px;}"], detailPageCardBorderRadius, spacing.lg, spacing.sm, spacing.sm, spacing.lg, StyledPageBanner, spacing.lg, spacing.lg, spacing.lg, StyledPageBanner, StyledSection, StyledSectionInner, sectionClassnames.levelAnonymous, sectionClassnames.level(2), StyledPageBanner, sectionClassnames.levelAnonymous, sectionClassnames.level(2), spacing.xxl * -1);
//# sourceMappingURL=DetailPage.styles.js.map