haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-09 19:01:42 +00:00
Code Issues Releases Wiki Activity

[a11y] dir view: enable 'keyboard access' for 'Tags'

Browse Source
This commit is contained in:
llj
2021-09-26 15:50:28 +08:00
parent c3273ddc52
commit f7e5fe2024
2 changed files with 10 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
frontend/src/components/cur-dir-path/dir-tool.js
View File

@@ -32,7 +32,8 @@ class DirTool extends React.Component {
}; };
} }
onShowListRepoTag = () => { onShowListRepoTag = (e) => {
e.preventDefault();
this.setState({ this.setState({
isRepoTagDialogShow: true, isRepoTagDialogShow: true,
isListRepoTagShow: true, isListRepoTagShow: true,
@@ -99,7 +100,7 @@ class DirTool extends React.Component {
return ( return (
<Fragment> <Fragment>
<ul className="path-toolbar"> <ul className="path-toolbar">
<li className="toolbar-item"><a className="op-link sf2-icon-tag" onClick={this.onShowListRepoTag} title={gettext('Tags')} aria-label={gettext('Tags')}></a></li> <li className="toolbar-item"><a className="op-link sf2-icon-tag" href="#" role="button" onClick={this.onShowListRepoTag} title={gettext('Tags')} aria-label={gettext('Tags')}></a></li>
<li className="toolbar-item"><a className="op-link sf2-icon-recycle" href={trashUrl} title={gettext('Trash')} aria-label={gettext('Trash')}></a></li> <li className="toolbar-item"><a className="op-link sf2-icon-recycle" href={trashUrl} title={gettext('Trash')} aria-label={gettext('Trash')}></a></li>
<li className="toolbar-item"><a className="op-link sf2-icon-history" href={historyUrl} title={gettext('History')} aria-label={gettext('History')}></a></li> <li className="toolbar-item"><a className="op-link sf2-icon-history" href={historyUrl} title={gettext('History')} aria-label={gettext('History')}></a></li>
</ul> </ul>

8
frontend/src/components/toolbar/repo-view-toobar.js
View File

@@ -36,6 +36,12 @@ class RepoViewToolbar extends React.Component {
this.setState({ isOpen: !this.state.isOpen }); this.setState({ isOpen: !this.state.isOpen });
} }
onDropdownToggleKeyDown = (e) => {
if (e.key == 'Enter' || e.key == 'Space') {
this.toggleMore();
}
}
visitDeletedviaKey = (e) => { visitDeletedviaKey = (e) => {
if (e.key == 'Enter' || e.key == 'Space') { if (e.key == 'Enter' || e.key == 'Space') {
navigate(`${siteRoot}my-libs/deleted/`); navigate(`${siteRoot}my-libs/deleted/`);
@@ -53,7 +59,7 @@ class RepoViewToolbar extends React.Component {
<i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('New Library')} <i className="fas fa-plus-square text-secondary mr-1"></i>{gettext('New Library')}
</button> </button>
<Dropdown isOpen={this.state.isOpen} toggle={this.toggleMore}> <Dropdown isOpen={this.state.isOpen} toggle={this.toggleMore}>
<DropdownToggle className='btn btn-secondary operation-item'> <DropdownToggle className='btn btn-secondary operation-item' onKeyDown={this.onDropdownToggleKeyDown}>
{gettext('More')} {gettext('More')}
</DropdownToggle> </DropdownToggle>
<DropdownMenu> <DropdownMenu>