From 96c4a24d3d922da3d4d3aab67c0ce2542376e56b Mon Sep 17 00:00:00 2001 From: Matthew Hodgson Date: Thu, 14 Apr 2016 21:10:55 +0100 Subject: [PATCH] skin RoomSubList chevrons, horizontal rules and selected room --- src/components/structures/RoomSubList.js | 2 +- .../matrix-react-sdk/structures/RoomView.css | 6 ++--- .../structures/UserSettings.css | 2 +- .../views/rooms/MemberList.css | 2 +- .../views/rooms/RoomHeader.css | 5 ---- .../matrix-react-sdk/views/rooms/RoomTile.css | 20 +++++++++++++-- .../views/rooms/TabCompleteBar.css | 1 + .../views/rooms/TopUnreadMessagesBar.css | 2 +- .../css/vector-web/structures/RoomSubList.css | 4 +-- src/skins/vector/img/list-close.svg | 25 +++++++++++-------- src/skins/vector/img/list-open.svg | 25 +++++++++++-------- 11 files changed, 58 insertions(+), 36 deletions(-) diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index 0b96ed18..ab89fd0f 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -278,7 +278,7 @@ var RoomSubList = React.createClass({ return (

{ this.props.collapsed ? '' : this.props.label } -

diff --git a/src/skins/vector/css/matrix-react-sdk/structures/RoomView.css b/src/skins/vector/css/matrix-react-sdk/structures/RoomView.css index 6656767d..1c18df28 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/RoomView.css +++ b/src/skins/vector/css/matrix-react-sdk/structures/RoomView.css @@ -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; } diff --git a/src/skins/vector/css/matrix-react-sdk/structures/UserSettings.css b/src/skins/vector/css/matrix-react-sdk/structures/UserSettings.css index 71a9b299..a1392f05 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/UserSettings.css +++ b/src/skins/vector/css/matrix-react-sdk/structures/UserSettings.css @@ -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 { diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberList.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberList.css index 283addcb..967b4bef 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberList.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberList.css @@ -84,7 +84,7 @@ limitations under the License. } .mx_MemberList_bottomRule { - border-top: 2px solid #e1dddd; + border-top: 1px solid #e5e5e5; margin-right: 15px; } diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomHeader.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomHeader.css index eeb45b4d..181420f3 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomHeader.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomHeader.css @@ -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; diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css index e1e8b312..476cce49 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css @@ -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; diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/TabCompleteBar.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/TabCompleteBar.css index 71bcd8f7..f7f4a0bd 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/TabCompleteBar.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/TabCompleteBar.css @@ -21,6 +21,7 @@ limitations under the License. .mx_TabCompleteBar_item { display: inline-block; margin-right: 15px; + margin-bottom: 2px; cursor: pointer; } diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/TopUnreadMessagesBar.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/TopUnreadMessagesBar.css index ef639e2e..77184d42 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/TopUnreadMessagesBar.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/TopUnreadMessagesBar.css @@ -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 { diff --git a/src/skins/vector/css/vector-web/structures/RoomSubList.css b/src/skins/vector/css/vector-web/structures/RoomSubList.css index d385397b..95248db0 100644 --- a/src/skins/vector/css/vector-web/structures/RoomSubList.css +++ b/src/skins/vector/css/vector-web/structures/RoomSubList.css @@ -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; } diff --git a/src/skins/vector/img/list-close.svg b/src/skins/vector/img/list-close.svg index eb60864e..cd88b2a8 100644 --- a/src/skins/vector/img/list-close.svg +++ b/src/skins/vector/img/list-close.svg @@ -1,10 +1,15 @@ - - - - Slice 1 - Created with Sketch. - - - - - \ No newline at end of file + + + + +Slice 1 +Created with Sketch. + + + + diff --git a/src/skins/vector/img/list-open.svg b/src/skins/vector/img/list-open.svg index a682ec90..e180be88 100644 --- a/src/skins/vector/img/list-open.svg +++ b/src/skins/vector/img/list-open.svg @@ -1,10 +1,15 @@ - - - - Slice 1 - Created with Sketch. - - - - - \ No newline at end of file + + + + +Slice 1 +Created with Sketch. + + + +