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

React library of Procore Design Guidelines

import styled from 'styled-components';
import { getUnstyledButton } from '../Semantic/Semantic.styles';
import { getTypographyIntent } from '../Typography';
import { borderRadius } from '../_styles/borderRadius';
import { colors } from '../_styles/colors';
import { getGapOutlineFocus } from '../_styles/mixins';
import { getShadow } from '../_styles/shadows';
import { spacing } from '../_styles/spacing';
export var StyledTooltip = /*#__PURE__*/styled.span.withConfig({
  displayName: "StyledTooltip",
  componentId: "core-12_44_0__sc-1fawsi4-0"
})(["", " color:", ";max-width:200px;padding:", "px ", "px;position:relative;word-wrap:break-word;overflow-wrap:break-word;white-space:normal;&:empty{display:none;}"], getTypographyIntent('small'), colors.white, spacing.sm, spacing.md);
export var StyledContainer = /*#__PURE__*/styled.span.withConfig({
  displayName: "StyledContainer",
  componentId: "core-12_44_0__sc-1fawsi4-1"
})(["display:inline-flex;background-color:", ";border-radius:", "px;", " & + [data-overlay-arrow]{background:", ";}&:has(> span:empty) + [data-overlay-arrow]{display:none;}"], colors.gray15, borderRadius.md, getShadow(3, 'bottom'), colors.gray15);

// This is for the inline typography icon button. Note: not `Button` styles
export var StyledTooltipButton = /*#__PURE__*/styled.button.withConfig({
  displayName: "StyledTooltipButton",
  componentId: "core-12_44_0__sc-1fawsi4-2"
})(["", " border-radius:50%;color:", ";display:inline-flex;vertical-align:middle;&:focus-visible{", "}* + &{margin-left:", "px;}"], getUnstyledButton, colors.gray45, getGapOutlineFocus('ontop'), spacing.sm);
//# sourceMappingURL=Tooltip.styles.js.map