mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-07 17:44:35 +08:00
b1467d6ec8
* feat[Divider]: Unified use of orientation attribute
* feat: Restore the size type missed in the merge
* feat: Delete unnecessary demo adjustments
* docs: change text
* feat: deprecated warning
* Update components/divider/index.zh-CN.md
Signed-off-by: thinkasany <480968828@qq.com>
* Update components/divider/index.en-US.md
Signed-off-by: thinkasany <480968828@qq.com>
* feat: use useOrientation and change test,doc
* feat: change demos orientation attribut
* docs: change token and demo (orientationMargin->titlePlacementMargin)
* feat: change demos titlePlacement="left/right" -> "start/end"
* docs: titlePlacement align
* feat: Resolve merge conflicts
* fix: lint error
* fix: demo lint error
* feat: use mergedStyles.content
* test: update snapshot
* rerun ci
* test: update snapshot
* fix: delete titlePlacementMargin and udpate snapshots
* feat: change demos orientationMargin-> styles.content.margin
* Update components/divider/demo/vertical.md
Co-authored-by: thinkasany <480968828@qq.com>
Signed-off-by: EmilyyyLiu <100924403+EmilyyyLiu@users.noreply.github.com>
* feat: Call warning using list
* docs: `vertical` to make the divider vertical.
* docs: Modify punctuation usage
* docs: Add deprecated description
* docs: Clarify the possible values for titlePlacement in the example
* feat： replase { margin: '0' } ->{ margin: 0 }
---------
Signed-off-by: thinkasany <480968828@qq.com>
Signed-off-by: EmilyyyLiu <100924403+EmilyyyLiu@users.noreply.github.com>
Co-authored-by: 刘欢 <lh01217311@antgroup.com>
Co-authored-by: thinkasany <480968828@qq.com>
59 lines
1.9 KiB
TypeScript
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 titlePlacement="start">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 titlePlacement="end">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 titlePlacement="start" styles={{ content: { margin: 0 } }}>
|
|
Left Text margin with 0
|
|
</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 titlePlacement="end" styles={{ content: { margin: '0 50px' } }}>
|
|
Right Text margin with 50px
|
|
</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;
|