ant-design/components/radio/demo/component-token.tsx

52 lines
1.6 KiB
TypeScript
Raw Normal View History

import React from 'react';
import { ConfigProvider, Radio, Space } from 'antd';
const App: React.FC = () => (
<ConfigProvider
theme={{
components: {
Radio: {
radioSize: 20,
dotSize: 10,
dotColorDisabled: 'grey',
buttonBg: '#f6ffed',
buttonCheckedBg: '#d9f7be',
buttonColor: '#faad14',
buttonPaddingInline: 20,
buttonCheckedBgDisabled: '#fffbe6',
buttonCheckedColorDisabled: '#ffe58f',
buttonSolidCheckedColor: '#ffa39e',
wrapperMarginInlineEnd: 20,
},
},
}}
>
<Space direction="vertical">
<Radio checked>Test</Radio>
<Radio checked disabled>
Disabled
</Radio>
<Radio.Group defaultValue="a">
<Radio.Button value="a">Hangzhou</Radio.Button>
<Radio.Button value="b">Shanghai</Radio.Button>
<Radio.Button value="c">Beijing</Radio.Button>
<Radio.Button value="d">Chengdu</Radio.Button>
</Radio.Group>
<Radio.Group defaultValue="a" disabled>
<Radio.Button value="a">Hangzhou</Radio.Button>
<Radio.Button value="b">Shanghai</Radio.Button>
<Radio.Button value="c">Beijing</Radio.Button>
<Radio.Button value="d">Chengdu</Radio.Button>
</Radio.Group>
<Radio.Group defaultValue="a" buttonStyle="solid">
<Radio.Button value="a">Hangzhou</Radio.Button>
<Radio.Button value="b">Shanghai</Radio.Button>
<Radio.Button value="c">Beijing</Radio.Button>
<Radio.Button value="d">Chengdu</Radio.Button>
</Radio.Group>
</Space>
</ConfigProvider>
);
export default App;