diff --git a/README-zh_CN.md b/README-zh_CN.md index 7d4feab3f3..d18beea6d1 100644 --- a/README-zh_CN.md +++ b/README-zh_CN.md @@ -61,7 +61,8 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less' - [React 代码规范](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-code-style.md) - [组件设计原则](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-design.md) - [网站和组件开发说明](https://github.com/ant-design/ant-design/wiki/%E7%BD%91%E7%AB%99%E5%92%8C%E7%BB%84%E4%BB%B6%E5%BC%80%E5%8F%91%E8%AF%B4%E6%98%8E) -- [版本发布手册](https://github.com/ant-design/ant-design/wiki/%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B) +- [版本发布手册](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B) + ## 如何贡献 diff --git a/README.md b/README.md index b801cb8cb6..d8c180ed3c 100644 --- a/README.md +++ b/README.md @@ -14,8 +14,8 @@ We are now working on translate components document to English, and we need some ## Features -- An enterprise-class design language and high quality UI style. -- Rich library of UI components base on [React Component](http://react-component.github.io/badgeboard/). +- An enterprise-class design language and high quality UI. +- Graceful UI components out of the box, base on [React Component](http://react-component.github.io/badgeboard/). - A npm + webpack + babel + dora [workflow](http://ant-tool.github.io/index.html). ## Install @@ -54,9 +54,9 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less' ```jsx // import js and css modularly, parsed by babel-plugin-antd - import { DatePicker } from 'antd'; + import { DatePicker } from 'antd'; ``` - + - Manually import ```jsx @@ -94,7 +94,7 @@ tsconfig.json - [React style guide](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-code-style.md) - [React component design guide](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-design.md) - [Developer Instruction](https://github.com/ant-design/ant-design/wiki/Development) -- [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B) +- [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B) - [FAQ](https://github.com/ant-design/ant-design/wiki/FAQ) - [CodePen boilerplate](http://codepen.io/anon/pen/wGOWGW?editors=001) for bug reports diff --git a/components/checkbox/style/mixin.less b/components/checkbox/style/mixin.less index 6b2602c248..532ec5b6d6 100644 --- a/components/checkbox/style/mixin.less +++ b/components/checkbox/style/mixin.less @@ -151,6 +151,11 @@ .@{checkbox-inner-prefix-cls}-input { cursor: default; } + + & + span { + color: #ccc; + cursor: @cursor-disabled; + } } .@{checkbox-prefix-cls}-wrapper { @@ -177,4 +182,22 @@ display: inline-block; } } + + @ie8: \0screen; + + // IE8 hack for https://github.com/ant-design/ant-design/issues/2148 + @media @ie8 { + .@{checkbox-prefix-cls}-checked .@{checkbox-prefix-cls}-inner:before, + .@{checkbox-prefix-cls}-checked .@{checkbox-prefix-cls}-inner:after { + font-family: 'anticon'; + content: '\E62E'; + font-weight: bold; + font-size: 8px; + border: 0; + color: #fff; + left: 2px; + top: 3px; + position: absolute; + } + } } diff --git a/components/date-picker/createPicker.tsx b/components/date-picker/createPicker.tsx index af61e01fb1..b4ca61c7e3 100644 --- a/components/date-picker/createPicker.tsx +++ b/components/date-picker/createPicker.tsx @@ -4,6 +4,7 @@ import RcDatePicker from 'rc-calendar/lib/Picker'; import GregorianCalendar from 'gregorian-calendar'; import classNames from 'classnames'; import assign from 'object-assign'; +import Icon from '../icon'; export default function createPicker(TheCalendar) { // use class typescript error @@ -23,7 +24,14 @@ export default function createPicker(TheCalendar) { } }, - handleChange(value) { + clearSelection = (e) => { + e.preventDefault(); + e.stopPropagation(); + this.setState({ value: null }); + this.handleChange(null); + }, + + handleChange = (value) => { const props = this.props; if (!('value' in props)) { this.setState({value}); @@ -71,6 +79,11 @@ export default function createPicker(TheCalendar) { pickerStyle.width = 180; } + const clearIcon = (!props.disabled && this.state.value) ? + : null; return ( - + {clearIcon} + ); } @@ -108,6 +122,6 @@ export default function createPicker(TheCalendar) { ); }, }); - + return CalenderWrapper; } diff --git a/components/date-picker/style/Calendar.less b/components/date-picker/style/Calendar.less index 78526cc48a..27fec19723 100644 --- a/components/date-picker/style/Calendar.less +++ b/components/date-picker/style/Calendar.less @@ -246,6 +246,7 @@ } .@{calendar-prefix-cls}-clear-btn { + display: none; position: absolute; right: 5px; text-indent: -76px; diff --git a/components/date-picker/style/Picker.less b/components/date-picker/style/Picker.less index 33c89ccc89..96a636ce00 100644 --- a/components/date-picker/style/Picker.less +++ b/components/date-picker/style/Picker.less @@ -37,7 +37,29 @@ > input { outline: none; } + &-clear { + opacity: 0; + position: absolute; + right: 8px; + z-index: 1; + background: #fff; + top: 50%; + font-size: 12px; + color: #ccc; + width: 14px; + height: 14px; + margin-top: -7px; + line-height: 14px; + cursor: pointer; + transition: color 0.3s ease, opacity 0.15s ease; + &:hover { + color: #999; + } + } + &:hover &-clear { + opacity: 1; + } &-icon { position: absolute; user-select: none; diff --git a/components/date-picker/style/RangePicker.less b/components/date-picker/style/RangePicker.less index 336081d6e4..3aabfaf01b 100644 --- a/components/date-picker/style/RangePicker.less +++ b/components/date-picker/style/RangePicker.less @@ -57,11 +57,19 @@ margin-left: -29px; } + .@{calendar-prefix-cls}-time-picker-wrap { + left: 115px; + } + &-right .@{calendar-prefix-cls}-time-picker-wrap { + left: 100px; + } + &.@{calendar-prefix-cls}-time &-right .@{calendar-prefix-cls}-date-input-wrap { margin-left: -15px; } .@{calendar-prefix-cls}-input-wrap { + position: relative; height: @input-box-height; } .@{calendar-prefix-cls}-input { diff --git a/components/date-picker/style/TimePicker.less b/components/date-picker/style/TimePicker.less index e3181bfa63..23f3b20a68 100644 --- a/components/date-picker/style/TimePicker.less +++ b/components/date-picker/style/TimePicker.less @@ -11,14 +11,17 @@ .@{calendar-prefix-cls}-clear-btn { direction: ltr; } + .@{calendar-prefix-cls}-time-picker-wrap { + position: absolute; + right: 0; + } } .@{calendar-prefix-cls}-input, .@{timepicker-prefix-cls}-input { - .input; - border-radius: @border-radius-sm; - height: @input-height-sm; - width: 96px; - margin-right: 6px; + // .input; + } + .@{timepicker-prefix-cls}-input { + display: none; } .@{calendar-prefix-cls}-input { padding-right: 21px; @@ -27,6 +30,9 @@ min-width: 168px; } .@{timepicker-prefix-cls}-icon { - display: none; + font-family: "anticon" !important; + position: relative; + content: "\E643"; + display: inline; } } diff --git a/components/form/index.md b/components/form/index.md index 332b6de6c1..eccc9dd4d9 100644 --- a/components/form/index.md +++ b/components/form/index.md @@ -76,9 +76,9 @@ CustomizedForm = Form.create({})(CustomizedForm); | resetFields | 重置一组输入控件的值与状态，如不传入参数，则重置所有组件 | Function([names: string[]]) | | getFieldProps | 用于和表单进行双向绑定，详见下方描述 | | -#### this.props.form.getFieldProps(id, options) +### this.props.form.getFieldProps(id, options) -##### 特别注意 +#### 特别注意 `getFieldProps` 调用不能位于纯函数组件中: https://github.com/facebook/react/pull/6534 @@ -86,6 +86,8 @@ CustomizedForm = Form.create({})(CustomizedForm); > 在表单中 `defaultValue` 也不应该被设置，请使用下面的 `initialValue`。 +#### getFieldProps options + | 参数 | 说明 | 类型 | 默认值 | |-----------|-----------------------------------------|-----|--------| | options.id | 必填输入控件唯一标志 | string | | diff --git a/components/pagination/style/index.less b/components/pagination/style/index.less index 788c43b1c2..c18401c820 100644 --- a/components/pagination/style/index.less +++ b/components/pagination/style/index.less @@ -127,6 +127,7 @@ &-prev, &-next { border: 1px solid @border-color-base; + background-color: #fff; a { color: #666; diff --git a/components/radio/style/index.less b/components/radio/style/index.less index d1d6533fe1..37475791ba 100644 --- a/components/radio/style/index.less +++ b/components/radio/style/index.less @@ -106,6 +106,11 @@ .@{radio-inner-prefix-cls}-input { cursor: default; } + + .@{radio-prefix-cls}-disabled + span { + color: #ccc; + cursor: @cursor-disabled; + } } span.@{radio-prefix-cls} + * { diff --git a/components/table/Table.tsx b/components/table/Table.tsx index 09b3d54e00..9f1d18c7b6 100644 --- a/components/table/Table.tsx +++ b/components/table/Table.tsx @@ -14,7 +14,9 @@ function noop() { import splitObject from '../_util/splitObject'; function stopPropagation(e) { e.stopPropagation(); - e.nativeEvent.stopImmediatePropagation(); + if (e.nativeEvent.stopImmediatePropagation) { + e.nativeEvent.stopImmediatePropagation(); + } } const defaultLocale = { diff --git a/docs/react/getting-started.md b/docs/react/getting-started.md index 6311c1d165..6b0cf2eeb1 100644 --- a/docs/react/getting-started.md +++ b/docs/react/getting-started.md @@ -30,6 +30,14 @@ $ npm install antd-init -g 更多功能请参考 [脚手架工具](https://github.com/ant-design/antd-init/) 和 [开发工具文档](http://ant-tool.github.io/)。 +> 除了官方提供的脚手架，您也可以使用社区提供的脚手架和范例： +> +> - [react-redux-antd](https://github.com/okoala/react-redux-antd) +> - [react-antd-admin](https://github.com/fireyy/react-antd-admin) +> - [react-antd-redux-router-starter](https://github.com/yuzhouisme/react-antd-redux-router-starter) +> - [react-redux-antd-starter](https://github.com/BetaRabbit/react-redux-antd-starter) +> - [更多](https://github.com/ant-design/ant-design/issues/129) + ### 2. 创建一个项目 使用命令行进行初始化。 diff --git a/docs/react/introduce.md b/docs/react/introduce.md index 8bb81c95e3..7c4d9b6442 100644 --- a/docs/react/introduce.md +++ b/docs/react/introduce.md @@ -74,6 +74,7 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less' - [React 代码规范](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-code-style.md) - [组件设计原则](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-design.md) - [设计规范速查手册](https://os.alipayobjects.com/rmsportal/HTXUgPGkyyxEivE.png) +- [社区贡献脚手架和范例](https://github.com/ant-design/ant-design/issues/129) ## 谁在使用 diff --git a/site/theme/static/common.less b/site/theme/static/common.less index 0456818126..d84d0b031f 100644 --- a/site/theme/static/common.less +++ b/site/theme/static/common.less @@ -92,7 +92,7 @@ div.main-container { display: block; width: 64px; margin: 0 auto 10px; - animation: loadTween 2S cubic-bezier(0.785, 0.135, 0.15, 0.86) infinite; + animation: loadTween 2s cubic-bezier(0.785, 0.135, 0.15, 0.86) infinite; } } #react-content:empty + .ant-site-loading { diff --git a/site/theme/static/template.html b/site/theme/static/template.html index 0b51bfacda..861d125114 100644 --- a/site/theme/static/template.html +++ b/site/theme/static/template.html @@ -13,7 +13,7 @@
-
+
A Design Language
diff --git a/site/theme/template/Layout/index.jsx b/site/theme/template/Layout/index.jsx index 6108c81a40..3f8af37899 100644 --- a/site/theme/template/Layout/index.jsx +++ b/site/theme/template/Layout/index.jsx @@ -55,6 +55,17 @@ export default class Layout extends React.Component { }); gaListenerSetted = true; } + const loadingNode = document.getElementById('ant-site-loading'); + if (!loadingNode) { + return; + } + this.timer = setTimeout(() => { + loadingNode.parentNode.removeChild(loadingNode); + }, 450); + } + + componentWillUnmount() { + clearTimeout(this.timer); } render() {