From 18eb9d933058ac310e8a1f120edd9f056c63d607 Mon Sep 17 00:00:00 2001 From: wmwragg Date: Fri, 9 Sep 2016 14:36:21 +0100 Subject: [PATCH 1/4] Made sure the z-index was correct for the new little green men --- .../matrix-react-sdk/views/rooms/RoomList.css | 2 +- .../css/vector-web/structures/LeftPanel.css | 2 +- .../css/vector-web/structures/RoomSubList.css | 2 +- src/skins/vector/img/icon_person.svg | 23 +++++++++++++++++++ 4 files changed, 26 insertions(+), 3 deletions(-) create mode 100644 src/skins/vector/img/icon_person.svg diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomList.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomList.css index 4dcda646..110dcd5b 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomList.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomList.css @@ -35,5 +35,5 @@ limitations under the License. /* Make sure the scrollbar is above the sticky headers from RoomList */ .mx_RoomList_scrollbar .gm-scrollbar.-vertical { - z-index: 5; + z-index: 6; } diff --git a/src/skins/vector/css/vector-web/structures/LeftPanel.css b/src/skins/vector/css/vector-web/structures/LeftPanel.css index 12991fc2..98b2abd4 100644 --- a/src/skins/vector/css/vector-web/structures/LeftPanel.css +++ b/src/skins/vector/css/vector-web/structures/LeftPanel.css @@ -49,7 +49,7 @@ limitations under the License. flex: 1 1 0; overflow-y: auto; - z-index: 5; + z-index: 6; } .mx_LeftPanel.collapsed .mx_BottomLeftMenu { diff --git a/src/skins/vector/css/vector-web/structures/RoomSubList.css b/src/skins/vector/css/vector-web/structures/RoomSubList.css index fef04416..9e416281 100644 --- a/src/skins/vector/css/vector-web/structures/RoomSubList.css +++ b/src/skins/vector/css/vector-web/structures/RoomSubList.css @@ -46,7 +46,7 @@ limitations under the License. .mx_RoomSubList_label.mx_RoomSubList_fixed { position: fixed; top: 0; - z-index: 4; + z-index: 5; /* pointer-events: none; */ } diff --git a/src/skins/vector/img/icon_person.svg b/src/skins/vector/img/icon_person.svg new file mode 100644 index 00000000..4be70df0 --- /dev/null +++ b/src/skins/vector/img/icon_person.svg @@ -0,0 +1,23 @@ + + + + 815EF7DE-169A-4322-AE2A-B65CBE91DCED + Created with sketchtool. + + + + + + + + + + + + + + + + + + From cd368004266e6db6cb2a8427666ae81b27859f05 Mon Sep 17 00:00:00 2001 From: wmwragg Date: Fri, 9 Sep 2016 14:42:11 +0100 Subject: [PATCH 2/4] New direct message indicator CSS --- .../css/matrix-react-sdk/views/rooms/RoomTile.css | 12 ++++++++++++ 1 file changed, 12 insertions(+) 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 2f1da5b2..28145946 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 @@ -36,6 +36,10 @@ limitations under the License. height: 24px; } +.mx_RoomTile_avatar_container { + position: relative; +} + .mx_RoomTile_avatar { display: inline-block; padding-top: 5px; @@ -47,6 +51,14 @@ limitations under the License. vertical-align: middle; } +.mx_RoomTile_dm { + display: block; + position: absolute; + bottom: 0; + right: -5px; + z-index: 2; +} + .mx_RoomTile_avatar_container:hover:before, .mx_RoomTile_avatar_container.mx_RoomTile_avatar_roomTagMenu:before { display: block; From 2476f87e1d3b54d483d640a1268ac2077d4c9ced Mon Sep 17 00:00:00 2001 From: wmwragg Date: Fri, 9 Sep 2016 14:47:26 +0100 Subject: [PATCH 3/4] Positional tweaks for the new Direct Message indicator --- src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) 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 28145946..9055083c 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 @@ -67,7 +67,6 @@ limitations under the License. border-radius: 40px; background-image: url("img/icons_ellipsis.svg"); background-size: 25px; - left: 15px; width: 24px; height: 24px; z-index: 4; @@ -80,7 +79,7 @@ limitations under the License. content: ""; border-radius: 40px; background: #4A4A4A; - top: 5px; + bottom: 0; width: 24px; height: 24px; opacity: 0.6; From 965d9aaf47ac985366672001fb1810510b25d430 Mon Sep 17 00:00:00 2001 From: wmwragg Date: Fri, 9 Sep 2016 14:56:20 +0100 Subject: [PATCH 4/4] Lowered the Avatar menu background, so the Direct Message indicator is in front of it --- src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) 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 9055083c..29fbd9de 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 @@ -83,7 +83,7 @@ limitations under the License. width: 24px; height: 24px; opacity: 0.6; - z-index: 2; + z-index: 1; } .collapsed .mx_RoomTile_avatar_container:hover:before {