Merge pull request #3283 from matrix-org/jryans/user-settings-toggle-3pid
Update existing 3PID management UX
This commit is contained in:
commit
ba3e9e3f84
4 changed files with 16 additions and 14 deletions
|
@ -15,6 +15,8 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
.mx_ExistingEmailAddress {
|
.mx_ExistingEmailAddress {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -24,14 +26,12 @@ limitations under the License.
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_ExistingEmailAddress_email {
|
.mx_ExistingEmailAddress_email,
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx_ExistingEmailAddress_promptText {
|
.mx_ExistingEmailAddress_promptText {
|
||||||
|
flex: 1;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_ExistingEmailAddress_confirmBtn {
|
.mx_ExistingEmailAddress_confirmBtn {
|
||||||
margin-right: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -15,6 +15,8 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
.mx_ExistingPhoneNumber {
|
.mx_ExistingPhoneNumber {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -24,16 +26,14 @@ limitations under the License.
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_ExistingPhoneNumber_address {
|
.mx_ExistingPhoneNumber_address,
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mx_ExistingPhoneNumber_promptText {
|
.mx_ExistingPhoneNumber_promptText {
|
||||||
|
flex: 1;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_ExistingPhoneNumber_confirmBtn {
|
.mx_ExistingPhoneNumber_confirmBtn {
|
||||||
margin-right: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_PhoneNumbers_input {
|
.mx_PhoneNumbers_input {
|
||||||
|
|
|
@ -102,9 +102,10 @@ export class ExistingEmailAddress extends React.Component {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="mx_ExistingEmailAddress">
|
<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>
|
<span className="mx_ExistingEmailAddress_email">{this.props.email.address}</span>
|
||||||
|
<AccessibleButton onClick={this._onRemove} kind="danger_sm">
|
||||||
|
{_t("Remove")}
|
||||||
|
</AccessibleButton>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -97,9 +97,10 @@ export class ExistingPhoneNumber extends React.Component {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="mx_ExistingPhoneNumber">
|
<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>
|
<span className="mx_ExistingPhoneNumber_address">+{this.props.msisdn.address}</span>
|
||||||
|
<AccessibleButton onClick={this._onRemove} kind="danger_sm">
|
||||||
|
{_t("Remove")}
|
||||||
|
</AccessibleButton>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue