Skip to content

Latest commit

 

History

History
58 lines (52 loc) · 1.76 KB

Breadcrumb.md

File metadata and controls

58 lines (52 loc) · 1.76 KB
Raw
title section cssPrefix typescript propComponents
Breadcrumb
components
pf-c-breadcrumb
true
Breadcrumb
BreadcrumbItem
BreadcrumbHeading

import { Breadcrumb, BreadcrumbItem, BreadcrumbHeading } from '@patternfly/react-core';

Examples

import React from 'react';
import { Breadcrumb, BreadcrumbItem, BreadcrumbHeading } from '@patternfly/react-core';

SimpleBreadcrumbs = () => (
  <Breadcrumb>
    <BreadcrumbItem to="#">Section home</BreadcrumbItem>
    <BreadcrumbItem to="#">Section title</BreadcrumbItem>
    <BreadcrumbItem to="#">Section title</BreadcrumbItem>
    <BreadcrumbItem to="#" isActive>
      Section Landing
    </BreadcrumbItem>
  </Breadcrumb>
);
import React from 'react';
import { Breadcrumb, BreadcrumbItem, BreadcrumbHeading } from '@patternfly/react-core';

WithoutLinkBreadcrumbs = () => (
  <Breadcrumb>
    <BreadcrumbItem>Section Home</BreadcrumbItem>
    <BreadcrumbItem to="#">Section title</BreadcrumbItem>
    <BreadcrumbItem to="#">Section title</BreadcrumbItem>
    <BreadcrumbItem to="#">Section title</BreadcrumbItem>
    <BreadcrumbItem to="#">Section title</BreadcrumbItem>
    <BreadcrumbItem to="#" isActive>
      Section Landing
    </BreadcrumbItem>
  </Breadcrumb>
);
import React from 'react';
import { Breadcrumb, BreadcrumbItem, BreadcrumbHeading } from '@patternfly/react-core';

HeadingBreadcrumbs = () => (
  <Breadcrumb>
    <BreadcrumbItem to="#">Section home</BreadcrumbItem>
    <BreadcrumbItem to="#">Section title</BreadcrumbItem>
    <BreadcrumbItem to="#">Section title</BreadcrumbItem>
    <BreadcrumbItem to="#">Section title</BreadcrumbItem>
    <BreadcrumbHeading to="#">Section title</BreadcrumbHeading>
  </Breadcrumb>
);