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
30 lines
761 B
TypeScript
30 lines
761 B
TypeScript
import Breadcrumbs from '@mui/joy/Breadcrumbs';
|
|
import Link from '@mui/joy/Link';
|
|
import Typography from '@mui/joy/Typography';
|
|
import JoyVariablesDemo from 'docs/src/modules/components/JoyVariablesDemo';
|
|
|
|
export default function BreadcrumbsVariables() {
|
|
return (
|
|
<JoyVariablesDemo
|
|
componentName="Breadcrumbs"
|
|
data={[
|
|
{
|
|
var: '--Breadcrumbs-gap',
|
|
defaultValue: '4px',
|
|
},
|
|
]}
|
|
renderDemo={(sx) => (
|
|
<Breadcrumbs sx={sx}>
|
|
{['Menu 1', 'Menu 2'].map((item) => (
|
|
<Link key={item} color="neutral" href="#css-variable-playground">
|
|
{item}
|
|
</Link>
|
|
))}
|
|
|
|
<Typography>Menu 3</Typography>
|
|
</Breadcrumbs>
|
|
)}
|
|
/>
|
|
);
|
|
}
|