mirror of
https://github.com/SchildiChat/element-web.git
synced 2024-10-01 01:26:12 -04:00
Merge pull request #3117 from vector-im/matthew/fix-top-right-menu
make TopRightMenu more intuitive
This commit is contained in:
commit
7c27153ec5
@ -69,45 +69,21 @@ module.exports = React.createClass({
|
||||
},
|
||||
|
||||
onMemberListButtonClick: function() {
|
||||
if (this.props.collapsed || this.state.phase !== this.Phase.MemberList) {
|
||||
this.setState({ phase: this.Phase.MemberList });
|
||||
dis.dispatch({
|
||||
action: 'show_right_panel',
|
||||
});
|
||||
}
|
||||
else {
|
||||
dis.dispatch({
|
||||
action: 'hide_right_panel',
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
onFileListButtonClick: function() {
|
||||
if (this.props.collapsed || this.state.phase !== this.Phase.FilePanel) {
|
||||
this.setState({ phase: this.Phase.FilePanel });
|
||||
dis.dispatch({
|
||||
action: 'show_right_panel',
|
||||
});
|
||||
}
|
||||
else {
|
||||
dis.dispatch({
|
||||
action: 'hide_right_panel',
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
onNotificationListButtonClick: function() {
|
||||
if (this.props.collapsed || this.state.phase !== this.Phase.NotificationPanel) {
|
||||
this.setState({ phase: this.Phase.NotificationPanel });
|
||||
dis.dispatch({
|
||||
action: 'show_right_panel',
|
||||
});
|
||||
}
|
||||
else {
|
||||
},
|
||||
|
||||
onCollapseClick: function() {
|
||||
dis.dispatch({
|
||||
action: 'hide_right_panel',
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
onInviteButtonClick: function() {
|
||||
@ -235,6 +211,9 @@ module.exports = React.createClass({
|
||||
<TintableSvg src="img/icons-notifications.svg" width="25" height="25"/>
|
||||
{ notificationsHighlight }
|
||||
</div>
|
||||
<div className="mx_RightPanel_headerButton mx_RightPanel_collapsebutton" title="Hide panel" onClick={ this.onCollapseClick }>
|
||||
<TintableSvg src="img/minimise.svg" width="10" height="16"/>
|
||||
</div>
|
||||
</div>;
|
||||
}
|
||||
|
||||
|
@ -68,13 +68,13 @@ module.exports = React.createClass({
|
||||
if (this.props.collapsed) {
|
||||
toggleCollapse =
|
||||
<div className="mx_SearchBox_maximise" onClick={ this.onToggleCollapse.bind(this, true) }>
|
||||
<TintableSvg src="img/maximise.svg" width="10" height="16" alt="<"/>
|
||||
<TintableSvg src="img/maximise.svg" width="10" height="16" alt="Expand panel"/>
|
||||
</div>
|
||||
}
|
||||
else {
|
||||
toggleCollapse =
|
||||
<div className="mx_SearchBox_minimise" onClick={ this.onToggleCollapse.bind(this, false) }>
|
||||
<TintableSvg src="img/minimise.svg" width="10" height="16" alt="<"/>
|
||||
<TintableSvg src="img/minimise.svg" width="10" height="16" alt="Collapse panel"/>
|
||||
</div>
|
||||
}
|
||||
|
||||
|
@ -34,14 +34,15 @@ limitations under the License.
|
||||
|
||||
.mx_RightPanel_headerButtonGroup {
|
||||
margin-top: 6px;
|
||||
float: left;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
background-color: $primary-bg-color;
|
||||
margin-left: 0px;
|
||||
}
|
||||
|
||||
.mx_RightPanel_headerButton {
|
||||
cursor: pointer;
|
||||
display: table-cell;
|
||||
flex: 0;
|
||||
vertical-align: top;
|
||||
padding-left: 4px;
|
||||
padding-right: 5px;
|
||||
@ -69,6 +70,12 @@ limitations under the License.
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
|
||||
.mx_RightPanel_collapsebutton {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.mx_RightPanel .mx_MemberList,
|
||||
.mx_RightPanel .mx_MemberInfo,
|
||||
.mx_RightPanel_blank {
|
||||
|
Loading…
Reference in New Issue
Block a user