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:
parent
7248878e7d
commit
0c30f0c838
3 changed files with 16 additions and 44 deletions
|
@ -76,6 +76,12 @@ limitations under the License.
|
||||||
|
|
||||||
.mx_MemberInfo_container {
|
.mx_MemberInfo_container {
|
||||||
margin: 0 16px 16px 16px;
|
margin: 0 16px 16px 16px;
|
||||||
|
|
||||||
|
&.mx_MemberInfo_container--profile {
|
||||||
|
margin-bottom: 16px;
|
||||||
|
font-size: $font-15px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.mx_MemberInfo_avatar {
|
.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 {
|
.mx_MemberInfo_field {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: $font-15px;
|
font-size: $font-15px;
|
||||||
color: $primary-content;
|
color: $primary-content;
|
||||||
margin-left: 8px;
|
margin-left: 8px;
|
||||||
|
margin-bottom: 16px;
|
||||||
line-height: $font-23px;
|
line-height: $font-23px;
|
||||||
}
|
}
|
||||||
|
|
|
@ -127,12 +127,10 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
|
||||||
adminTools = (
|
adminTools = (
|
||||||
<div className="mx_MemberInfo_container">
|
<div className="mx_MemberInfo_container">
|
||||||
<h3>{_t("Admin Tools")}</h3>
|
<h3>{_t("Admin Tools")}</h3>
|
||||||
<div className="mx_MemberInfo_buttons">
|
|
||||||
<AccessibleButton className="mx_MemberInfo_field" onClick={this.onKickClick}>
|
<AccessibleButton className="mx_MemberInfo_field" onClick={this.onKickClick}>
|
||||||
{_t("Revoke invite")}
|
{_t("Revoke invite")}
|
||||||
</AccessibleButton>
|
</AccessibleButton>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -154,13 +152,9 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
|
||||||
<AccessibleButton className="mx_MemberInfo_cancel" onClick={this.onCancel} title={_t("Close")} />
|
<AccessibleButton className="mx_MemberInfo_cancel" onClick={this.onCancel} title={_t("Close")} />
|
||||||
<h2>{this.state.displayName}</h2>
|
<h2>{this.state.displayName}</h2>
|
||||||
</div>
|
</div>
|
||||||
<div className="mx_MemberInfo_container">
|
<div className="mx_MemberInfo_container mx_MemberInfo_container--profile">
|
||||||
<div className="mx_MemberInfo_profile">
|
|
||||||
<div className="mx_MemberInfo_profileField">
|
|
||||||
{_t("Invited by %(sender)s", { sender: this.state.senderName })}
|
{_t("Invited by %(sender)s", { sender: this.state.senderName })}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{adminTools}
|
{adminTools}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
|
@ -20,19 +20,11 @@ exports[`<ThirdPartyMemberInfo /> should render invite 1`] = `
|
||||||
</h2>
|
</h2>
|
||||||
</div>
|
</div>
|
||||||
<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
|
Invited by Alice DisplayName
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
@ -56,18 +48,10 @@ exports[`<ThirdPartyMemberInfo /> should render invite when room in not availabl
|
||||||
</h2>
|
</h2>
|
||||||
</div>
|
</div>
|
||||||
<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
|
Invited by Alice DisplayName
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
|
|
Loading…
Reference in a new issue