Browse Source

feat: col-*-0 means `display: none`

pull/1263/head
Benjy Cui 9 years ago
parent
commit
f67548d60f
  1. 4
      components/layout/col.jsx
  2. 2
      components/layout/index.md
  3. 6
      style/mixins/grid.less

4
components/layout/col.jsx

@ -31,7 +31,7 @@ const Col = React.createClass({
}
sizeClassObj = {
...sizeClassObj,
[`col-${size}-${sizeProps.span}`]: sizeProps.span,
[`col-${size}-${sizeProps.span}`]: sizeProps.span !== undefined,
[`col-${size}-order-${sizeProps.order}`]: sizeProps.order,
[`col-${size}-offset-${sizeProps.offset}`]: sizeProps.offset,
[`col-${size}-push-${sizeProps.push}`]: sizeProps.push,
@ -39,7 +39,7 @@ const Col = React.createClass({
};
});
const classes = classNames({
[`col-${span}`]: span,
[`col-${span}`]: span !== undefined,
[`col-order-${order}`]: order,
[`col-offset-${offset}`]: offset,
[`col-push-${push}`]: push,

2
components/layout/index.md

@ -99,7 +99,7 @@ Ant Design 的布局组件若不能满足你的需求,你也可以直接使用
| 成员 | 说明 | 类型 | 默认值 |
|------------|-----------------|--------------------|-------------|
| span | 栅格占位格数 | number | 0 |
| span | 栅格占位格数,为 0 时相当于 `display: none` | number | 无 |
| order | 栅格顺序,`flex` 布局模式下有效 | number | 0 |
| offset | 栅格左侧的间隔格数,间隔内不可以有栅格 | number | 0 |
| push | 栅格向右移动格数 | number | 0 |

6
style/mixins/grid.less

@ -32,6 +32,7 @@
.loop-grid-columns(@index, @class) when (@index > 0) {
.col@{class}-@{index} {
display: block;
width: percentage((@index / @grid-columns));
}
.col@{class}-push-@{index} {
@ -49,7 +50,10 @@
.loop-grid-columns((@index - 1), @class);
}
.loop-grid-columns(@index) when (@index = 0) {
.loop-grid-columns(@index, @class) when (@index = 0) {
.col@{class}-@{index} {
display: none;
}
.col-push-@{index} {
left: auto;
}

Loading…
Cancel
Save