005cf56baf
Some checks failed
No response / noResponse (push) Has been cancelled
CI / Continuous releases (push) Has been cancelled
CI / test-dev (macos-latest) (push) Has been cancelled
CI / test-dev (ubuntu-latest) (push) Has been cancelled
CI / test-dev (windows-latest) (push) Has been cancelled
Maintenance / main (push) Has been cancelled
Scorecards supply-chain security / Scorecards analysis (push) Has been cancelled
CodeQL / Analyze (push) Has been cancelled
39 lines
1.2 KiB
TypeScript
39 lines
1.2 KiB
TypeScript
import Breadcrumbs from '@mui/joy/Breadcrumbs';
|
|
import Link from '@mui/joy/Link';
|
|
import Stack from '@mui/joy/Stack';
|
|
import Typography from '@mui/joy/Typography';
|
|
|
|
export default function BreadcrumbsSizes() {
|
|
return (
|
|
<Stack sx={{ display: 'flex', alignItems: 'center' }}>
|
|
<Breadcrumbs separator="—" aria-label="breadcrumbs" size="sm">
|
|
{['Home', 'TV Shows', 'Futurama', 'Characters'].map((item) => (
|
|
<Link key={item} color="neutral" href="#sizes">
|
|
{item}
|
|
</Link>
|
|
))}
|
|
|
|
<Typography>Dr. Zoidberg</Typography>
|
|
</Breadcrumbs>
|
|
<Breadcrumbs separator="—" aria-label="breadcrumbs" size="md">
|
|
{['Home', 'TV Shows', 'Futurama', 'Characters'].map((item) => (
|
|
<Link key={item} color="neutral" href="#sizes">
|
|
{item}
|
|
</Link>
|
|
))}
|
|
|
|
<Typography>Dr. Zoidberg</Typography>
|
|
</Breadcrumbs>
|
|
<Breadcrumbs separator="—" aria-label="breadcrumbs" size="lg">
|
|
{['Home', 'TV Shows', 'Futurama', 'Characters'].map((item) => (
|
|
<Link key={item} color="neutral" href="#sizes">
|
|
{item}
|
|
</Link>
|
|
))}
|
|
|
|
<Typography>Dr. Zoidberg</Typography>
|
|
</Breadcrumbs>
|
|
</Stack>
|
|
);
|
|
}
|