Turned the links to buttons to comply with MDN's recommendations

This commit is contained in:
Jani Mustonen 2017-01-06 16:41:35 +02:00
parent ad072cc179
commit 8d79716421
6 changed files with 19 additions and 19 deletions

View file

@ -663,9 +663,9 @@ module.exports = React.createClass({
<div className="mx_UserSettings_section"> <div className="mx_UserSettings_section">
<a tabindex="0" className="mx_UserSettings_logout mx_UserSettings_button" onClick={this.onLogoutClicked}> <button className="mx_UserSettings_logout mx_UserSettings_button" onClick={this.onLogoutClicked}>
Sign out Sign out
</a> </button>
{accountJsx} {accountJsx}
</div> </div>

View file

@ -409,9 +409,9 @@ module.exports = React.createClass({
<div className="mx_Dialog_title"> <div className="mx_Dialog_title">
{this.props.title} {this.props.title}
</div> </div>
<a tabindex="0" className="mx_ChatInviteDialog_cancel" onClick={this.onCancel} > <button className="mx_ChatInviteDialog_cancel" onClick={this.onCancel} >
<TintableSvg src="img/icons-close-button.svg" width="35" height="35" /> <TintableSvg src="img/icons-close-button.svg" width="35" height="35" />
</a> </button>
<div className="mx_ChatInviteDialog_label"> <div className="mx_ChatInviteDialog_label">
<label htmlFor="textinput">{ this.props.description }</label> <label htmlFor="textinput">{ this.props.description }</label>
</div> </div>

View file

@ -182,8 +182,8 @@ module.exports = React.createClass({
'm.room.name', user_id 'm.room.name', user_id
); );
save_button = <a tabindex="0" className="mx_RoomHeader_textButton" onClick={this.props.onSaveClick}>Save</a> save_button = <button className="mx_RoomHeader_textButton" onClick={this.props.onSaveClick}>Save</button>
cancel_button = <a tabindex="0" className="mx_RoomHeader_cancelButton" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </a> cancel_button = <button className="mx_RoomHeader_cancelButton" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </button>
} }
if (this.props.saving) { if (this.props.saving) {
@ -275,9 +275,9 @@ module.exports = React.createClass({
var settings_button; var settings_button;
if (this.props.onSettingsClick) { if (this.props.onSettingsClick) {
settings_button = settings_button =
<a tabindex="0" className="mx_RoomHeader_button" onClick={this.props.onSettingsClick} title="Settings"> <button className="mx_RoomHeader_button" onClick={this.props.onSettingsClick} title="Settings">
<TintableSvg src="img/icons-settings-room.svg" width="16" height="16"/> <TintableSvg src="img/icons-settings-room.svg" width="16" height="16"/>
</a>; </button>;
} }
// var leave_button; // var leave_button;
@ -291,17 +291,17 @@ module.exports = React.createClass({
var forget_button; var forget_button;
if (this.props.onForgetClick) { if (this.props.onForgetClick) {
forget_button = forget_button =
<a tabindex="0" className="mx_RoomHeader_button" onClick={this.props.onForgetClick} title="Forget room"> <button className="mx_RoomHeader_button" onClick={this.props.onForgetClick} title="Forget room">
<TintableSvg src="img/leave.svg" width="26" height="20"/> <TintableSvg src="img/leave.svg" width="26" height="20"/>
</a>; </button>;
} }
var rightPanel_buttons; var rightPanel_buttons;
if (this.props.collapsedRhs) { if (this.props.collapsedRhs) {
rightPanel_buttons = rightPanel_buttons =
<a tabindex="0" className="mx_RoomHeader_button" onClick={this.onShowRhsClick} title="<"> <button className="mx_RoomHeader_button" onClick={this.onShowRhsClick} title="<">
<TintableSvg src="img/minimise.svg" width="10" height="16"/> <TintableSvg src="img/minimise.svg" width="10" height="16"/>
</a> </button>
} }
var right_row; var right_row;
@ -310,9 +310,9 @@ module.exports = React.createClass({
<div className="mx_RoomHeader_rightRow"> <div className="mx_RoomHeader_rightRow">
{ settings_button } { settings_button }
{ forget_button } { forget_button }
<a tabindex="0" className="mx_RoomHeader_button" onClick={this.props.onSearchClick} title="Search"> <button className="mx_RoomHeader_button" onClick={this.props.onSearchClick} title="Search">
<TintableSvg src="img/icons-search.svg" width="35" height="35"/> <TintableSvg src="img/icons-search.svg" width="35" height="35"/>
</a> </button>
{ rightPanel_buttons } { rightPanel_buttons }
</div>; </div>;
} }

View file

@ -287,7 +287,7 @@ module.exports = React.createClass({
var connectDropTarget = this.props.connectDropTarget; var connectDropTarget = this.props.connectDropTarget;
let ret = ( let ret = (
<a tabindex="0" className={classes} onClick={this.onClick} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}> <button className={classes} onClick={this.onClick} onMouseEnter={this.onMouseEnter} onMouseLeave={this.onMouseLeave}>
<div className={avatarClasses}> <div className={avatarClasses}>
<div className="mx_RoomTile_avatar_menu" onClick={this.onAvatarClicked}> <div className="mx_RoomTile_avatar_menu" onClick={this.onAvatarClicked}>
<div className={avatarContainerClasses}> <div className={avatarContainerClasses}>
@ -302,7 +302,7 @@ module.exports = React.createClass({
</div> </div>
{/* { incomingCallBox } */} {/* { incomingCallBox } */}
{ tooltip } { tooltip }
</a> </button>
); );
if (connectDropTarget) ret = connectDropTarget(ret); if (connectDropTarget) ret = connectDropTarget(ret);

View file

@ -44,7 +44,7 @@ module.exports = React.createClass({
var cancelButton; var cancelButton;
if (this.props.onCancelClick) { if (this.props.onCancelClick) {
cancelButton = <a tabindex="0" className="mx_RoomHeader_cancelButton" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </a> cancelButton = <button className="mx_RoomHeader_cancelButton" onClick={this.props.onCancelClick}><img src="img/cancel.svg" width="18" height="18" alt="Cancel"/> </button>
} }
var showRhsButton; var showRhsButton;

View file

@ -136,9 +136,9 @@ module.exports = React.createClass({
<input id="password2" type="password" ref="confirm_input" /> <input id="password2" type="password" ref="confirm_input" />
</div> </div>
</div> </div>
<a tabindex="0" className={buttonClassName} onClick={this.onClickChange}> <button className={buttonClassName} onClick={this.onClickChange}>
Change Password Change Password
</a> </button>
</div> </div>
); );
case this.Phases.Uploading: case this.Phases.Uploading: