ant-design/components/progress/design/demo/content.tsx
MadCcc e6e260db77
docs: add Progress design tab (#47013)
* docs: add Progress design tab

* chore: correct lint
2024-01-18 15:31:32 +08:00

32 lines
798 B
TypeScript

import React from 'react';
import { Flex, Progress, theme } from 'antd';
const Demo = () => {
const { token } = theme.useToken();
return (
<Flex gap="large">
<Flex gap="small" align="center">
<Progress size={16} type="circle" percent={68} trailColor={token.colorPrimaryBg} />
<div></div>
</Flex>
<Flex gap="small" align="center">
<Progress size={16} type="circle" percent={100} status="success" />
<div></div>
</Flex>
<Flex gap="small" align="center">
<Progress
size={16}
type="circle"
percent={68}
status="exception"
trailColor={token.colorErrorBg}
/>
<div>/</div>
</Flex>
</Flex>
);
};
export default Demo;