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

React library of Procore Design Guidelines

import styled, { css } from 'styled-components';
import { H1 } from '../Semantic';
import { getTypographyIntent } from '../Typography';
import { colors } from '../_styles/colors';
import { spacing } from '../_styles/spacing';
export var StyledHeaderBadge = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledHeaderBadge",
  componentId: "core-12_44_0__sc-1jpjx47-0"
})(["", " border-radius:10px;border-style:solid;border-width:1px;display:inline-block;margin-bottom:", "px;padding:1px ", "px;", ""], getTypographyIntent('small'), spacing.sm, spacing.sm, function (_ref) {
  var $variant = _ref.$variant;
  if ($variant) {
    if ($variant === 'trial') {
      return css(["background-color:", ";border-color:", ";color:", ";"], colors.purple50, colors.purple50, colors.white);
    }
  }
});

// TODO in v12 remove cursor: pointer;
export var StyledToolHeaderIconContainer = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledToolHeaderIconContainer",
  componentId: "core-12_44_0__sc-1jpjx47-1"
})(["color:", ";cursor:pointer;display:inline-flex;flex:0 0 auto;"], colors.orange50);
export var StyledHeaderTabs = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledHeaderTabs",
  componentId: "core-12_44_0__sc-1jpjx47-2"
})(["align-self:flex-end;flex:1 1 auto;min-width:100px;overflow:hidden;"]);
export var StyledHeaderActions = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledHeaderActions",
  componentId: "core-12_44_0__sc-1jpjx47-3"
})(["flex:0 0 auto;margin-left:auto;padding-left:", "px;"], spacing.lg);
export var StyledToolHeaderTitle = /*#__PURE__*/styled(H1).withConfig({
  displayName: "StyledToolHeaderTitle",
  componentId: "core-12_44_0__sc-1jpjx47-4"
})(["margin-right:", "px;white-space:nowrap;"], spacing.xl);
export var StyledToolHeader = /*#__PURE__*/styled.div.withConfig({
  displayName: "StyledToolHeader",
  componentId: "core-12_44_0__sc-1jpjx47-5"
})(["align-items:center;display:flex;min-height:36px;width:100%;", " + ", ",a + ", ",button + ", "{margin-left:", "px;}"], StyledToolHeaderIconContainer, StyledToolHeaderTitle, StyledToolHeaderTitle, StyledToolHeaderTitle, spacing.lg);
//# sourceMappingURL=ToolHeader.styles.js.map