gaja-group
/
matrix-bot
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

css prettification

This commit is contained in:
Matthew Hodgson 2015-07-23 10:24:34 -07:00
parent e2644e3c13
commit 5248b0c631
5 changed files with 69 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
skins/base/css/organisms/RoomDirectory.css
View File

@ -18,6 +18,7 @@ limitations under the License.
width: 720px;
margin-left: auto;
margin-right: auto;
color: #4a4a4a;
}
.mx_RoomDirectory_input {
@ -31,8 +32,33 @@ limitations under the License.
margin-bottom: 12px;
}
.mx_RoomDirectory_tableWrapper {
overflow-y: scroll;
height: 400px;
}
.mx_RoomDirectory_table {
width: 100%;
text-align: left;
}
.mx_RoomDirectory_table th {
font-weight: 400;
font-size: 12px;
}
.mx_RoomDirectory_table td {
font-weight: 300;
font-size: 16px;
}
.mx_RoomDirectory_table .mx_RoomDirectory_name {
font-weight: 400;
}
.mx_RoomDirectory_table .mx_RoomDirectory_topic {
font-weight: 400;
font-size: 12px;
}
.mx_RoomDirectory_table td,

14
skins/base/views/organisms/CreateRoom.js
View File

@ -28,6 +28,7 @@ var CreateRoomButton = ComponentBroker.get("atoms/create_room/CreateRoomButton")
var RoomAlias = ComponentBroker.get("atoms/create_room/RoomAlias");
var Presets = ComponentBroker.get("atoms/create_room/Presets");
var UserSelector = ComponentBroker.get("molecules/UserSelector");
var RoomHeader = ComponentBroker.get("molecules/RoomHeader");
var Loader = require("react-loader");
@ -141,17 +142,28 @@ module.exports = React.createClass({
}
return (
<div className="mx_CreateRoom">
<RoomHeader simpleHeader="Create room" />
<div className="mx_CreateRoom_body">
<input type="text" ref="room_name" value={this.state.room_name} onChange={this.onNameChange} placeholder="Name"/> <br />
<textarea ref="topic" value={this.state.topic} onChange={this.onTopicChange} placeholder="Description"/> <br />
<textarea className="mx_CreateRoom_description" ref="topic" value={this.state.topic} onChange={this.onTopicChange} placeholder="Topic"/> <br />
<RoomAlias ref="alias" alias={this.state.alias} onChange={this.onAliasChanged}/> <br />
<UserSelector ref="user_selector" selected_users={this.state.invited_users} onChange={this.onInviteChanged}/> <br />
<Presets ref="presets" onChange={this.onPresetChanged} preset={this.state.preset}/> <br />
<div>
<label><input type="checkbox" ref="is_private" checked={this.state.is_private} onChange={this.onPrivateChanged}/> Make this room private</label>
</div>
<div>
<label><input type="checkbox" ref="share_history" checked={this.state.share_history} onChange={this.onShareHistoryChanged}/> Share message history with new users</label>
</div>
<div>
<label><input type="checkbox" ref="encrypt" checked={this.state.encrypt} onChange={this.onEncryptChanged}/> Encrypt room</label>
</div>
<div>
<CreateRoomButton onCreateRoom={this.onCreateRoom} /> <br />
</div>
{error_box}
</div>
</div>
);
}
}

28
skins/base/views/organisms/RoomDirectory.js
View File

@ -76,26 +76,26 @@ module.exports = React.createClass({
var rooms = this.state.publicRooms.filter(function(a) {
// FIXME: if incrementally typing, keep narrowing down the search set
return (a.aliases[0].search(filter) >= 0);
return (a.aliases[0].search(filter) >= 0 && a.num_joined_members > 0);
}).sort(function(a,b) {
return a.num_joined_members > b.num_joined_members;
return a.num_joined_members - b.num_joined_members;
});
var rows = [];
var self = this;
for (var i = 0; i < rooms.length; i++) {
var name = rooms[i].name;
if (!name) {
if (rooms[i].aliases[0]) name = rooms[i].aliases[0]
}
else {
if (rooms[i].aliases[0]) name += " (" + rooms[i].aliases[0] + ")";
}
// <img src={ MatrixClientPeg.get().getAvatarUrlForRoom(rooms[i].room_id, 40, 40, "crop") } width="40" height="40" alt=""/>
rows.unshift(
<tr key={ rooms[i].room_id } onClick={self.joinRoom.bind(null, rooms[i].room_id)}>
<td><img src={ MatrixClientPeg.get().getAvatarUrlForRoom(rooms[i].room_id, 40, 40, "crop") } width="40" height="40" alt=""/> { name }</td>
<td>{ rooms[i].topic }</td>
<td style={ {'text-align' : 'center'} }>{ rooms[i].num_joined_members }</td>
<tbody key={ rooms[i].room_id }>
<tr onClick={self.joinRoom.bind(null, rooms[i].room_id)}>
<td className="mx_RoomDirectory_name">{ name }</td>
<td>{ rooms[i].aliases[0] }</td>
<td>{ rooms[i].num_joined_members }</td>
</tr>
<tr>
<td className="mx_RoomDirectory_topic" colSpan="3">{ rooms[i].topic }</td>
</tr>
</tbody>
);
}
return rows;
@ -118,12 +118,14 @@ module.exports = React.createClass({
<RoomHeader simpleHeader="Public Rooms" />
<div className="mx_RoomDirectory_list">
<input ref="roomAlias" placeholder="Join a room (e.g. #foo:domain.com)" className="mx_RoomDirectory_input" size="64" onKeyUp={ this.onKeyUp }/>
<div className="mx_RoomDirectory_tableWrapper">
<table className="mx_RoomDirectory_table">
<tr><th>Room</th><th>Topic</th><th>Users</th></tr>
<tr><th>Room</th><th>Alias</th><th>Members</th></tr>
{ this.getRows(this.state.roomAlias) }
</table>
</div>
</div>
</div>
);
}
});

2
skins/base/views/templates/Login.js
View File

@ -164,7 +164,7 @@ module.exports = React.createClass({
<div className="mx_Login">
<div className="mx_Login_box">
<div className="mx_Login_logo">
<img src="img/logo.png" width="249" height="76" alt="vector"/>
<img src="img/logo.png" width="249" height="78" alt="vector"/>
</div>
{this.loginContent()}
</div>

2
skins/base/views/templates/Register.js
View File

@ -182,7 +182,7 @@ module.exports = React.createClass({
<div className="mx_Login">
<div className="mx_Login_box">
<div className="mx_Login_logo">
<img src="img/logo.png" width="249" height="76" alt="vector"/>
<img src="img/logo.png" width="249" height="78" alt="vector"/>
</div>
{this.registerContent()}
</div>