ant-design/components/collapse/demo/size.tsx
JiaQi 9d51345f90
feat(Collapse): Collapse support for setting size (#40286)
Co-authored-by: Yuiai01 <dujiaqi@kezaihui.com>
2023-01-21 18:45:09 +08:00

36 lines
923 B
TypeScript

import React from 'react';
import { Collapse, Divider } from 'antd';
const { Panel } = Collapse;
const text = `
A dog is a type of domesticated animal.
Known for its loyalty and faithfulness,
it can be found as a welcome guest in many households across the world.
`;
const App: React.FC = () => (
<>
<Divider orientation="left">Default Size</Divider>
<Collapse>
<Panel header="This is default size panel header" key="1">
<p>{text}</p>
</Panel>
</Collapse>
<Divider orientation="left">Small Size</Divider>
<Collapse size="small">
<Panel header="This is small size panel header" key="1">
<p>{text}</p>
</Panel>
</Collapse>
<Divider orientation="left">Large Size</Divider>
<Collapse size="large">
<Panel header="This is large size panel header" key="1">
<p>{text}</p>
</Panel>
</Collapse>
</>
);
export default App;