haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-22 11:57:34 +00:00
Code Issues Releases Wiki Activity

[a11y] repo history: added support for 'keyboard access'

Browse Source
This commit is contained in:
llj
2021-09-26 17:28:36 +08:00
parent 5a4e32ae5a
commit bafd699fe4
1 changed files with 6 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/repo-history.js
View File

@@ -105,7 +105,7 @@ class RepoHistory extends React.Component {
<div className="row"> <div className="row">
<div className="col-md-10 offset-md-1"> <div className="col-md-10 offset-md-1">
<h2 dangerouslySetInnerHTML={{__html: Utils.generateDialogTitle(gettext('{placeholder} Modification History'), repoName)}}></h2> <h2 dangerouslySetInnerHTML={{__html: Utils.generateDialogTitle(gettext('{placeholder} Modification History'), repoName)}}></h2>
<a href="#" className="go-back" title={gettext('Back')} onClick={this.goBack}> <a href="#" className="go-back" title={gettext('Back')} onClick={this.goBack} role="button" aria-label={gettext('Back')}>
<span className="fas fa-chevron-left"></span> <span className="fas fa-chevron-left"></span>
</a> </a>
{userPerm == 'rw' && <p className="tip">{gettext('Tip: a snapshot will be generated after modification, which records the library state after the modification.')}</p>} {userPerm == 'rw' && <p className="tip">{gettext('Tip: a snapshot will be generated after modification, which records the library state after the modification.')}</p>}
@@ -234,7 +234,8 @@ class Item extends React.Component {
}); });
} }
editLabel = () => { editLabel = (e) => {
e.preventDefault();
this.setState({ this.setState({
isCommitLabelUpdateDialogOpen: !this.state.isCommitLabelUpdateDialogOpen isCommitLabelUpdateDialogOpen: !this.state.isCommitLabelUpdateDialogOpen
}); });
@@ -269,11 +270,11 @@ class Item extends React.Component {
return ( return (
<React.Fragment> <React.Fragment>
<tr onMouseOver={this.handleMouseOver} onMouseOut={this.handleMouseOut}> <tr onMouseOver={this.handleMouseOver} onMouseOut={this.handleMouseOut} onFocus={this.handleMouseOver}>
<td> <td>
{item.description} {item.description}
{item.showDetails && {item.showDetails &&
<a href="#" className="details" onClick={this.showCommitDetails}>{gettext('Details')}</a> <a href="#" className="details" onClick={this.showCommitDetails} role="button">{gettext('Details')}</a>
} }
</td> </td>
<td title={moment(item.time).format('LLLL')}>{moment(item.time).format('YYYY-MM-DD')}</td> <td title={moment(item.time).format('LLLL')}>{moment(item.time).format('YYYY-MM-DD')}</td>
@@ -287,7 +288,7 @@ class Item extends React.Component {
return <span key={index} className="commit-label">{item}</span>; return <span key={index} className="commit-label">{item}</span>;
})} })}
{userPerm == 'rw' && {userPerm == 'rw' &&
<span className={`attr-action-icon fa fa-pencil-alt ${isIconShown ? '': 'invisible'}`} title={gettext('Edit')} onClick={this.editLabel}></span> <a href="#" role="button" className={`attr-action-icon fa fa-pencil-alt ${isIconShown ? '': 'invisible'}`} title={gettext('Edit')} aria-label={gettext('Edit')} onClick={this.editLabel}></a>
} }
</td> </td>
} }