\n {parents.map((link, index) => (\n
\n
\n {index < parents.length - 1 && (\n <>\n
\n\n
\n /\n \n >\n )}\n
\n ))}\n
\n ) : null\n}\n\nconst useStyles = makeStyles(({ breakpoints, palette }) => ({\n root: {\n [breakpoints.down(\"sm\")]: {\n textAlign: \"center\"\n }\n },\n item: {\n display: \"inline-block\"\n },\n delimiter: {\n display: \"inline-block\"\n },\n arrow: {\n [breakpoints.down(\"sm\")]: {\n display: \"none\"\n }\n },\n slash: {\n color: palette.rapunzel.black,\n [breakpoints.up(\"md\")]: {\n display: \"none\"\n }\n },\n list: {\n \"& span\": {\n color: palette.rapunzel.dark,\n textDecoration: \"none\"\n }\n }\n}))\n\nexport default Breadcrumbs\n","import { makeStyles } from \"@material-ui/core/styles\"\nimport { editorAttributes } from \"@starrepublic/epi/cms\"\nimport { PropertyInfo } from \"@starrepublic/epi/types/cms/content\"\nimport classNames from \"classnames\"\nimport { menuBackground } from \"common/backgrounds\"\nimport Breadcrumbs from \"common/Breadcrumbs\"\nimport Typography from \"common/Typography\"\nimport Wrapper from \"common/Wrapper\"\nimport useBreakpoint from \"hooks/useBreakpoint\"\nimport * as React from \"react\"\n\ntype Props = {\n title: string\n narrow?: boolean\n withBackground?: boolean\n propsInfo?: PropertyInfo\n}\n\nconst PageHeader: React.FunctionComponent