fix invite button layout

This commit is contained in:
Bruno Windels 2018-12-10 17:46:22 +01:00
parent ccf65d5f3c
commit 93767fa5f1
3 changed files with 33 additions and 25 deletions

View file

@ -20,10 +20,21 @@ limitations under the License.
flex: 1;
display: flex;
flex-direction: column;
}
.mx_MemberList .mx_Spinner {
flex: 1 0 auto;
.mx_Spinner {
flex: 1 0 auto;
}
h2 {
text-transform: uppercase;
color: $h3-color;
font-weight: 600;
font-size: 13px;
padding-left: 3px;
padding-right: 12px;
margin-top: 8px;
margin-bottom: 4px;
}
}
.mx_MemberList_chevron {
@ -45,23 +56,15 @@ limitations under the License.
flex: 1 1 0;
}
.mx_MemberList h2, .mx_GroupMemberList h2 {
text-transform: uppercase;
color: $h3-color;
font-weight: 600;
font-size: 13px;
padding-left: 3px;
padding-right: 12px;
margin-top: 8px;
margin-bottom: 4px;
}
.mx_MemberList_wrapper {
padding: 10px;
}
.mx_MemberList_invite {
.mx_MemberList_invite,
.mx_RightPanel_invite {
flex: 0 0 auto;
position: relative;
background-color: $button-bg-color;
@ -69,15 +72,20 @@ limitations under the License.
padding: 8px;
margin: 9px;
display: flex;
color: $button-fg-color;
font-weight: 600;
span {
margin: 0 auto;
background-image: url('../../img/icon-invite-people.svg');
background-repeat: no-repeat;
background-position: center left;
padding-left: 25px;
font-weight: 600;
color: $button-fg-color;
.mx_RightPanel_icon {
padding-right: 5px;
padding-top: 2px;
}
}
.mx_MemberList_invite span {
margin: 0 auto;
background-image: url('../../img/icon-invite-people.svg');
background-repeat: no-repeat;
background-position: center left;
padding-left: 25px;
}

View file

@ -177,7 +177,7 @@ export default React.createClass({
if (GroupStore.isUserPrivileged(this.props.groupId)) {
inviteButton = (<AccessibleButton className="mx_RightPanel_invite" onClick={this.onInviteToGroupButtonClick}>
<div className="mx_RightPanel_icon" >
<TintableSvg src="img/icon-invite-people.svg" width="35" height="35" />
<TintableSvg src="img/icon-invite-people.svg" width="18" height="14" />
</div>
<div className="mx_RightPanel_message">{ _t('Invite to this community') }</div>
</AccessibleButton>);

View file

@ -133,7 +133,7 @@ export default React.createClass({
if (GroupStore.isUserPrivileged(this.props.groupId)) {
inviteButton = (<AccessibleButton className="mx_RightPanel_invite" onClick={this.onAddRoomToGroupButtonClick}>
<div className="mx_RightPanel_icon" >
<TintableSvg src="img/icons-room-add.svg" width="35" height="35" />
<TintableSvg src="img/icons-room-add.svg" width="18" height="14" />
</div>
<div className="mx_RightPanel_message">{ _t('Add rooms to this community') }</div>
</AccessibleButton>);