mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-03 04:30:06 +08:00
Merge pull request #16727 from ant-design/chore-doc
chore: some documents style
This commit is contained in:
commit
b155395dce
@ -2994,13 +2994,21 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class="ant-tabs-nav ant-tabs-nav-animated"
|
||||
>
|
||||
<div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-0
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="true"
|
||||
class="ant-tabs-tab-active ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 1
|
||||
Tab-1
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3008,7 +3016,7 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 2
|
||||
Tab-2
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3016,7 +3024,7 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 3
|
||||
Tab-3
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3024,7 +3032,7 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 4
|
||||
Tab-4
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3032,7 +3040,7 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 5
|
||||
Tab-5
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3040,7 +3048,7 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 6
|
||||
Tab-6
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3048,7 +3056,7 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 7
|
||||
Tab-7
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3056,7 +3064,7 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 8
|
||||
Tab-8
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3064,7 +3072,7 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 9
|
||||
Tab-9
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3072,7 +3080,7 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 10
|
||||
Tab-10
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
@ -3080,7 +3088,151 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab 11
|
||||
Tab-11
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-12
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-13
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-14
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-15
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-16
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-17
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-18
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-19
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-20
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-21
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-22
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-23
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-24
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-25
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-26
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-27
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-28
|
||||
</div>
|
||||
<div
|
||||
aria-disabled="false"
|
||||
aria-selected="false"
|
||||
class=" ant-tabs-tab"
|
||||
role="tab"
|
||||
>
|
||||
Tab-29
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
@ -3098,8 +3250,13 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
/>
|
||||
<div
|
||||
class="ant-tabs-content ant-tabs-content-animated ant-tabs-top-content"
|
||||
style="margin-left:0%"
|
||||
style="margin-left:-100%"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="false"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-active"
|
||||
@ -3167,6 +3324,96 @@ exports[`renders ./components/tabs/demo/slide.md correctly 1`] = `
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="ant-tabs-tabpane ant-tabs-tabpane-inactive"
|
||||
role="tabpanel"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
role="presentation"
|
||||
|
@ -40,39 +40,11 @@ class SlidingTabsDemo extends React.Component {
|
||||
<Radio.Button value="left">Vertical</Radio.Button>
|
||||
</Radio.Group>
|
||||
<Tabs defaultActiveKey="1" tabPosition={mode} style={{ height: 220 }}>
|
||||
<TabPane tab="Tab 1" key="1">
|
||||
Content of tab 1
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 2" key="2">
|
||||
Content of tab 2
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 3" key="3">
|
||||
Content of tab 3
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 4" key="4">
|
||||
Content of tab 4
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 5" key="5">
|
||||
Content of tab 5
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 6" key="6">
|
||||
Content of tab 6
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 7" key="7">
|
||||
Content of tab 7
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 8" key="8">
|
||||
Content of tab 8
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 9" key="9">
|
||||
Content of tab 9
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 10" key="10">
|
||||
Content of tab 10
|
||||
</TabPane>
|
||||
<TabPane tab="Tab 11" key="11">
|
||||
Content of tab 11
|
||||
</TabPane>
|
||||
{[...Array(30).keys()].map((i) => (
|
||||
<TabPane tab={`Tab-${i}`} key={i}>
|
||||
Content of tab {i}
|
||||
</TabPane>
|
||||
))}
|
||||
</Tabs>
|
||||
</div>
|
||||
);
|
||||
|
@ -3,7 +3,7 @@ order: 5
|
||||
title: Customize Theme
|
||||
---
|
||||
|
||||
Ant Design allows you to customize some basic design aspects in order to meet the needs of UI diversity from business and brand, including primary color, border radius, border color, etc.
|
||||
Ant Design allows you to customize our design tokens in order to meet the needs of UI diversity from business and brand, including primary color, border radius, border color, etc.
|
||||
|
||||
![customized themes](https://zos.alipayobjects.com/rmsportal/zTFoszBtDODhXfLAazfSpYbSLSEeytoG.png)
|
||||
|
||||
|
@ -3,7 +3,7 @@ order: 5
|
||||
title: 定制主题
|
||||
---
|
||||
|
||||
Ant Design 设计规范上支持一定程度的样式定制,以满足业务和品牌上多样化的视觉需求,包括但不限于主色、圆角、边框和部分组件的视觉定制。
|
||||
Ant Design 设计规范和技术上支持灵活的样式定制,以满足业务和品牌上多样化的视觉需求,包括但不限于全局样式(主色、圆角、边框)和指定组件的视觉定制。
|
||||
|
||||
![一些配置好的主题](https://zos.alipayobjects.com/rmsportal/zTFoszBtDODhXfLAazfSpYbSLSEeytoG.png)
|
||||
|
||||
|
@ -99,7 +99,7 @@ class IconDisplay extends React.Component<IconDisplayProps, IconDisplayState> {
|
||||
return (
|
||||
<>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||
<Radio.Group value={this.state.theme} onChange={this.handleChangeTheme} size="large">
|
||||
<Radio.Group value={this.state.theme} onChange={this.handleChangeTheme} size="large" buttonStyle="solid">
|
||||
<Radio.Button value="outlined">
|
||||
<Icon component={OutlinedIcon} /> {messages['app.docs.components.icon.outlined']}
|
||||
</Radio.Button>
|
||||
|
Loading…
Reference in New Issue
Block a user