mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-10-26 04:35:55 +03:00
Code Issues Projects Releases Packages Wiki Activity

Fix up remove threepid confirmation UX

Browse source 
Probably still not the best design but hopefully break fewer UX rules:

1. Use red to confirm delete rather than cancel and green to cancel
2. Show the action you're about to perform in the confirmation
3. Label confirmation button with the action rather than yes/no.
This commit is contained in:
David Baker 2019-08-19 15:37:12 +01:00
parent f9e223aec7
commit 93af6cfd8d
3 changed files with 15 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/components/views/settings/account/EmailAddresses.js
View file

@ -87,15 +87,15 @@ export class ExistingEmailAddress extends React.Component {
return (
<div className="mx_ExistingEmailAddress">
<span className="mx_ExistingEmailAddress_promptText">
{_t("Are you sure?")}
{_t("Remove %(email)s?", {email: this.props.email.address} )}
</span>
<AccessibleButton onClick={this._onActuallyRemove} kind="primary_sm"
<AccessibleButton onClick={this._onActuallyRemove} kind="danger_sm"
className="mx_ExistingEmailAddress_confirmBtn">
{_t("Yes")}
{_t("Remove")}
</AccessibleButton>
<AccessibleButton onClick={this._onDontRemove} kind="danger_sm"
<AccessibleButton onClick={this._onDontRemove} kind="link_sm"
className="mx_ExistingEmailAddress_confirmBtn">
{_t("No")}
{_t("Cancel")}
</AccessibleButton>
</div>
);

10
src/components/views/settings/account/PhoneNumbers.js
View file

@ -82,15 +82,15 @@ export class ExistingPhoneNumber extends React.Component {
return (
<div className="mx_ExistingPhoneNumber">
<span className="mx_ExistingPhoneNumber_promptText">
{_t("Are you sure?")}
{_t("Remove %(phone)s?", {phone: this.props.msisdn.address})}
</span>
<AccessibleButton onClick={this._onActuallyRemove} kind="primary_sm"
<AccessibleButton onClick={this._onActuallyRemove} kind="danger_sm"
className="mx_ExistingPhoneNumber_confirmBtn">
{_t("Yes")}
{_t("Remove")}
</AccessibleButton>
<AccessibleButton onClick={this._onDontRemove} kind="danger_sm"
<AccessibleButton onClick={this._onDontRemove} kind="link_sm"
className="mx_ExistingPhoneNumber_confirmBtn">
{_t("No")}
{_t("Cancel")}
</AccessibleButton>
</div>
);

8
src/i18n/strings/en_EN.json
View file

@ -721,9 +721,7 @@
"Verification code": "Verification code",
"Discovery options will appear once you have added a phone number above.": "Discovery options will appear once you have added a phone number above.",
"Unable to remove contact information": "Unable to remove contact information",
"Are you sure?": "Are you sure?",
"Yes": "Yes",
"No": "No",
"Remove %(email)s?": "Remove %(email)s?",
"Remove": "Remove",
"Invalid Email Address": "Invalid Email Address",
"This doesn't appear to be a valid email address": "This doesn't appear to be a valid email address",
@ -731,6 +729,7 @@
"Add": "Add",
"We've sent you an email to verify your address. Please follow the instructions there and then click the button below.": "We've sent you an email to verify your address. Please follow the instructions there and then click the button below.",
"Email Address": "Email Address",
"Remove %(phone)s?": "Remove %(phone)s?",
"A text message has been sent to +%(msisdn)s. Please enter the verification code it contains.": "A text message has been sent to +%(msisdn)s. Please enter the verification code it contains.",
"Phone Number": "Phone Number",
"Cannot add any more widgets": "Cannot add any more widgets",
@ -777,6 +776,7 @@
"Failed to toggle moderator status": "Failed to toggle moderator status",
"Failed to change power level": "Failed to change power level",
"You will not be able to undo this change as you are promoting the user to have the same power level as yourself.": "You will not be able to undo this change as you are promoting the user to have the same power level as yourself.",
"Are you sure?": "Are you sure?",
"No devices with registered encryption keys": "No devices with registered encryption keys",
"Ignore": "Ignore",
"Jump to read receipt": "Jump to read receipt",
@ -1069,6 +1069,8 @@
"Verify...": "Verify...",
"Join": "Join",
"No results": "No results",
"Yes": "Yes",
"No": "No",
"Communities": "Communities",
"You cannot delete this image. (%(code)s)": "You cannot delete this image. (%(code)s)",
"Uploaded on %(date)s by %(user)s": "Uploaded on %(date)s by %(user)s",