diff --git a/components/avatar/__tests__/Avatar.test.js b/components/avatar/__tests__/Avatar.test.js index bd2ac2fc0f..714029b810 100644 --- a/components/avatar/__tests__/Avatar.test.js +++ b/components/avatar/__tests__/Avatar.test.js @@ -163,10 +163,7 @@ describe('Avatar Render', () => { const div = global.document.createElement('div'); global.document.body.appendChild(div); const wrapper = mount( - + A , { attachTo: div }, diff --git a/components/avatar/demo/fallback.md b/components/avatar/demo/fallback.md index 4c497aa27b..b045f1c8fb 100644 --- a/components/avatar/demo/fallback.md +++ b/components/avatar/demo/fallback.md @@ -19,16 +19,10 @@ import { Avatar } from 'antd'; ReactDOM.render( <> - + A - + ABC , diff --git a/components/descriptions/Cell.tsx b/components/descriptions/Cell.tsx index 56560faa6f..214f9fdb71 100644 --- a/components/descriptions/Cell.tsx +++ b/components/descriptions/Cell.tsx @@ -54,16 +54,18 @@ const Cell: React.FC = ({ style={style} colSpan={span} > - {label && ( - - {label} - - )} - {content && {content}} +
+ {label && ( + + {label} + + )} + {content && {content}} +
); }; diff --git a/components/descriptions/__tests__/__snapshots__/demo.test.js.snap b/components/descriptions/__tests__/__snapshots__/demo.test.js.snap index 2d685644f9..12c6c29b72 100644 --- a/components/descriptions/__tests__/__snapshots__/demo.test.js.snap +++ b/components/descriptions/__tests__/__snapshots__/demo.test.js.snap @@ -25,46 +25,58 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = ` class="ant-descriptions-item" colspan="1" > - - UserName - - - Zhou Maomao - + + UserName + + + Zhou Maomao + + - - Telephone - - - 1810000000 - + + Telephone + + + 1810000000 + + - - Live - - - Hangzhou, Zhejiang - + + Live + + + Hangzhou, Zhejiang + + - - Remark - - - empty - + + Remark + + + empty + + - - Address - - - No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China - + + Address + + + No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China + + @@ -668,6 +688,156 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = ` +
+ + Product + + + Cloud Database + +
+ + +
+ + Billing + + + Prepaid + +
+ + +
+ + time + + + 18:00:00 + +
+ + + + +
+ + Amount + + + $80.00 + +
+ + +
+ + Discount + + + $20.00 + +
+ + +
+ + Official + + + $60.00 + +
+ + + + + + + +`; + +exports[`renders ./components/descriptions/demo/text.md correctly 1`] = ` +
+
+
+ User Info +
+
+
+ + + + - + - + + + - - + + + + + + + + + + + - + - + + + - - -
+
Cloud Database -
+ +
- Billing + Billing Mode Prepaid -
+
+
- time + Automatic Renewal - 18:00:00 + YES -
- - Amount + Order time + + + 2018-04-24 18:00:00 + + +
+
+ + Usage Time + + + 2019-04-24 18:00:00 + +
+
+
+ + Status + + + + + + Running + + + +
+
+
+ + Negotiated Amount $80.00 -
+ +
$20.00 -
+
+
- Official + Official Receipts $60.00 -
-
+
+ + +
+ + Config Info + + + Data disk type: MongoDB +
+ Database version: 3.4 +
+ Package: dds.mongo.mid +
+ Storage space: 10 GB +
+ Replication factor: 3 +
+ Region: East China 1 +
+ +
+ + + + +
+ + Official Receipts + + + $60.00 + +
+ + +
+ + Config Info + + +
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + + +
+ 姓名 + + 年龄 + + 住址 +
+ 胡彦斌 + + 32 + + 西湖区湖底公园1号 +
+ 胡彦祖 + + 42 + + 西湖区湖底公园1号 +
+
+
+
+
+
+
+ +
+ + + + `; @@ -792,31 +1231,43 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = ` class="ant-descriptions-item" colspan="1" > - - UserName - + + UserName + + - - Telephone - + + Telephone + + - - Live - + + Live + + - - Zhou Maomao - + + Zhou Maomao + + - - 1810000000 - + + 1810000000 + + - - Hangzhou, Zhejiang - + + Hangzhou, Zhejiang + + - - Address - + + Address + + - - Remark - + + Remark + + - - No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China - + + No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China + + - - empty - + + empty + + diff --git a/components/descriptions/__tests__/__snapshots__/index.test.js.snap b/components/descriptions/__tests__/__snapshots__/index.test.js.snap index 2d5de1ff6f..52c052dbcd 100644 --- a/components/descriptions/__tests__/__snapshots__/index.test.js.snap +++ b/components/descriptions/__tests__/__snapshots__/index.test.js.snap @@ -16,16 +16,20 @@ exports[`Descriptions Descriptions support colon 1`] = ` class="ant-descriptions-item" colspan="1" > - - Product - - - Cloud Database - + + Product + + + Cloud Database + + @@ -51,11 +55,15 @@ exports[`Descriptions Descriptions support style 1`] = ` class="ant-descriptions-item" colspan="1" > - - Cloud Database - + + Cloud Database + + @@ -80,16 +88,20 @@ exports[`Descriptions Descriptions.Item support className 1`] = ` class="ant-descriptions-item my-class" colspan="1" > - - Product - - - Cloud Database - + + Product + + + Cloud Database + + @@ -114,46 +126,58 @@ exports[`Descriptions column is number 1`] = ` class="ant-descriptions-item" colspan="1" > - - Product - - - Cloud Database - + + Product + + + Cloud Database + + - - Billing - - - Prepaid - + + Billing + + + Prepaid + + - - time - - - 18:00:00 - + + time + + + 18:00:00 + + - - Amount - - - $80.00 - + + Amount + + + $80.00 + + @@ -197,16 +225,20 @@ exports[`Descriptions should work with React Fragment 1`] = ` class="ant-descriptions-item" colspan="1" > - - bamboo - - - bamboo - + + bamboo + + + bamboo + + - - bamboo - - - bamboo - + + bamboo + + + bamboo + + - - bamboo - - - bamboo - + + bamboo + + + bamboo + + @@ -269,11 +309,15 @@ exports[`Descriptions vertical layout 1`] = ` class="ant-descriptions-item" colspan="1" > - - Product - + + Product + + - - Cloud Database - + + Cloud Database + + - - Billing - + + Billing + + - - Prepaid - + + Prepaid + + - - time - + + time + + - - 18:00:00 - + + 18:00:00 + + - - Amount - + + Amount + + - - $80.00 - + + $80.00 + + @@ -396,16 +468,20 @@ exports[`Descriptions when item is rendered conditionally 1`] = ` class="ant-descriptions-item" colspan="1" > - - Product - - - Cloud Database - + + Product + + + Cloud Database + + - - Billing - - - Prepaid - + + Billing + + + Prepaid + + - - time - - - 18:00:00 - + + time + + + 18:00:00 + + - - Amount - - - $80.00 - + + Amount + + + $80.00 + + diff --git a/components/descriptions/demo/text.md b/components/descriptions/demo/text.md new file mode 100644 index 0000000000..7c4ce27de2 --- /dev/null +++ b/components/descriptions/demo/text.md @@ -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( + + Cloud Database + Prepaid + YES + 2018-04-24 18:00:00 + + 2019-04-24 18:00:00 + + + + + $80.00 + $20.00 + $60.00 + + Data disk type: MongoDB +
+ Database version: 3.4 +
+ Package: dds.mongo.mid +
+ Storage space: 10 GB +
+ Replication factor: 3 +
+ Region: East China 1
+ + $60.00 + + + + , + mountNode, +); +``` diff --git a/components/descriptions/style/index.less b/components/descriptions/style/index.less index 0350526c43..dd97415672 100644 --- a/components/descriptions/style/index.less +++ b/components/descriptions/style/index.less @@ -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 { diff --git a/components/page-header/__tests__/__snapshots__/demo.test.js.snap b/components/page-header/__tests__/__snapshots__/demo.test.js.snap index 51d6a70ca4..d592e12f46 100644 --- a/components/page-header/__tests__/__snapshots__/demo.test.js.snap +++ b/components/page-header/__tests__/__snapshots__/demo.test.js.snap @@ -103,48 +103,60 @@ Array [ class="ant-descriptions-item" colspan="1" > - - Created - - - Lili Qu - + + Created + + + Lili Qu + + - - Effective Time - - - 2017-10-10 - + + Effective Time + + + 2017-10-10 + + @@ -827,48 +847,60 @@ exports[`renders ./components/page-header/demo/ghost.md correctly 1`] = ` class="ant-descriptions-item" colspan="1" > - - Created - - - Lili Qu - + + Created + + + Lili Qu + + - - Effective Time - - - 2017-10-10 - + + Effective Time + + + 2017-10-10 + + @@ -1022,33 +1062,41 @@ exports[`renders ./components/page-header/demo/responsive.md correctly 1`] = ` class="ant-descriptions-item" colspan="1" > - - Created - - - Lili Qu - + + Created + + + Lili Qu + + - - Creation Time - - - 2017-01-10 - + + Creation Time + + + 2017-01-10 + + - - Remarks - - - Gonghu Road, Xihu District, Hangzhou, Zhejiang, China - + + Remarks + + + Gonghu Road, Xihu District, Hangzhou, Zhejiang, China + + diff --git a/components/table/__tests__/Table.pagination.test.js b/components/table/__tests__/Table.pagination.test.js index 21091d70d9..d281b90bde 100644 --- a/components/table/__tests__/Table.pagination.test.js +++ b/components/table/__tests__/Table.pagination.test.js @@ -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', () => { diff --git a/components/table/demo/custom-filter-panel.md b/components/table/demo/custom-filter-panel.md index 4c814d7c0c..98800c457b 100644 --- a/components/table/demo/custom-filter-panel.md +++ b/components/table/demo/custom-filter-panel.md @@ -82,7 +82,9 @@ class App extends React.Component { ), filterIcon: filtered => , 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()); diff --git a/docs/react/customize-theme.zh-CN.md b/docs/react/customize-theme.zh-CN.md index 57879a23ee..b19fc54b8f 100644 --- a/docs/react/customize-theme.zh-CN.md +++ b/docs/react/customize-theme.zh-CN.md @@ -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。 diff --git a/docs/react/faq.en-US.md b/docs/react/faq.en-US.md index 057d737d98..fdae924bf5 100644 --- a/docs/react/faq.en-US.md +++ b/docs/react/faq.en-US.md @@ -31,7 +31,7 @@ See: https://ant.design/docs/react/customize-theme . ### Will you provide other themes? -No, we follow Ant Design's design specification. +No, we follow Ant Design's design specification. Related issue: https://github.com/ant-design/ant-design/issues/1241 diff --git a/site/theme/en-US.js b/site/theme/en-US.js index de8b67de73..0f40b6b742 100644 --- a/site/theme/en-US.js +++ b/site/theme/en-US.js @@ -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', diff --git a/site/theme/template/Home/MorePage.tsx b/site/theme/template/Home/MorePage.tsx index ad4070d2cd..11aca6685d 100644 --- a/site/theme/template/Home/MorePage.tsx +++ b/site/theme/template/Home/MorePage.tsx @@ -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', diff --git a/site/theme/template/Home/RecommendPage.tsx b/site/theme/template/Home/RecommendPage.tsx index 1e715eee8e..c880d957f6 100644 --- a/site/theme/template/Home/RecommendPage.tsx +++ b/site/theme/template/Home/RecommendPage.tsx @@ -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', },
- - Association - - - - 421421 - - + + Association + + + + 421421 + + + - - Creation Time - - - 2017-01-10 - + + Creation Time + + + 2017-01-10 + +
- - Remarks - - - Gonghu Road, Xihu District, Hangzhou, Zhejiang, China - + + Remarks + + + Gonghu Road, Xihu District, Hangzhou, Zhejiang, China + +
- - Association - - - - 421421 - - + + Association + + + + 421421 + + + - - Creation Time - - - 2017-01-10 - + + Creation Time + + + 2017-01-10 + +
- - Remarks - - - Gonghu Road, Xihu District, Hangzhou, Zhejiang, China - + + Remarks + + + Gonghu Road, Xihu District, Hangzhou, Zhejiang, China + +
- - Association - - - - 421421 - - + + Association + + + + 421421 + + +
- - Effective Time - - - 2017-10-10 - + + Effective Time + + + 2017-10-10 + +