mirror of
https://github.com/ant-design/ant-design.git
synced 2024-12-16 01:29:11 +08:00
77d1328f5e
* fix: line Progress gradient should be full width * chore: code clean * chore: update snapshot
25 lines
987 B
TypeScript
25 lines
987 B
TypeScript
import React from 'react';
|
|
import { Progress, Space } from 'antd';
|
|
|
|
const twoColors = { '0%': '#108ee9', '100%': '#87d068' };
|
|
const conicColors = { '0%': '#87d068', '50%': '#ffe58f', '100%': '#ffccc7' };
|
|
|
|
const App: React.FC = () => (
|
|
<div style={{ display: 'flex', flexDirection: 'column', rowGap: 16 }}>
|
|
<Progress percent={99.9} strokeColor={twoColors} />
|
|
<Progress percent={50} status="active" strokeColor={{ from: '#108ee9', to: '#87d068' }} />
|
|
<Space wrap>
|
|
<Progress type="circle" percent={90} strokeColor={twoColors} />
|
|
<Progress type="circle" percent={100} strokeColor={twoColors} />
|
|
<Progress type="circle" percent={93} strokeColor={conicColors} />
|
|
</Space>
|
|
<Space wrap>
|
|
<Progress type="dashboard" percent={90} strokeColor={twoColors} />
|
|
<Progress type="dashboard" percent={100} strokeColor={twoColors} />
|
|
<Progress type="dashboard" percent={93} strokeColor={conicColors} />
|
|
</Space>
|
|
</div>
|
|
);
|
|
|
|
export default App;
|