Simplify nodes on ThirdPartyMemberInfo (#10889)
* Remove mx_MemberInfo_profileField * Merge mx_MemberInfo_profile with mx_MemberInfo_container * Remove redundant div elements * Update a Jest snapshot
This commit is contained in:
@@ -76,6 +76,12 @@ limitations under the License.
|
||||
|
||||
.mx_MemberInfo_container {
|
||||
margin: 0 16px 16px 16px;
|
||||
|
||||
&.mx_MemberInfo_container--profile {
|
||||
margin-bottom: 16px;
|
||||
font-size: $font-15px;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_MemberInfo_avatar {
|
||||
@@ -95,23 +101,11 @@ limitations under the License.
|
||||
}
|
||||
}
|
||||
|
||||
.mx_MemberInfo_profile {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.mx_MemberInfo_profileField {
|
||||
font-size: $font-15px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.mx_MemberInfo_buttons {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.mx_MemberInfo_field {
|
||||
cursor: pointer;
|
||||
font-size: $font-15px;
|
||||
color: $primary-content;
|
||||
margin-left: 8px;
|
||||
margin-bottom: 16px;
|
||||
line-height: $font-23px;
|
||||
}
|
||||
|
||||
@@ -127,11 +127,9 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
|
||||
adminTools = (
|
||||
<div className="mx_MemberInfo_container">
|
||||
<h3>{_t("Admin Tools")}</h3>
|
||||
<div className="mx_MemberInfo_buttons">
|
||||
<AccessibleButton className="mx_MemberInfo_field" onClick={this.onKickClick}>
|
||||
{_t("Revoke invite")}
|
||||
</AccessibleButton>
|
||||
</div>
|
||||
<AccessibleButton className="mx_MemberInfo_field" onClick={this.onKickClick}>
|
||||
{_t("Revoke invite")}
|
||||
</AccessibleButton>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -154,12 +152,8 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
|
||||
<AccessibleButton className="mx_MemberInfo_cancel" onClick={this.onCancel} title={_t("Close")} />
|
||||
<h2>{this.state.displayName}</h2>
|
||||
</div>
|
||||
<div className="mx_MemberInfo_container">
|
||||
<div className="mx_MemberInfo_profile">
|
||||
<div className="mx_MemberInfo_profileField">
|
||||
{_t("Invited by %(sender)s", { sender: this.state.senderName })}
|
||||
</div>
|
||||
</div>
|
||||
<div className="mx_MemberInfo_container mx_MemberInfo_container--profile">
|
||||
{_t("Invited by %(sender)s", { sender: this.state.senderName })}
|
||||
</div>
|
||||
{adminTools}
|
||||
</div>
|
||||
|
||||
@@ -20,17 +20,9 @@ exports[`<ThirdPartyMemberInfo /> should render invite 1`] = `
|
||||
</h2>
|
||||
</div>
|
||||
<div
|
||||
class="mx_MemberInfo_container"
|
||||
class="mx_MemberInfo_container mx_MemberInfo_container--profile"
|
||||
>
|
||||
<div
|
||||
class="mx_MemberInfo_profile"
|
||||
>
|
||||
<div
|
||||
class="mx_MemberInfo_profileField"
|
||||
>
|
||||
Invited by Alice DisplayName
|
||||
</div>
|
||||
</div>
|
||||
Invited by Alice DisplayName
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -56,17 +48,9 @@ exports[`<ThirdPartyMemberInfo /> should render invite when room in not availabl
|
||||
</h2>
|
||||
</div>
|
||||
<div
|
||||
class="mx_MemberInfo_container"
|
||||
class="mx_MemberInfo_container mx_MemberInfo_container--profile"
|
||||
>
|
||||
<div
|
||||
class="mx_MemberInfo_profile"
|
||||
>
|
||||
<div
|
||||
class="mx_MemberInfo_profileField"
|
||||
>
|
||||
Invited by Alice DisplayName
|
||||
</div>
|
||||
</div>
|
||||
Invited by Alice DisplayName
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user