ant-design/components/divider/demo/component-token.tsx
Kyriewen c28e1ff210
docs: mark deprecated for date-picker defaultPickerValue prop (#43781)
* docs: mark deprecated for date-picker defaultPickerValue prop

* docs: mark deprecated for date-picker defaultPickerValue prop

* docs: 删除 defaultPickerValue 属性

* chore: use defaultValue instead defaultPickerValue

---------

Co-authored-by: zbw01218944 <zbw01218944@alibaba-inc.com>
2023-09-07 17:56:55 +08:00

59 lines
1.9 KiB
TypeScript

import React from 'react';
import { ConfigProvider, Divider } from 'antd';
const App: React.FC = () => (
<ConfigProvider
theme={{
token: {
margin: 24,
marginLG: 48,
lineWidth: 5,
colorSplit: '#1677ff',
},
components: {
Divider: {
verticalMarginInline: 16,
textPaddingInline: 16,
orientationMargin: 0.2,
},
},
}}
>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista
probare, quae sunt a te dicta? Refert tamen, quo modo.
</p>
<Divider>Text</Divider>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista
probare, quae sunt a te dicta? Refert tamen, quo modo.
</p>
<Divider orientation="left">Left Text</Divider>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista
probare, quae sunt a te dicta? Refert tamen, quo modo.
</p>
<Divider orientation="right">Right Text</Divider>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista
probare, quae sunt a te dicta? Refert tamen, quo modo.
</p>
<Divider orientation="left" orientationMargin="0">
Left Text with 0 orientationMargin
</Divider>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista
probare, quae sunt a te dicta? Refert tamen, quo modo.
</p>
<Divider orientation="right" orientationMargin={50}>
Right Text with 50px orientationMargin
</Divider>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista
probare, quae sunt a te dicta? Refert tamen, quo modo.
</p>
</ConfigProvider>
);
export default App;