mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2025-08-06 16:06:28 +08:00
Code Issues Actions 18 Packages Projects Releases Wiki Activity

fix: Optimize the display of elements of the block type. (#25903)

Browse Source 
* add flex style

* add new demo

* update snapshot

* Merge branch feature into fix-descriptions

* update snapshot

* update snapshot
This commit is contained in:
陈帅 2020-08-06 14:32:13 +08:00 committed by GitHub
parent b92a9a5678
commit f928baf52a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
15 changed files with 1164 additions and 443 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components/avatar/__tests__/Avatar.test.js
View File

@ -163,10 +163,7 @@ describe('Avatar Render', () => {
const div = global.document.createElement('div');
global.document.body.appendChild(div);
const wrapper = mount(
<Avatar
shape="circle"
src="http://error.url"
>
<Avatar shape="circle" src="http://error.url">
A
</Avatar>,
{ attachTo: div },

10
components/avatar/demo/fallback.md
View File

@ -19,16 +19,10 @@ import { Avatar } from 'antd';
ReactDOM.render(
<>
<Avatar
shape="circle"
src="http://abc.com/not-exist.jpg"
>
<Avatar shape="circle" src="http://abc.com/not-exist.jpg">
A
</Avatar>
<Avatar
shape="circle"
src="http://abc.com/not-exist.jpg"
>
<Avatar shape="circle" src="http://abc.com/not-exist.jpg">
ABC
</Avatar>
</>,

2
components/descriptions/Cell.tsx
View File

@ -54,6 +54,7 @@ const Cell: React.FC<CellProps> = ({
style={style}
colSpan={span}
>
<div className={`${itemPrefixCls}-item-container`}>
{label && (
<span
className={classNames(`${itemPrefixCls}-item-label`, {
@ -64,6 +65,7 @@ const Cell: React.FC<CellProps> = ({
</span>
)}
{content && <span className={classNames(`${itemPrefixCls}-item-content`)}>{content}</span>}
</div>
</Component>
);
};

479
components/descriptions/__tests__/__snapshots__/demo.test.js.snap
View File

@ -24,6 +24,9 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -35,10 +38,14 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
>
Zhou Maomao
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -50,10 +57,14 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
>
1810000000
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -65,6 +76,7 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
>
Hangzhou, Zhejiang
</span>
</div>
</td>
</tr>
<tr
@ -73,6 +85,9 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -84,10 +99,14 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
>
empty
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -99,6 +118,7 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
>
No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China
</span>
</div>
</td>
</tr>
</tbody>
@ -668,6 +688,9 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -679,10 +702,14 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
>
Cloud Database
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -694,10 +721,14 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
>
Prepaid
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -709,6 +740,7 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
>
18:00:00
</span>
</div>
</td>
</tr>
<tr
@ -717,6 +749,9 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -728,10 +763,14 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
>
$80.00
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -743,10 +782,14 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
>
$20.00
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -758,6 +801,7 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
>
$60.00
</span>
</div>
</td>
</tr>
</tbody>
@ -767,6 +811,401 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
</div>
`;
exports[`renders ./components/descriptions/demo/text.md correctly 1`] = `
<div
class="ant-descriptions"
>
<div
class="ant-descriptions-header"
>
<div
class="ant-descriptions-title"
>
User Info
</div>
</div>
<div
class="ant-descriptions-view"
>
<table>
<tbody>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Product
</span>
<span
class="ant-descriptions-item-content"
>
Cloud Database
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Billing Mode
</span>
<span
class="ant-descriptions-item-content"
>
Prepaid
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Automatic Renewal
</span>
<span
class="ant-descriptions-item-content"
>
YES
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Order time
</span>
<span
class="ant-descriptions-item-content"
>
2018-04-24 18:00:00
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Usage Time
</span>
<span
class="ant-descriptions-item-content"
>
2019-04-24 18:00:00
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Status
</span>
<span
class="ant-descriptions-item-content"
>
<span
class="ant-badge ant-badge-status ant-badge-not-a-wrapper"
>
<span
class="ant-badge-status-dot ant-badge-status-processing"
/>
<span
class="ant-badge-status-text"
>
Running
</span>
</span>
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Negotiated Amount
</span>
<span
class="ant-descriptions-item-content"
>
$80.00
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Discount
</span>
<span
class="ant-descriptions-item-content"
>
$20.00
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Official Receipts
</span>
<span
class="ant-descriptions-item-content"
>
$60.00
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Config Info
</span>
<span
class="ant-descriptions-item-content"
>
Data disk type: MongoDB
<br />
Database version: 3.4
<br />
Package: dds.mongo.mid
<br />
Storage space: 10 GB
<br />
Replication factor: 3
<br />
Region: East China 1
<br />
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Official Receipts
</span>
<span
class="ant-descriptions-item-content"
>
$60.00
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Config Info
</span>
<span
class="ant-descriptions-item-content"
>
<div
class="ant-table-wrapper"
>
<div
class="ant-spin-nested-loading"
>
<div
class="ant-spin-container"
>
<div
class="ant-table ant-table-small"
>
<div
class="ant-table-container"
>
<div
class="ant-table-content"
>
<table
style="table-layout:auto"
>
<colgroup />
<thead
class="ant-table-thead"
>
<tr>
<th
class="ant-table-cell"
>
姓名
</th>
<th
class="ant-table-cell"
>
年龄
</th>
<th
class="ant-table-cell"
>
住址
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody"
>
<tr
class="ant-table-row ant-table-row-level-0"
data-row-key="1"
>
<td
class="ant-table-cell"
>
胡彦斌
</td>
<td
class="ant-table-cell"
>
32
</td>
<td
class="ant-table-cell"
>
西湖区湖底公园1号
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0"
data-row-key="2"
>
<td
class="ant-table-cell"
>
胡彦祖
</td>
<td
class="ant-table-cell"
>
42
</td>
<td
class="ant-table-cell"
>
西湖区湖底公园1号
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</span>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
`;
exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
<div
class="ant-descriptions"
@ -791,32 +1230,44 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
<th
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
UserName
</span>
</div>
</th>
<th
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Telephone
</span>
</div>
</th>
<th
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Live
</span>
</div>
</th>
</tr>
<tr
@ -825,32 +1276,44 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
Zhou Maomao
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
1810000000
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
Hangzhou, Zhejiang
</span>
</div>
</td>
</tr>
<tr
@ -859,22 +1322,30 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
<th
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Address
</span>
</div>
</th>
<th
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Remark
</span>
</div>
</th>
</tr>
<tr
@ -883,22 +1354,30 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
empty
</span>
</div>
</td>
</tr>
</tbody>

88
components/descriptions/__tests__/__snapshots__/index.test.js.snap
View File

@ -15,6 +15,9 @@ exports[`Descriptions Descriptions support colon 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label ant-descriptions-item-no-colon"
@ -26,6 +29,7 @@ exports[`Descriptions Descriptions support colon 1`] = `
>
Cloud Database
</span>
</div>
</td>
</tr>
</tbody>
@ -50,12 +54,16 @@ exports[`Descriptions Descriptions support style 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
Cloud Database
</span>
</div>
</td>
</tr>
</tbody>
@ -79,6 +87,9 @@ exports[`Descriptions Descriptions.Item support className 1`] = `
<td
class="ant-descriptions-item my-class"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -90,6 +101,7 @@ exports[`Descriptions Descriptions.Item support className 1`] = `
>
Cloud Database
</span>
</div>
</td>
</tr>
</tbody>
@ -113,6 +125,9 @@ exports[`Descriptions column is number 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -124,10 +139,14 @@ exports[`Descriptions column is number 1`] = `
>
Cloud Database
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -139,10 +158,14 @@ exports[`Descriptions column is number 1`] = `
>
Prepaid
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -154,6 +177,7 @@ exports[`Descriptions column is number 1`] = `
>
18:00:00
</span>
</div>
</td>
</tr>
<tr
@ -162,6 +186,9 @@ exports[`Descriptions column is number 1`] = `
<td
class="ant-descriptions-item"
colspan="3"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -173,6 +200,7 @@ exports[`Descriptions column is number 1`] = `
>
$80.00
</span>
</div>
</td>
</tr>
</tbody>
@ -196,6 +224,9 @@ exports[`Descriptions should work with React Fragment 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -207,6 +238,7 @@ exports[`Descriptions should work with React Fragment 1`] = `
>
bamboo
</span>
</div>
</td>
</tr>
<tr
@ -215,6 +247,9 @@ exports[`Descriptions should work with React Fragment 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -226,6 +261,7 @@ exports[`Descriptions should work with React Fragment 1`] = `
>
bamboo
</span>
</div>
</td>
</tr>
<tr
@ -234,6 +270,9 @@ exports[`Descriptions should work with React Fragment 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -245,6 +284,7 @@ exports[`Descriptions should work with React Fragment 1`] = `
>
bamboo
</span>
</div>
</td>
</tr>
</tbody>
@ -268,12 +308,16 @@ exports[`Descriptions vertical layout 1`] = `
<th
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Product
</span>
</div>
</th>
</tr>
<tr
@ -282,12 +326,16 @@ exports[`Descriptions vertical layout 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
Cloud Database
</span>
</div>
</td>
</tr>
<tr
@ -296,12 +344,16 @@ exports[`Descriptions vertical layout 1`] = `
<th
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Billing
</span>
</div>
</th>
</tr>
<tr
@ -310,12 +362,16 @@ exports[`Descriptions vertical layout 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
Prepaid
</span>
</div>
</td>
</tr>
<tr
@ -324,12 +380,16 @@ exports[`Descriptions vertical layout 1`] = `
<th
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
time
</span>
</div>
</th>
</tr>
<tr
@ -338,12 +398,16 @@ exports[`Descriptions vertical layout 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
18:00:00
</span>
</div>
</td>
</tr>
<tr
@ -352,12 +416,16 @@ exports[`Descriptions vertical layout 1`] = `
<th
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
>
Amount
</span>
</div>
</th>
</tr>
<tr
@ -366,12 +434,16 @@ exports[`Descriptions vertical layout 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
$80.00
</span>
</div>
</td>
</tr>
</tbody>
@ -395,6 +467,9 @@ exports[`Descriptions when item is rendered conditionally 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -406,6 +481,7 @@ exports[`Descriptions when item is rendered conditionally 1`] = `
>
Cloud Database
</span>
</div>
</td>
</tr>
<tr
@ -414,6 +490,9 @@ exports[`Descriptions when item is rendered conditionally 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -425,6 +504,7 @@ exports[`Descriptions when item is rendered conditionally 1`] = `
>
Prepaid
</span>
</div>
</td>
</tr>
<tr
@ -433,6 +513,9 @@ exports[`Descriptions when item is rendered conditionally 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -444,6 +527,7 @@ exports[`Descriptions when item is rendered conditionally 1`] = `
>
18:00:00
</span>
</div>
</td>
</tr>
<tr
@ -452,6 +536,9 @@ exports[`Descriptions when item is rendered conditionally 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -463,6 +550,7 @@ exports[`Descriptions when item is rendered conditionally 1`] = `
>
$80.00
</span>
</div>
</td>
</tr>
</tbody>

87
components/descriptions/demo/text.md Normal file
View File

@ -0,0 +1,87 @@
---
order: 1
debug: true
title:
zh-CN: 复杂文本的情况
en-US: border
---
## zh-CN
带边框和背景颜色列表。
## en-US
Descriptions with border and background color.
```jsx
import { Descriptions, Badge, Table } from 'antd';
const dataSource = [
{
key: '1',
name: '胡彦斌',
age: 32,
address: '西湖区湖底公园1号',
},
{
key: '2',
name: '胡彦祖',
age: 42,
address: '西湖区湖底公园1号',
},
];
const columns = [
{
title: '姓名',
dataIndex: 'name',
key: 'name',
},
{
title: '年龄',
dataIndex: 'age',
key: 'age',
},
{
title: '住址',
dataIndex: 'address',
key: 'address',
},
];
ReactDOM.render(
<Descriptions title="User Info" column={2}>
<Descriptions.Item label="Product">Cloud Database</Descriptions.Item>
<Descriptions.Item label="Billing Mode">Prepaid</Descriptions.Item>
<Descriptions.Item label="Automatic Renewal">YES</Descriptions.Item>
<Descriptions.Item label="Order time">2018-04-24 18:00:00</Descriptions.Item>
<Descriptions.Item label="Usage Time" span={2}>
2019-04-24 18:00:00
</Descriptions.Item>
<Descriptions.Item label="Status" span={3}>
<Badge status="processing" text="Running" />
</Descriptions.Item>
<Descriptions.Item label="Negotiated Amount">$80.00</Descriptions.Item>
<Descriptions.Item label="Discount">$20.00</Descriptions.Item>
<Descriptions.Item label="Official Receipts">$60.00</Descriptions.Item>
<Descriptions.Item label="Config Info">
Data disk type: MongoDB
<br />
Database version: 3.4
<br />
Package: dds.mongo.mid
<br />
Storage space: 10 GB
<br />
Replication factor: 3
<br />
Region: East China 1<br />
</Descriptions.Item>
<Descriptions.Item label="Official Receipts">$60.00</Descriptions.Item>
<Descriptions.Item label="Config Info">
<Table size="small" pagination={false} dataSource={dataSource} columns={columns} />
</Descriptions.Item>
</Descriptions>,
mountNode,
);
```

6
components/descriptions/style/index.less
View File

@ -82,6 +82,7 @@
&-item-content {
display: table-cell;
flex: 1;
color: @text-color;
font-size: @font-size-base;
line-height: @line-height-base;
@ -89,10 +90,15 @@
&-item {
padding-bottom: 0;
vertical-align: top;
> span {
display: inline-flex;
align-items: baseline;
}
&-container {
display: flex;
}
}
&-middle {

60
components/page-header/__tests__/__snapshots__/demo.test.js.snap
View File

@ -102,6 +102,9 @@ Array [
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -113,10 +116,14 @@ Array [
>
Lili Qu
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -130,10 +137,14 @@ Array [
421421
</a>
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -145,6 +156,7 @@ Array [
>
2017-01-10
</span>
</div>
</td>
</tr>
<tr
@ -153,6 +165,9 @@ Array [
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -164,10 +179,14 @@ Array [
>
2017-10-10
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -179,6 +198,7 @@ Array [
>
Gonghu Road, Xihu District, Hangzhou, Zhejiang, China
</span>
</div>
</td>
</tr>
</tbody>
@ -826,6 +846,9 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -837,10 +860,14 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = `
>
Lili Qu
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -854,10 +881,14 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = `
421421
</a>
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -869,6 +900,7 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = `
>
2017-01-10
</span>
</div>
</td>
</tr>
<tr
@ -877,6 +909,9 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -888,10 +923,14 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = `
>
2017-10-10
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -903,6 +942,7 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = `
>
Gonghu Road, Xihu District, Hangzhou, Zhejiang, China
</span>
</div>
</td>
</tr>
</tbody>
@ -1021,6 +1061,9 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -1032,10 +1075,14 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
>
Lili Qu
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -1049,6 +1096,7 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
421421
</a>
</span>
</div>
</td>
</tr>
<tr
@ -1057,6 +1105,9 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -1068,10 +1119,14 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
>
2017-01-10
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -1083,6 +1138,7 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
>
2017-10-10
</span>
</div>
</td>
</tr>
<tr
@ -1091,6 +1147,9 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
<td
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-label"
@ -1102,6 +1161,7 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = `
>
Gonghu Road, Xihu District, Hangzhou, Zhejiang, China
</span>
</div>
</td>
</tr>
</tbody>

2
components/table/__tests__/Table.pagination.test.js
View File

@ -349,7 +349,7 @@ describe('Table.pagination', () => {
const dropdownWrapper = mount(wrapper.find('Trigger').instance().getComponent());
dropdownWrapper.find('.ant-select-item-option').at(2).simulate('click');
expect(onChange).toBeCalledTimes(1)
expect(onChange).toBeCalledTimes(1);
});
it('dynamic warning', () => {

4
components/table/demo/custom-filter-panel.md
View File

@ -82,7 +82,9 @@ class App extends React.Component {
),
filterIcon: filtered => <SearchOutlined style={{ color: filtered ? '#1890ff' : undefined }} />,
onFilter: (value, record) =>
record[dataIndex] ? record[dataIndex].toString().toLowerCase().includes(value.toLowerCase()) : '',
record[dataIndex]
? record[dataIndex].toString().toLowerCase().includes(value.toLowerCase())
: '',
onFilterDropdownVisibleChange: visible => {
if (visible) {
setTimeout(() => this.searchInput.select());

3
docs/react/customize-theme.zh-CN.md
View File

@ -26,7 +26,8 @@ antd 的样式使用了 [Less](http://lesscss.org/) 作为开发语言，并定
@disabled-color: rgba(0, 0, 0, 0.25); // 失效色
@border-radius-base: 2px; // 组件/浮层圆角
@border-color-base: #d9d9d9; // 边框色
@box-shadow-base: 0 3px 6px -4px rgba(0,0,0,.12),0 6px 16px 0 rgba(0,0,0,.08),0 9px 28px 8px rgba(0,0,0,.05); // 浮层阴影
@box-shadow-base: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),
0 9px 28px 8px rgba(0, 0, 0, 0.05); // 浮层阴影
```
如果以上变量不能满足你的定制需求，可以给我们提 issue。

6
site/theme/en-US.js
View File

@ -116,8 +116,10 @@ module.exports = {
'app.publish.title': 'antd@3.0.0 has been released! 🎉 🎉 🎉',
'app.publish.greeting': 'Hello, ',
'app.publish.intro': ' has been released, so please upgrade. ',
'app.publish.old-version-guide': 'If you need documentation for an older version, please visit ',
'app.publish.old-version-tips': ', or switch the version via the dropdown in the header nav bar.',
'app.publish.old-version-guide':
'If you need documentation for an older version, please visit ',
'app.publish.old-version-tips':
', or switch the version via the dropdown in the header nav bar.',
'app.docs.color.pick-primary': 'Pick your primary color',
'app.docs.color.pick-background': 'Pick your background color',
'app.docs.components.icon.search.placeholder': 'Search icons here, click icon to copy code',

3
site/theme/template/Home/MorePage.tsx
View File

@ -46,7 +46,8 @@ const MORE_LIST: MoreProps[] = [
},
{
title: '设计法则「映射」: 让你的设计更符合直觉',
description: '影响一个东西好不好用的因素有很多，本文将从125条通用设计法则中的「映射Mapping」出发，探讨一下这个法则对事物可用性的影响。',
description:
'影响一个东西好不好用的因素有很多，本文将从125条通用设计法则中的「映射Mapping」出发，探讨一下这个法则对事物可用性的影响。',
img: 'https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*AVELR486CNcAAAAAAAAAAABkARQnAQ',
date: '2019-08-24',
source: 'zhihu',

6
site/theme/template/Home/RecommendPage.tsx
View File

@ -32,7 +32,8 @@ const LIST_CN: Recommend[] = [
},
{
title: 'JCD 驱动 - 复杂系统设计应对之道',
description: '基于蚂蚁集团 CTO 线的业务土壤，我们探索出以 JCD 为核心的企业级产品设计思维，助力设计师在深耕业务上有章可循，有方法可用。',
description:
'基于蚂蚁集团 CTO 线的业务土壤，我们探索出以 JCD 为核心的企业级产品设计思维，助力设计师在深耕业务上有章可循，有方法可用。',
img: 'https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*dGDxQZQ7ymoAAAAAAAAAAABkARQnAQ',
href: 'https://zhuanlan.zhihu.com/p/103237648',
},
@ -56,7 +57,8 @@ const LIST_EN: Recommend[] = [
},
{
title: 'Driven by JCD: How to Design Complicated Systems',
description: '🏦 Based on the business practice of Ant Group CTO line, we have summed up a design thinking system of enterprise product, which is called JCD.',
description:
'🏦 Based on the business practice of Ant Group CTO line, we have summed up a design thinking system of enterprise product, which is called JCD.',
img: 'https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*dGDxQZQ7ymoAAAAAAAAAAABkARQnAQ',
href: 'https://zhuanlan.zhihu.com/p/103237648',
},