Swap classes instead of using 0 height elements

pull/21833/head
David Baker 2017-07-21 14:13:57 +01:00
parent 3c44af11f7
commit 4eda2ab083
1 changed files with 7 additions and 5 deletions

View File

@ -23,6 +23,7 @@ import { sanitizedHtmlNode } from '../../HtmlUtils';
import { _t } from '../../languageHandler'; import { _t } from '../../languageHandler';
import AccessibleButton from '../views/elements/AccessibleButton'; import AccessibleButton from '../views/elements/AccessibleButton';
import Modal from '../../Modal'; import Modal from '../../Modal';
import classnames from 'classnames';
const RoomSummaryType = PropTypes.shape({ const RoomSummaryType = PropTypes.shape({
room_id: PropTypes.string.isRequired, room_id: PropTypes.string.isRequired,
@ -385,8 +386,10 @@ export default React.createClass({
let nameNode; let nameNode;
let shortDescNode; let shortDescNode;
let rightButtons; let rightButtons;
let headerBottom;
let roomBody; let roomBody;
let headerClasses = {
mx_GroupView_header: true,
};
if (this.state.editing) { if (this.state.editing) {
let avatarImage; let avatarImage;
if (this.state.uploadingAvatar) { if (this.state.uploadingAvatar) {
@ -435,7 +438,6 @@ export default React.createClass({
width="18" height="18" alt={_t("Cancel")}/> width="18" height="18" alt={_t("Cancel")}/>
</AccessibleButton> </AccessibleButton>
</span>; </span>;
headerBottom = <div className="mx_GroupView_header_editBottom" />;
roomBody = <div> roomBody = <div>
<textarea className="mx_GroupView_editLongDesc" value={this.state.profileForm.long_description} <textarea className="mx_GroupView_editLongDesc" value={this.state.profileForm.long_description}
onChange={this._onLongDescChange} onChange={this._onLongDescChange}
@ -465,7 +467,6 @@ export default React.createClass({
if (summary.profile && summary.profile.long_description) { if (summary.profile && summary.profile.long_description) {
description = sanitizedHtmlNode(summary.profile.long_description); description = sanitizedHtmlNode(summary.profile.long_description);
} }
headerBottom = <div className="mx_GroupView_header_viewBottom" />;
roomBody = <div> roomBody = <div>
<div className="mx_GroupView_groupDesc">{description}</div> <div className="mx_GroupView_groupDesc">{description}</div>
{this._getFeaturedRoomsNode()} {this._getFeaturedRoomsNode()}
@ -475,11 +476,13 @@ export default React.createClass({
rightButtons = <AccessibleButton className="mx_GroupHeader_button" onClick={this._onEditClick} title={_t("Edit Group")}> rightButtons = <AccessibleButton className="mx_GroupHeader_button" onClick={this._onEditClick} title={_t("Edit Group")}>
<TintableSvg src="img/icons-settings-room.svg" width="16" height="16"/> <TintableSvg src="img/icons-settings-room.svg" width="16" height="16"/>
</AccessibleButton>; </AccessibleButton>;
headerClasses.mx_GroupView_header_view = true;
} }
return ( return (
<div className="mx_GroupView"> <div className="mx_GroupView">
<div className="mx_GroupView_header"> <div className={classnames(headerClasses)}>
<div className="mx_GroupView_header_leftCol"> <div className="mx_GroupView_header_leftCol">
<div className="mx_GroupView_header_avatar"> <div className="mx_GroupView_header_avatar">
{avatarNode} {avatarNode}
@ -497,7 +500,6 @@ export default React.createClass({
{rightButtons} {rightButtons}
</div> </div>
</div> </div>
{headerBottom}
{roomBody} {roomBody}
</div> </div>
); );