Update existing 3PID management UX

This tweaks the appearance of the existing 3PID management UX to use a different
style for the remove button. This styling will more closely match the soon to be
added 3PID discovery settings.

Part of https://github.com/vector-im/riot-web/issues/10159
This commit is contained in:
J. Ryan Stinnett 2019-08-05 16:34:04 +01:00
parent ab05d8c7a4
commit 11f2b4320d
4 changed files with 16 additions and 14 deletions

View file

@ -102,9 +102,10 @@ export class ExistingEmailAddress extends React.Component {
return (
<div className="mx_ExistingEmailAddress">
<img src={require("../../../../res/img/feather-customised/cancel.svg")} width={14} height={14}
onClick={this._onRemove} className="mx_ExistingEmailAddress_delete" alt={_t("Remove")} />
<span className="mx_ExistingEmailAddress_email">{this.props.email.address}</span>
<AccessibleButton onClick={this._onRemove} kind="danger_sm">
{_t("Remove")}
</AccessibleButton>
</div>
);
}

View file

@ -97,9 +97,10 @@ export class ExistingPhoneNumber extends React.Component {
return (
<div className="mx_ExistingPhoneNumber">
<img src={require("../../../../res/img/feather-customised/cancel.svg")} width={14} height={14}
onClick={this._onRemove} className="mx_ExistingPhoneNumber_delete" alt={_t("Remove")} />
<span className="mx_ExistingPhoneNumber_address">+{this.props.msisdn.address}</span>
<AccessibleButton onClick={this._onRemove} kind="danger_sm">
{_t("Remove")}
</AccessibleButton>
</div>
);
}