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

skin RoomSubList chevrons, horizontal rules and selected room

Browse source
This commit is contained in:
Matthew Hodgson 2016-04-14 21:10:55 +01:00
parent 8557a3b70e
commit 96c4a24d3d
11 changed files with 58 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/structures/RoomSubList.js
View file

@ -278,7 +278,7 @@ var RoomSubList = React.createClass({
return (
<h2 onClick={ this.onClick } className="mx_RoomSubList_label">
{ this.props.collapsed ? '' : this.props.label }
<TintableSvg className="mx_RoomSubList_chevron"
<img className="mx_RoomSubList_chevron"
src={ this.state.hidden ? "img/list-close.svg" : "img/list-open.svg" }
width="10" height="10" />
</h2>

6
src/skins/vector/css/matrix-react-sdk/structures/RoomView.css
View file

@ -89,7 +89,7 @@ limitations under the License.
margin: auto;
overflow: auto;
border-bottom: 1px solid #ccc;
border-bottom: 1px solid #e5e5e5;
-webkit-flex: 0 0 auto;
flex: 0 0 auto;
@ -158,7 +158,7 @@ limitations under the License.
margin-bottom: 8px;
margin-left: 63px;
padding-bottom: 6px;
border-bottom: 1px solid #eee;
border-bottom: 1px solid #e5e5e5;
}
.mx_RoomView_invitePrompt {
@ -212,7 +212,7 @@ hr.mx_RoomView_myReadMarker {
.mx_RoomView_statusAreaBox_line {
margin-left: 65px;
border-top: 1px solid #eee;
border-top: 1px solid #e5e5e5;
height: 1px;
}

2
src/skins/vector/css/matrix-react-sdk/structures/UserSettings.css
View file

@ -84,7 +84,7 @@ limitations under the License.
margin-bottom: 8px;
margin-left: 63px;
padding-bottom: 6px;
border-bottom: 1px solid #eee;
border-bottom: 1px solid #e5e5e5;
}
.mx_UserSettings h3 {

2
src/skins/vector/css/matrix-react-sdk/views/rooms/MemberList.css
View file

@ -84,7 +84,7 @@ limitations under the License.
}
.mx_MemberList_bottomRule {
border-top: 2px solid #e1dddd;
border-top: 1px solid #e5e5e5;
margin-right: 15px;
}

5
src/skins/vector/css/matrix-react-sdk/views/rooms/RoomHeader.css
View file

@ -24,7 +24,6 @@ limitations under the License.
max-width: 960px;
margin: auto;
height: 83px;
border-bottom: 1px solid #eeeeee;
-webkit-align-items: center;
align-items: center;
@ -36,10 +35,6 @@ limitations under the License.
display: flex;
}
.mx_RoomHeader_editing .mx_RoomHeader_wrapper {
border-bottom: 1px solid transparent;
}
.mx_RoomHeader_leftRow {
margin-left: -2px;

20
src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css
View file

@ -23,7 +23,7 @@ limitations under the License.
.mx_RoomTile_avatar {
display: table-cell;
padding-right: 8px;
padding-right: 11px;
padding-top: 6px;
padding-bottom: 6px;
padding-left: 20px;
@ -121,18 +121,34 @@ limitations under the License.
}
.mx_RoomTile_selected .mx_RoomTile_name {
color: #76cfa6 ! important;
}
.mx_RoomTile_highlight .mx_RoomTile_name {
color: #ff0064 ! important;
}
.mx_RoomTile.mx_RoomTile_selected .mx_RoomTile_avatar {
padding-right: 7px;
}
.mx_RoomTile.mx_RoomTile_selected .mx_RoomTile_name span {
display: inline-block;
position: relative;
width: 100%;
padding: 4px;
margin-top: -4px;
margin-bottom: -4px;
border-radius: 2px;
background-color: rgba(118,207,166,0.2);
}
/*
.mx_RoomTile.mx_RoomTile_selected .mx_RoomTile_name {
background: url('img/selected.png');
background-repeat: no-repeat;
background-position: right center;
}
*/
.mx_RoomTile_arrow {
position: absolute;

1
src/skins/vector/css/matrix-react-sdk/views/rooms/TabCompleteBar.css
View file

@ -21,6 +21,7 @@ limitations under the License.
.mx_TabCompleteBar_item {
display: inline-block;
margin-right: 15px;
margin-bottom: 2px;
cursor: pointer;
}

2
src/skins/vector/css/matrix-react-sdk/views/rooms/TopUnreadMessagesBar.css
View file

@ -19,7 +19,7 @@ limitations under the License.
max-width: 960px;
padding-top: 5px;
padding-bottom: 5px;
border-bottom: 1px solid #eee;
border-bottom: 1px solid #e5e5e5;
}
.mx_TopUnreadMessagesBar_scrollUp {

4
src/skins/vector/css/vector-web/structures/RoomSubList.css
View file

@ -32,10 +32,10 @@ limitations under the License.
}
.mx_RoomSubList_chevron {
padding-left: 5px;
padding-left: 4px;
pointer-events: none;
}
.collapsed .mx_RoomSubList_chevron {
padding-left: 13px;
padding-left: 12px;
}

23
src/skins/vector/img/list-close.svg
View file

@ -1,10 +1,15 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.4.2 (15857) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M0,5 L20,5 L10,15 L0,5 Z" id="Triangle-1" fill="#76CFA6" sketch:type="MSShapeGroup" transform="translate(10.000000, 10.000000) rotate(-90.000000) translate(-10.000000, -10.000000) "></path>
</g>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-249 251 20 20"
style="enable-background:new -249 251 20 20;" xml:space="preserve">
<style type="text/css">
.st0{opacity:0.2;}
.st1{fill:#444444;}
</style>
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<g id="Page-1" sketch:type="MSPage" class="st0">
<path id="Triangle-1" sketch:type="MSShapeGroup" class="st1" d="M-245,270v-18l12,9L-245,270z"/>
</g>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 748 B

After

Width:  |  Height:  |  Size: 716 B

23
src/skins/vector/img/list-open.svg
View file

@ -1,10 +1,15 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: Sketch 3.4.2 (15857) - http://www.bohemiancoding.com/sketch -->
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<defs></defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<path d="M0,5 L20,5 L10,15 L0,5 Z" id="Triangle-1" fill="#76CFA6" sketch:type="MSShapeGroup"></path>
</g>
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Layer_1" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-249 251 20 20"
style="enable-background:new -249 251 20 20;" xml:space="preserve">
<style type="text/css">
.st0{opacity:0.2;}
.st1{fill:#444444;}
</style>
<title>Slice 1</title>
<desc>Created with Sketch.</desc>
<g id="Page-1" sketch:type="MSPage" class="st0">
<path id="Triangle-1" sketch:type="MSShapeGroup" class="st1" d="M-248,255h18l-9,12L-248,255z"/>
</g>
</svg>
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 650 B

After

Width:  |  Height:  |  Size: 716 B