Files
react-test/docs/data/material/components/dividers/DividerText.tsx

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

35 lines
822 B
TypeScript
Raw Normal View History

2025-12-12 14:26:25 +09:00
import { styled } from '@mui/material/styles';
import Divider from '@mui/material/Divider';
import Chip from '@mui/material/Chip';
const Root = styled('div')(({ theme }) => ({
width: '100%',
...theme.typography.body2,
color: (theme.vars || theme).palette.text.secondary,
'& > :not(style) ~ :not(style)': {
marginTop: theme.spacing(2),
},
}));
export default function DividerText() {
const content = (
<p>{`Lorem ipsum dolor sit amet, consectetur adipiscing elit.`}</p>
);
return (
<Root>
{content}
<Divider>CENTER</Divider>
{content}
<Divider textAlign="left">LEFT</Divider>
{content}
<Divider textAlign="right">RIGHT</Divider>
{content}
<Divider>
<Chip label="Chip" size="small" />
</Divider>
{content}
</Root>
);
}