mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 11:10:01 +08:00
Code Issues Actions 25 Packages Projects Releases Wiki Activity

fix: remove a tag in Alert component (#17872)

Browse Source 
* remove a tag in Alert component

* 添加 role 属性
This commit is contained in:
howard 2019-07-30 17:29:52 +08:00 committed by 偏右
parent 5a7a92af46
commit afaa01459f
3 changed files with 32 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
components/alert/__tests__/__snapshots__/demo.test.js.snap
View File

@ -66,8 +66,9 @@ exports[`renders ./components/alert/demo/banner.md correctly 1`] = `
<span
class="ant-alert-description"
/>
<a
<span
class="ant-alert-close-icon"
role="button"
>
<i
aria-label="icon: close"
@ -88,7 +89,7 @@ exports[`renders ./components/alert/demo/banner.md correctly 1`] = `
/>
</svg>
</i>
</a>
</span>
</div>
<br />
<div
@ -170,8 +171,9 @@ exports[`renders ./components/alert/demo/closable.md correctly 1`] = `
<span
class="ant-alert-description"
/>
<a
<span
class="ant-alert-close-icon"
role="button"
>
<i
aria-label="icon: close"
@ -192,7 +194,7 @@ exports[`renders ./components/alert/demo/closable.md correctly 1`] = `
/>
</svg>
</i>
</a>
</span>
</div>
<div
class="ant-alert ant-alert-error ant-alert-with-description ant-alert-no-icon ant-alert-closable"
@ -208,8 +210,9 @@ exports[`renders ./components/alert/demo/closable.md correctly 1`] = `
>
Error Description Error Description Error Description Error Description Error Description Error Description
</span>
<a
<span
class="ant-alert-close-icon"
role="button"
>
<i
aria-label="icon: close"
@ -230,7 +233,7 @@ exports[`renders ./components/alert/demo/closable.md correctly 1`] = `
/>
</svg>
</i>
</a>
</span>
</div>
</div>
`;
@ -248,11 +251,16 @@ exports[`renders ./components/alert/demo/close-text.md correctly 1`] = `
<span
class="ant-alert-description"
/>
<a
<span
class="ant-alert-close-icon"
role="button"
>
Close Now
</a>
<span
class="ant-alert-close-text"
>
Close Now
</span>
</span>
</div>
`;
@ -898,8 +906,9 @@ exports[`renders ./components/alert/demo/smooth-closed.md correctly 1`] = `
<span
class="ant-alert-description"
/>
<a
<span
class="ant-alert-close-icon"
role="button"
>
<i
aria-label="icon: close"
@ -920,7 +929,7 @@ exports[`renders ./components/alert/demo/smooth-closed.md correctly 1`] = `
/>
</svg>
</i>
</a>
</span>
</div>
<p>
placeholder text here

10
components/alert/index.tsx
View File

@ -134,9 +134,13 @@ export default class Alert extends React.Component<AlertProps, AlertState> {
);
const closeIcon = closable ? (
<a onClick={this.handleClose} className={`${prefixCls}-close-icon`}>
{closeText || <Icon type="close" />}
</a>
<span role="button" onClick={this.handleClose} className={`${prefixCls}-close-icon`}>
{closeText ? (
<span className={`${prefixCls}-close-text`}>{closeText}</span>
) : (
<Icon type="close" />
)}
</span>
) : null;
const dataOrAriaProps = getDataOrAriaProps(this.props);

7
components/alert/style/index.less
View File

@ -86,8 +86,11 @@
}
&-close-text {
position: absolute;
right: 16px;
color: @alert-close-color;
transition: color 0.3s;
&:hover {
color: @alert-close-hover-color;
}
}
&-with-description {