diff --git a/res/css/structures/_GroupGridView.scss b/res/css/structures/_GroupGridView.scss index 14c46d1370..0464026ed4 100644 --- a/res/css/structures/_GroupGridView.scss +++ b/res/css/structures/_GroupGridView.scss @@ -14,6 +14,11 @@ See the License for the specific language governing permissions and limitations under the License. */ +.mx_GroupGridView { + display: flex; + flex-direction: column; +} + .mx_GroupGridView_rooms { display: grid; grid-template-columns: repeat(3, calc(100% / 3)); @@ -21,11 +26,30 @@ limitations under the License. flex: 1 1 0; } -.mx_GroupGridView { + +.mx_GroupGridView_rightPanel { display: flex; flex-direction: column; + + .mx_GroupGridView_tabs { + flex: 0 0 52px; + border-bottom: 1px solid $primary-hairline-color; + display: flex; + align-items: center; + + > div { + justify-content: flex-end; + width: 100%; + margin-right: 10px; + } + } + + .mx_RightPanel { + flex: 1 0 auto !important; + } } + .mx_GroupGridView > .mx_MainSplit { flex: 1 1 0; display: flex; diff --git a/res/css/views/rooms/_MemberList.scss b/res/css/views/rooms/_MemberList.scss index 2695ebcf31..8e59eb85d5 100644 --- a/res/css/views/rooms/_MemberList.scss +++ b/res/css/views/rooms/_MemberList.scss @@ -53,6 +53,10 @@ limitations under the License. .mx_MemberList_query, .mx_GroupMemberList_query, .mx_GroupRoomList_query { + flex: 0 0 auto; +} + +.mx_MemberList .gm-scrollbar-container { flex: 1 1 0; } diff --git a/src/components/structures/GroupGridView.js b/src/components/structures/GroupGridView.js index d6268ff14c..abfd343309 100644 --- a/src/components/structures/GroupGridView.js +++ b/src/components/structures/GroupGridView.js @@ -23,6 +23,7 @@ import RoomView from './RoomView'; import classNames from 'classnames'; import MainSplit from './MainSplit'; import RightPanel from './RightPanel'; +import RoomHeaderButtons from '../views/right_panel/RoomHeaderButtons'; export default class RoomGridView extends React.Component { @@ -93,7 +94,15 @@ export default class RoomGridView extends React.Component { roomStores = roomStores.concat(emptyTiles); } const activeRoomId = this.state.activeRoomStore && this.state.activeRoomStore.getRoomId(); - const rightPanel = activeRoomId ? : undefined; + let rightPanel; + if (activeRoomId) { + rightPanel = ( +
+
+ +
+ ); + } return (
@@ -107,7 +116,7 @@ export default class RoomGridView extends React.Component { }); return (
{this._setActive(i)}} key={roomStore.getRoomId()} className={tileClasses}> diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index f6b9381080..af389c804a 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -1509,6 +1509,7 @@ module.exports = React.createClass({
@@ -1555,6 +1556,7 @@ module.exports = React.createClass({
@@ -1813,11 +1815,14 @@ module.exports = React.createClass({ }, ); - const rightPanel = this.state.room ? : undefined; + const rightPanel = this.state.room && !this.props.isGrid ? + : + undefined; return (
+ { !this.props.isGrid ? : undefined }
);