mirror of https://github.com/vector-im/riot-web
Don't intercept TAB on the app outside of the composer, fix tabIndex > 0
Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>pull/21833/head
parent
7160922b77
commit
5643743167
|
@ -119,7 +119,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
|
|||
// accessible (focusable) components. Not intended for buttons, but
|
||||
// should be used on things like focusable containers where the outline
|
||||
// is usually not helping anyone.
|
||||
.mx_HiddenFocusable {
|
||||
*:focus:not(.focus-visible) {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
|
|
|
@ -18,10 +18,6 @@ limitations under the License.
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton:focus:not(.focus-visible) {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.mx_AccessibleButton_disabled {
|
||||
cursor: default;
|
||||
}
|
||||
|
|
|
@ -176,7 +176,6 @@ export default class ContextualMenu extends React.Component {
|
|||
|
||||
const menuClasses = classNames({
|
||||
'mx_ContextualMenu': true,
|
||||
'mx_HiddenFocusable': true, // hide browser outline
|
||||
'mx_ContextualMenu_left': !hasChevron && position.left,
|
||||
'mx_ContextualMenu_right': !hasChevron && position.right,
|
||||
'mx_ContextualMenu_top': !hasChevron && position.top,
|
||||
|
|
|
@ -1223,7 +1223,7 @@ export default createReactClass({
|
|||
blurToCancel={false}
|
||||
initialValue={this.state.profileForm.name}
|
||||
onValueChanged={this._onNameChange}
|
||||
tabIndex="1"
|
||||
tabIndex="0"
|
||||
dir="auto" />;
|
||||
|
||||
shortDescNode = <EditableText ref="descriptionEditor"
|
||||
|
@ -1233,7 +1233,7 @@ export default createReactClass({
|
|||
blurToCancel={false}
|
||||
initialValue={this.state.profileForm.short_description}
|
||||
onValueChanged={this._onShortDescChange}
|
||||
tabIndex="2"
|
||||
tabIndex="0"
|
||||
dir="auto" />;
|
||||
} else {
|
||||
const onGroupHeaderItemClick = this.state.isUserMember ? this._onEditClick : null;
|
||||
|
|
|
@ -408,7 +408,7 @@ const LoggedInView = createReactClass({
|
|||
return;
|
||||
}
|
||||
|
||||
if (!isClickShortcut && !canElementReceiveInput(ev.target)) {
|
||||
if (!isClickShortcut && ev.key !== Key.TAB && !canElementReceiveInput(ev.target)) {
|
||||
// synchronous dispatch so we focus before key generates input
|
||||
dis.dispatch({action: 'focus_composer'}, true);
|
||||
ev.stopPropagation();
|
||||
|
|
|
@ -108,7 +108,7 @@ export class TopLeftMenu extends React.Component {
|
|||
</AccessibleButton>
|
||||
);
|
||||
|
||||
return <div className="mx_TopLeftMenu mx_HiddenFocusable" tabIndex={0} ref={this.props.containerRef}>
|
||||
return <div className="mx_TopLeftMenu" ref={this.props.containerRef}>
|
||||
<div className="mx_TopLeftMenu_section_noIcon" aria-readonly={true}>
|
||||
<div>{this.props.displayName}</div>
|
||||
<div className="mx_TopLeftMenu_greyedText" aria-hidden={true}>{this.props.userId}</div>
|
||||
|
|
|
@ -553,7 +553,7 @@ export default class BasicMessageEditor extends React.Component {
|
|||
<div
|
||||
className="mx_BasicMessageComposer_input"
|
||||
contentEditable="true"
|
||||
tabIndex="1"
|
||||
tabIndex="0"
|
||||
onBlur={this._onBlur}
|
||||
onFocus={this._onFocus}
|
||||
onPaste={this._onPaste}
|
||||
|
|
Loading…
Reference in New Issue