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>
|
||
|
|
)}
|
||
|
|
/>
|
||
|
|
);
|
||
|
|
}
|