mirror of
https://github.com/ant-design/ant-design.git
synced 2025-01-18 14:13:37 +08:00
Merge 1.x-stable
This commit is contained in:
commit
0eeca99f02
@ -1,13 +1,13 @@
|
||||
---
|
||||
order: 1
|
||||
title:
|
||||
title:
|
||||
zh-CN: 自定义样式
|
||||
en-US: Custom style
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
可以自定义置顶按钮的样式,限制宽高:`40px * 40px`。
|
||||
可以自定义回到顶部按钮的样式,限制宽高:`40px * 40px`。
|
||||
|
||||
## en-US
|
||||
|
||||
|
@ -1,11 +1,11 @@
|
||||
---
|
||||
category: Components
|
||||
type: Other
|
||||
chinese: 置顶
|
||||
chinese: 回到顶部
|
||||
english: BackTop
|
||||
---
|
||||
|
||||
使用置顶组件可以方便地回到页面顶部。
|
||||
返回页面顶部的操作按钮。
|
||||
|
||||
## 何时使用
|
||||
|
||||
|
@ -8,7 +8,7 @@
|
||||
|
||||
a {
|
||||
color: @text-color;
|
||||
transition: all .3s;
|
||||
transition: color .3s;
|
||||
&:hover {
|
||||
color: tint(@primary-color, 20%);
|
||||
}
|
||||
|
@ -163,8 +163,7 @@
|
||||
&-expand {
|
||||
position: relative;
|
||||
&:after {
|
||||
content: '\e600';
|
||||
font-family: 'anticon';
|
||||
.iconfont-font("\e600");
|
||||
.iconfont-size-under-12px(8px);
|
||||
color: #999;
|
||||
position: absolute;
|
||||
|
@ -190,8 +190,7 @@
|
||||
@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';
|
||||
.iconfont-font("\e62e");
|
||||
font-weight: bold;
|
||||
font-size: 8px;
|
||||
border: 0;
|
||||
|
@ -264,11 +264,7 @@
|
||||
}
|
||||
|
||||
.@{calendar-prefix-cls}-clear-btn:after {
|
||||
content: "\e631";
|
||||
font-family: "anticon";
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
.iconfont-font("\e631");
|
||||
font-size: 12px;
|
||||
color: #ccc;
|
||||
display: inline-block;
|
||||
|
@ -274,15 +274,12 @@ form {
|
||||
top: 0;
|
||||
right: 0;
|
||||
visibility: visible;
|
||||
font-family: "anticon" !important;
|
||||
.square(@input-height-lg);
|
||||
line-height: @input-height-lg;
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
animation: zoomIn .3s @ease-out-back;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
.iconfont-font("");
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -3,6 +3,7 @@ category: Components
|
||||
chinese: 图标
|
||||
type: Basic
|
||||
english: Icon
|
||||
toc: false
|
||||
---
|
||||
|
||||
有含义的矢量图形,每一个图标打倒一个敌人。
|
||||
|
@ -38,4 +38,9 @@
|
||||
&:hover .ant-search-btn-noempty {
|
||||
.btn-primary;
|
||||
}
|
||||
.ant-select-combobox {
|
||||
.ant-select-selection__rendered {
|
||||
right: 29px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -27,11 +27,7 @@
|
||||
transition: color 0.3s ease, opacity 0.15s ease;
|
||||
&:before {
|
||||
display: block;
|
||||
font-family: "anticon" !important;
|
||||
content: "\E631";
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
.iconfont-font("\e631");
|
||||
}
|
||||
&:hover {
|
||||
color: #999;
|
||||
@ -213,11 +209,16 @@
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 9px;
|
||||
right: 9px;
|
||||
color: #ccc;
|
||||
line-height: 20px;
|
||||
height: 20px;
|
||||
max-width: 100%;
|
||||
margin-top: -10px;
|
||||
cursor: text;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&-search--inline {
|
||||
@ -356,8 +357,11 @@
|
||||
box-shadow: none;
|
||||
}
|
||||
.@{select-prefix-cls}-selection__rendered {
|
||||
padding: 0;
|
||||
padding: 0 24px 0 0;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -472,8 +476,7 @@
|
||||
&&--multiple {
|
||||
.@{select-prefix-cls}-dropdown-menu-item {
|
||||
&:after {
|
||||
content: '\e62e';
|
||||
font-family: 'anticon';
|
||||
.iconfont-font("\e62e");
|
||||
color: transparent;
|
||||
.iconfont-size-under-12px(10px);
|
||||
transition: all 0.2s ease;
|
||||
|
@ -53,12 +53,13 @@ export default class Spin extends React.Component {
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps) {
|
||||
const currentSpinning = this.getSpinning(this.props);
|
||||
const spinning = this.getSpinning(nextProps);
|
||||
if (this.debounceTimeout) {
|
||||
clearTimeout(this.debounceTimeout);
|
||||
}
|
||||
if (spinning) {
|
||||
this.debounceTimeout = setTimeout(() => this.setState({ spinning }), 250);
|
||||
if (currentSpinning && !spinning) {
|
||||
this.debounceTimeout = setTimeout(() => this.setState({ spinning }), 500);
|
||||
} else {
|
||||
this.setState({ spinning });
|
||||
}
|
||||
|
@ -27,20 +27,6 @@
|
||||
.ie-rotate-via-degrees(@degrees);
|
||||
}
|
||||
|
||||
// for iconfont font size
|
||||
// fix chrome 12px bug, support ie
|
||||
.iconfont-size-under-12px(@size, @rotate: 0deg) {
|
||||
display: inline-block;
|
||||
@font-scale: unit(@size/@font-size-base);
|
||||
font-size: @font-size-base;
|
||||
font-size: ~"@{size} \9"; // ie8-9
|
||||
transform: scale(@font-scale) rotate(@rotate);
|
||||
.ie-rotate-via-degrees(@rotate);
|
||||
:root & {
|
||||
font-size: @font-size-base; // reset ie9 and above
|
||||
}
|
||||
}
|
||||
|
||||
// Placeholder text
|
||||
.placeholder(@color: @input-placeholder-color) {
|
||||
// Firefox
|
||||
|
@ -14,3 +14,25 @@
|
||||
font-family: "anticon" !important;
|
||||
}
|
||||
}
|
||||
|
||||
.iconfont-font(@content) {
|
||||
font-family: 'anticon';
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
content: @content;
|
||||
}
|
||||
|
||||
// for iconfont font size
|
||||
// fix chrome 12px bug, support ie
|
||||
.iconfont-size-under-12px(@size, @rotate: 0deg) {
|
||||
display: inline-block;
|
||||
@font-scale: unit(@size / @font-size-base);
|
||||
font-size: @font-size-base;
|
||||
font-size: ~"@{size} \9"; // ie8-9
|
||||
transform: scale(@font-scale) rotate(@rotate);
|
||||
.ie-rotate-via-degrees(@rotate);
|
||||
:root & {
|
||||
font-size: @font-size-base; // reset ie9 and above
|
||||
}
|
||||
}
|
||||
|
@ -58,6 +58,7 @@ export default class Table extends React.Component {
|
||||
indentSize: 20,
|
||||
onChange: noop,
|
||||
locale: {},
|
||||
rowKey: 'key',
|
||||
};
|
||||
|
||||
static contextTypes = {
|
||||
@ -474,10 +475,11 @@ export default class Table extends React.Component {
|
||||
}
|
||||
|
||||
getRecordKey(record, index) {
|
||||
if (this.props.rowKey) {
|
||||
return this.props.rowKey(record, index);
|
||||
const { rowKey } = this.props;
|
||||
if (typeof rowKey === 'function') {
|
||||
return rowKey(record, index);
|
||||
}
|
||||
return record.key || index;
|
||||
return record[rowKey] || index;
|
||||
}
|
||||
|
||||
renderRowSelection() {
|
||||
@ -702,7 +704,7 @@ export default class Table extends React.Component {
|
||||
// 优化本地排序
|
||||
data = data.slice(0);
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
data[i].indexForSort = i;
|
||||
data[i] = assign({}, data[i], { indexForSort: i });
|
||||
}
|
||||
const sorterFn = this.getSorterFn();
|
||||
if (sorterFn) {
|
||||
|
@ -61,17 +61,13 @@
|
||||
}
|
||||
|
||||
&-clear-btn:after {
|
||||
content: "\e631";
|
||||
font-family: "anticon";
|
||||
font-size: 12px;
|
||||
color: #ccc;
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
width: 20px;
|
||||
transition: color 0.3s ease;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
.iconfont-font("\e631");
|
||||
}
|
||||
|
||||
&-clear-btn:hover:after {
|
||||
|
@ -40,7 +40,10 @@ export default class TimelineItem extends React.Component<TimeLineItemProps, any
|
||||
return (
|
||||
<li {...restProps} className={itemClassName}>
|
||||
<div className={`${prefixCls}-item-tail`} />
|
||||
<div className={dotClassName} style={{ color: /blue|red|green/.test(color) ? null : color }}>
|
||||
<div
|
||||
className={dotClassName}
|
||||
style={{ borderColor: /blue|red|green/.test(color) ? null : color }}
|
||||
>
|
||||
{dot}
|
||||
</div>
|
||||
<div className={`${prefixCls}-item-content`}>
|
||||
|
@ -42,6 +42,7 @@ english: TreeSelect
|
||||
| treeData | treeNodes数据,如果设置则不需要手动构造TreeNode节点(value在整个树范围内唯一)| array<{value, label, children, [disabled,selectable]}> | [] |
|
||||
|treeDataSimpleMode | 使用简单格式的treeData,具体设置参考可设置的类型 (此时treeData应变为这样的数据结构: [{"id":1, "pId":0, "label":"test1"},...], `pId`是父节点的id) | bool/object{id:'id', pId:'pId', rootPId:null} | false |
|
||||
| loadData | 异步加载数据 | function(node) | - |
|
||||
| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。[示例](http://codepen.io/anon/pen/xVBOVQ?editors=001) | Function(triggerNode) | () => document.body |
|
||||
|
||||
### TreeNode props
|
||||
> 建议使用 treeData 来代替 TreeNode,免去手工构造麻烦
|
||||
|
@ -61,9 +61,8 @@
|
||||
}
|
||||
&.@{select-tree-prefix-cls}-icon_loading {
|
||||
&:after {
|
||||
content: '\e6a1';
|
||||
display: inline-block;
|
||||
font-family: 'anticon';
|
||||
.iconfont-font("\e6a1");
|
||||
font-weight: bold;
|
||||
animation: loadingCircle 1s infinite linear;
|
||||
margin-top: 8px;
|
||||
|
@ -88,9 +88,8 @@
|
||||
}
|
||||
&.@{tree-prefix-cls}-icon_loading {
|
||||
&:after {
|
||||
content: '\e6a1';
|
||||
display: inline-block;
|
||||
font-family: 'anticon';
|
||||
.iconfont-font("\e6a1");
|
||||
animation: loadingCircle 1s infinite linear;
|
||||
color: @primary-color;
|
||||
}
|
||||
|
@ -4,9 +4,8 @@
|
||||
position: relative;
|
||||
&:after {
|
||||
.iconfont-size-under-12px(6px);
|
||||
content: '\e611';
|
||||
display: inline-block;
|
||||
font-family: 'anticon';
|
||||
.iconfont-font("\e611");
|
||||
font-weight: bold;
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
|
@ -66,7 +66,7 @@
|
||||
"rc-time-picker": "~1.1.6",
|
||||
"rc-tooltip": "~3.4.2",
|
||||
"rc-tree": "~1.3.6",
|
||||
"rc-tree-select": "~1.7.9",
|
||||
"rc-tree-select": "~1.8.0",
|
||||
"rc-upload": "~1.13.3",
|
||||
"rc-util": "~3.3.0",
|
||||
"react-addons-pure-render-mixin": "^15.0.0",
|
||||
|
@ -90,22 +90,22 @@
|
||||
|
||||
.component-select {
|
||||
&.ant-select-dropdown {
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
box-shadow: 0 0 8px rgba(0,0,0,0.25);
|
||||
font-size: 14px;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
box-shadow: 0 0 8px rgba(0,0,0,0.25);
|
||||
font-size: 14px;
|
||||
}
|
||||
.ant-select-dropdown-menu {
|
||||
max-height: 200px;
|
||||
max-height: 200px;
|
||||
}
|
||||
.ant-select-dropdown-menu-item {
|
||||
border-radius: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
.ant-component-decs {
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
color: #aaa;
|
||||
right: 16px;
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
top: 9px;
|
||||
color: #aaa;
|
||||
right: 16px;
|
||||
}
|
||||
}
|
||||
|
@ -23,7 +23,7 @@
|
||||
|
||||
.subtitle {
|
||||
font-weight: normal;
|
||||
font-size: 80%;
|
||||
font-size: 90%;
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
|
@ -81,7 +81,13 @@ export default class ComponentDoc extends React.Component {
|
||||
</ul>
|
||||
</Affix>
|
||||
<section className="markdown">
|
||||
<h1>{meta.title || meta.english} {meta.subtitle || meta.chinese}</h1>
|
||||
<h1>
|
||||
{title || english}
|
||||
{
|
||||
(!subtitle && !chinese) ? null :
|
||||
<span className="subtitle">{subtitle || chinese}</span>
|
||||
}
|
||||
</h1>
|
||||
{
|
||||
props.utils.toReactComponent(
|
||||
['section', { className: 'markdown' }]
|
||||
|
@ -6,6 +6,7 @@ import ComponentDoc from './ComponentDoc';
|
||||
import * as utils from '../utils';
|
||||
import config from '../../';
|
||||
const SubMenu = Menu.SubMenu;
|
||||
let firstMounted = false;
|
||||
|
||||
export default class MainContent extends React.Component {
|
||||
static contextTypes = {
|
||||
@ -16,11 +17,12 @@ export default class MainContent extends React.Component {
|
||||
if (!location.hash) {
|
||||
document.body.scrollTop = 0;
|
||||
document.documentElement.scrollTop = 0;
|
||||
} else {
|
||||
} else if (!firstMounted) {
|
||||
this.timer = setTimeout(() => {
|
||||
document.getElementById(location.hash.replace('#', '')).scrollIntoView();
|
||||
document.getElementById(decodeURI(location.hash.replace('#', ''))).scrollIntoView();
|
||||
}, 10);
|
||||
}
|
||||
firstMounted = true;
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
|
Loading…
Reference in New Issue
Block a user