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 17 Packages Projects Releases Wiki Activity

change noHovering to true defaultly (#7178)

Browse Source
This commit is contained in:
偏右 2017-08-14 09:52:16 +08:00 committed by niko
parent 22ef7d1147
commit a59bcf7e90
9 changed files with 20 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/card/__tests__/__snapshots__/demo.test.js.snap
View File

@ -83,7 +83,7 @@ exports[`renders ./components/card/demo/border-less.md correctly 1`] = `
exports[`renders ./components/card/demo/grid-card.md correctly 1`] = `
<div
class="ant-card ant-card-bordered ant-card-no-hovering ant-card-contain-grid"
class="ant-card ant-card-bordered ant-card-contain-grid"
>
<div>
<div
@ -242,7 +242,7 @@ exports[`renders ./components/card/demo/in-column.md correctly 1`] = `
exports[`renders ./components/card/demo/inner.md correctly 1`] = `
<div
class="ant-card ant-card-bordered ant-card-no-hovering"
class="ant-card ant-card-bordered"
>
<div>
<div
@ -264,7 +264,7 @@ exports[`renders ./components/card/demo/inner.md correctly 1`] = `
Group title
</p>
<div
class="ant-card ant-card-bordered ant-card-no-hovering ant-card-type-inner"
class="ant-card ant-card-bordered ant-card-type-inner"
>
<div>
<div
@ -295,7 +295,7 @@ exports[`renders ./components/card/demo/inner.md correctly 1`] = `
</div>
</div>
<div
class="ant-card ant-card-bordered ant-card-no-hovering ant-card-type-inner"
class="ant-card ant-card-bordered ant-card-type-inner"
style="margin-top:16px;"
>
<div>
@ -409,7 +409,7 @@ exports[`renders ./components/card/demo/loading.md correctly 1`] = `
exports[`renders ./components/card/demo/meta.md correctly 1`] = `
<div
class="ant-card ant-card-bordered"
class="ant-card ant-card-bordered ant-card-hovering"
style="width:300px;"
>
<div>
@ -497,7 +497,7 @@ exports[`renders ./components/card/demo/meta.md correctly 1`] = `
exports[`renders ./components/card/demo/no-padding.md correctly 1`] = `
<div
class="ant-card ant-card-bordered"
class="ant-card ant-card-bordered ant-card-hovering"
style="width:240px;"
>
<div>

2
components/card/demo/grid-card.md
View File

@ -22,7 +22,7 @@ const gridStyle = {
};
ReactDOM.render(
<Card title="Card Title" noHovering>
<Card title="Card Title">
<Card.Grid style={gridStyle}>Content</Card.Grid>
<Card.Grid style={gridStyle}>Content</Card.Grid>
<Card.Grid style={gridStyle}>Content</Card.Grid>

2
components/card/demo/inner.md
View File

@ -17,7 +17,7 @@ It can be placed inside the ordinary card to display the information of the mult
import { Card } from 'antd';
ReactDOM.render(
<Card noHovering title="Card title">
<Card title="Card title">
<p
style={{
fontSize: 14,

1
components/card/demo/meta.md
View File

@ -22,6 +22,7 @@ ReactDOM.render(
style={{ width: 300 }}
cover={<img alt="example" src="https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png" />}
actions={[<Icon type="setting" />, <Icon type="edit" />, <Icon type="ellipsis" />]}
noHovering={false}
>
<Meta
avatar={<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />}

2
components/card/demo/no-padding.md
View File

@ -18,7 +18,7 @@ Customizing default width and margin.
import { Card } from 'antd';
ReactDOM.render(
<Card style={{ width: 240 }} bodyStyle={{ padding: 0 }}>
<Card style={{ width: 240 }} bodyStyle={{ padding: 0 }} noHovering={false}>
<div className="custom-image">
<img alt="example" width="100%" src="https://os.alipayobjects.com/rmsportal/QBnOOoLaAfKPirc.png" />
</div>

2
components/card/index.en-US.md
View File

@ -25,7 +25,7 @@ A card can be used to display content related to a single subject. The content c
| extra | Content to render in the top-right corner of the card | string\|ReactNode | - |
| bordered | Toggles rendering of the border around the card | boolean | true |
| bodyStyle | Inline style to apply to the card content | object | - |
| noHovering | Whether to be disable hovering when mouse over | boolean | false, and is set to true when [type='inner'] |
| noHovering | Don't lift up when hovering card | boolean | true |
| loading | Shows a loading indicator while the contents of the card are being fetched | boolean | false |
| type | Card style type, can be set to `inner` or not set | string | - |
| cover | Card cover | ReactNode | - |

4
components/card/index.tsx
View File

@ -101,14 +101,14 @@ export default class Card extends Component<CardProps> {
}
render() {
const {
prefixCls = 'ant-card', className, extra, bodyStyle, noHovering, title, loading,
prefixCls = 'ant-card', className, extra, bodyStyle, noHovering = true, title, loading,
bordered = true, type, cover, actions, tabList, children, ...others,
} = this.props;
const classString = classNames(prefixCls, className, {
[`${prefixCls}-loading`]: loading,
[`${prefixCls}-bordered`]: bordered,
[`${prefixCls}-no-hovering`]: noHovering || (type === 'inner' && noHovering === undefined),
[`${prefixCls}-hovering`]: !noHovering,
[`${prefixCls}-wider-padding`]: this.state.widerPadding,
[`${prefixCls}-padding-transition`]: this.updateWiderPaddingCalled,
[`${prefixCls}-contain-grid`]: this.isContainGrid(),

2
components/card/index.zh-CN.md
View File

@ -26,7 +26,7 @@ cols: 1
| extra | 卡片右上角的操作区域 | string\|ReactNode | - |
| bordered | 是否有边框 | boolean | true |
| bodyStyle | 内容区域自定义样式 | object | - |
| noHovering | 取消鼠标移过浮起 | boolean | false，[type='inner'] 时默认为 true |
| noHovering | 鼠标移过时不浮起，设为 `false` 可浮起 | boolean | true |
| loading | 当卡片内容还在加载中时，可以用 loading 展示一个占位 | boolean | false |
| type | 卡片类型，可设置为 `inner` 或 不设置 | string | - |
| cover | 卡片封面 | ReactNode | - |

9
components/card/style/index.less
View File

@ -12,9 +12,12 @@
position: relative;
transition: all .3s;
&:not(&-no-hovering):hover {
box-shadow: @box-shadow-base;
border-color: transparent;
&-hovering {
cursor: pointer;
&:hover {
box-shadow: @box-shadow-base;
border-color: transparent;
}
}
&-bordered {