PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Added back the Directory listing button, with new tootlip

Browse source
This commit is contained in:
wmwragg 2016-09-09 12:23:50 +01:00
parent 8376f0d75a
commit 09ce3a79ec
2 changed files with 33 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
src/components/structures/BottomLeftMenu.js
View file

@ -30,6 +30,7 @@ module.exports = React.createClass({
getInitialState: function() {
return({
directoryHover : false,
roomsHover : false,
peopleHover : false,
settingsHover : false,
@ -37,8 +38,20 @@ module.exports = React.createClass({
},
// Room events
onDirectoryClick: function() {
dis.dispatch({ action: 'view_room_directory' });
},
onDirectoryMouseEnter: function() {
this.setState({ directoryHover: true });
},
onDirectoryMouseLeave: function() {
this.setState({ directoryHover: false });
},
onRoomsClick: function() {
dis.dispatch({action: 'view_create_room'});
dis.dispatch({ action: 'view_create_room' });
},
onRoomsMouseEnter: function() {
@ -51,7 +64,7 @@ module.exports = React.createClass({
// People events
onPeopleClick: function() {
dis.dispatch({action: 'view_create_chat'});
dis.dispatch({ action: 'view_create_chat' });
},
onPeopleMouseEnter: function() {
@ -64,7 +77,7 @@ module.exports = React.createClass({
// Settings events
onSettingsClick: function() {
dis.dispatch({action: 'view_user_settings'});
dis.dispatch({ action: 'view_user_settings' });
},
onSettingsMouseEnter: function() {
@ -88,9 +101,13 @@ module.exports = React.createClass({
return (
<div className="mx_BottomLeftMenu">
<div className="mx_BottomLeftMenu_options">
<div className="mx_BottomLeftMenu_directory" onClick={ this.onDirectoryClick } onMouseEnter={ this.onDirectoryMouseEnter } onMouseLeave={ this.onDirectoryMouseLeave } >
<TintableSvg src="img/icons-directory.svg" width="25" height="25"/>
{ this.getLabel("Room directory", this.state.directoryHover) }
</div>
<div className="mx_BottomLeftMenu_createRoom" onClick={ this.onRoomsClick } onMouseEnter={ this.onRoomsMouseEnter } onMouseLeave={ this.onRoomsMouseLeave } >
<TintableSvg src="img/icons-create-room.svg" width="25" height="25" />
{ this.getLabel("Rooms", this.state.roomsHover) }
{ this.getLabel("Create new room", this.state.roomsHover) }
</div>
<div className="mx_BottomLeftMenu_people" onClick={ this.onPeopleClick } onMouseEnter={ this.onPeopleMouseEnter } onMouseLeave={ this.onPeopleMouseLeave } >
<TintableSvg src="img/icons-people.svg" width="25" height="25" />

14
src/skins/vector/css/vector-web/structures/LeftPanel.css
View file

@ -53,7 +53,7 @@ limitations under the License.
}
.mx_LeftPanel.collapsed .mx_BottomLeftMenu {
flex: 0 0 120px;
flex: 0 0 160px;
}
.mx_LeftPanel .mx_BottomLeftMenu {
@ -79,6 +79,7 @@ limitations under the License.
pointer-events: none;
}
.mx_LeftPanel .mx_BottomLeftMenu_directory,
.mx_LeftPanel .mx_BottomLeftMenu_createRoom,
.mx_LeftPanel .mx_BottomLeftMenu_people,
.mx_LeftPanel .mx_BottomLeftMenu_settings {
@ -86,6 +87,7 @@ limitations under the License.
cursor: pointer;
}
.collapsed .mx_BottomLeftMenu_directory,
.collapsed .mx_BottomLeftMenu_createRoom,
.collapsed .mx_BottomLeftMenu_people,
.collapsed .mx_BottomLeftMenu_settings {
@ -94,8 +96,16 @@ limitations under the License.
padding-bottom: 3px ! important;
}
.mx_LeftPanel .mx_BottomLeftMenu_directory {
margin-right: 10px;
}
.mx_LeftPanel .mx_BottomLeftMenu_createRoom {
margin-right: 10px;
}
.mx_LeftPanel .mx_BottomLeftMenu_people {
margin-left: 10px;
margin-right: 10px;
}
.mx_LeftPanel .mx_BottomLeftMenu_settings {