OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

fix bad membership list horizontal scrolling

pull/1/head
Matthew Hodgson 2015-07-15 00:31:47 +01:00
parent 77e76972f0
commit 9a51cace34
3 changed files with 21 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
skins/base/css/molecules/RoomTile.css
View File

@ -31,7 +31,11 @@ limitations under the License.
vertical-align: middle; vertical-align: middle;
width: 32px; width: 32px;
height: 32px; height: 32px;
border-radius: 16px; }
.mx_RoomTile_avatar img {
border-radius: 16px;
background-color: #dbdbdb;
} }
.mx_RoomTile_name { .mx_RoomTile_name {

14
skins/base/css/organisms/MemberList.css
View File

@ -15,26 +15,30 @@ limitations under the License.
*/ */
.mx_MemberList { .mx_MemberList {
width: 100%;
height: 100%; height: 100%;
margin-bottom: 100px; margin-bottom: 100px;
padding: 8px;
} }
.mx_MemberList_chevron { .mx_MemberList_chevron {
position: absolute; position: absolute;
right: 20px; right: 20px;
margin-top: -5px; margin-top: -13px;
} }
.mx_MemberList_wrapper { .mx_MemberList_border {
border: 1px solid #d8d8d8; border: 1px solid #d8d8d8;
margin: 8px;
overflow-y: scroll; overflow-y: scroll;
height: auto; height: auto;
max-height: 75%; max-height: 75%;
border-radius: 8px; border-radius: 8px;
padding: 20px 24px 14px 24px; padding: 20px 24px 14px 24px;
}
.mx_MemberList_wrapper {
display: table;
table-layout: fixed; table-layout: fixed;
width: 100%;
} }
.mx_MemberList h2 { .mx_MemberList h2 {

12
skins/base/views/organisms/MemberList.js
View File

@ -45,12 +45,14 @@ module.exports = React.createClass({
<div className="mx_MemberList_chevron"> <div className="mx_MemberList_chevron">
<img src="img/chevron.png" width="24" height="13"/> <img src="img/chevron.png" width="24" height="13"/>
</div> </div>
<div className="mx_MemberList_wrapper"> <div className="mx_MemberList_border">
<h2>Members</h2> <h2>Members</h2>
{this.makeMemberTiles()} <div className="mx_MemberList_wrapper">
<div className="mx_MemberTile"> {this.makeMemberTiles()}
<div className="mx_MemberTile_avatar"><img src="img/create.png" width="32" height="32" alt="()"/></div> <div className="mx_MemberTile">
<div className="mx_MemberTile_name">Invite</div> <div className="mx_MemberTile_avatar"><img src="img/create.png" width="32" height="32" alt="()"/></div>
<div className="mx_MemberTile_name">Invite</div>
</div>
</div> </div>
</div> </div>
</div> </div>