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 aa253c1ade..605c1edc70 100644 --- a/src/skins/vector/css/matrix-react-sdk/structures/UserSettings.css +++ b/src/skins/vector/css/matrix-react-sdk/structures/UserSettings.css @@ -143,6 +143,13 @@ limitations under the License. font-size: 16px; } +.mx_UserSettings_changePasswordButton { + float: right; + margin-right: 32px; + margin-left: 32px; + margin-top: -54px; +} + .mx_UserSettings_logout { float: right; margin-right: 32px; @@ -156,10 +163,6 @@ limitations under the License. cursor: pointer; } -.mx_UserSettings_avatarPicker .mx_RoomAvatar { - border-radius: 40px; -} - .mx_UserSettings_avatarPicker_edit { text-align: center; margin-top: 10px; diff --git a/src/skins/vector/css/matrix-react-sdk/views/avatars/BaseAvatar.css b/src/skins/vector/css/matrix-react-sdk/views/avatars/BaseAvatar.css index 487461b5ce..901a29599a 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/avatars/BaseAvatar.css +++ b/src/skins/vector/css/matrix-react-sdk/views/avatars/BaseAvatar.css @@ -25,9 +25,10 @@ limitations under the License. text-align: center; speak: none; pointer-events: none; + font-weight: normal; } .mx_BaseAvatar_image { - border-radius: 20px; + border-radius: 40px; vertical-align: top; } diff --git a/src/skins/vector/css/matrix-react-sdk/views/avatars/RoomAvatar.css b/src/skins/vector/css/matrix-react-sdk/views/avatars/RoomAvatar.css deleted file mode 100644 index 29b9cefb92..0000000000 --- a/src/skins/vector/css/matrix-react-sdk/views/avatars/RoomAvatar.css +++ /dev/null @@ -1,28 +0,0 @@ -/* -Copyright 2015, 2016 OpenMarket Ltd - -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. -*/ - -.mx_RoomAvatar { - vertical-align: middle; -} - -.mx_RoomAvatar_initial { - position: absolute; - color: #fff; - text-align: center; - font-weight: normal ! important; - speak: none; - pointer-events: none; -} \ No newline at end of file diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/EntityTile.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/EntityTile.css index 99965bff91..8bf5f83ce1 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/EntityTile.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/EntityTile.css @@ -25,10 +25,7 @@ limitations under the License. display: table-cell; vertical-align: middle; margin-left: 10px; -} - -.mx_EntityTile:hover .mx_MessageTimestamp { - display: block; + width: 26px; } .mx_EntityTile_avatar { @@ -43,6 +40,14 @@ limitations under the License. position: relative; } +.mx_EntityTile_power { + position: absolute; + width: 16px; + height: 17px; + top: 0px; + right: 6px; +} + .mx_EntityTile_name { display: table-cell; vertical-align: middle; @@ -83,4 +88,11 @@ limitations under the License. opacity: 0.25; } +.mx_EntityTile_unknown .mx_EntityTile_avatar, +.mx_EntityTile_unknown .mx_EntityTile_name, +.mx_EntityTile_unknown .mx_EntityTile_name_hover +{ + opacity: 0.25; +} + diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css index 6de9f57054..2d0205f58c 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/EventTile.css @@ -31,11 +31,6 @@ limitations under the License. top: 0px; } -.mx_EventTile_avatar img { - border-radius: 20px; - border: 0px; -} - .mx_EventTile_continuation { margin-top: 8px ! important; } diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css index d750a9fdc5..4d421007dc 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css @@ -32,10 +32,6 @@ limitations under the License. clear: both; } -.mx_MemberInfo_avatar img { - border-radius: 48px; -} - .mx_MemberInfo_profile { margin-bottom: 16px; } 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 5f16ccac54..5cbc1f019d 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 @@ -44,25 +44,41 @@ limitations under the License. flex: 1 1 0px; } -.mx_MemberList_invite { - font-family: 'Open Sans', Arial, Helvetica, Sans-Serif; - border-radius: 3px; - border: 1px solid #f0f0f0; - padding: 9px; - color: #454545; - margin-left: 3px; - font-size: 15px; - margin-bottom: 8px; - width: 180px; +.mx_MemberList .mx_SearchableEntityList { + order: 1; + flex: 0; + -webkit-flex: 0; } -.mx_MemberList_invite::-moz-placeholder { - color: #454545; - opacity: 0.5; +.mx_MemberList .mx_SearchableEntityList_expanded { + flex: 1 1 0; + -webkit-flex: 1 1 0; } -.mx_MessageList_invite::-webkit-input-placeholder { - color: #454545; - opacity: 0.5; + +.mx_MemberList_joined { + order: 2; + flex: 1 1 auto; + -webkit-flex: 1 1 auto; + + overflow-y: auto; +} + +/* +.mx_MemberList_invited { + order: 3; + flex: 0 0 100px; + -webkit-flex: 0 0 100px; + overflow-y: auto; +} +*/ + +.mx_MemberList_bottom { + order: 4; + flex: 0 0 72px; + -webkit-flex: 0 0 72px; + + border-top: 2px solid #e1dddd; + margin-right: 15px; } .mx_MemberList_invited h2 { @@ -76,8 +92,13 @@ limitations under the License. margin-bottom: 4px; } +/* we have to have display: table in order for the horizontal wrapping to work */ .mx_MemberList_wrapper { - display: table; + display: table; table-layout: fixed; width: 100%; } + +.mx_MemberList_outerWrapper { + height: 0px; +} 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 f242241f3f..900e01d1a1 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 @@ -194,7 +194,7 @@ limitations under the License. .mx_RoomHeader_editable { border-bottom: 1px solid #c7c7c7 ! important; - min-width: 70px; + min-width: 150px; cursor: text; } @@ -224,10 +224,6 @@ limitations under the License. vertical-align: middle; } -.mx_RoomHeader_avatar .mx_RoomAvatar { - border-radius: 24px; -} - .mx_RoomHeader_avatarPicker_edit { position: absolute; margin-left: 16px; diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomSettings.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomSettings.css index 396660f12d..006882ebb5 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomSettings.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomSettings.css @@ -60,7 +60,7 @@ limitations under the License. */ .mx_RoomSettings .mx_RoomSettings_toggles label { - margin-bottom: 10px; + margin-bottom: 8px; display: block; } @@ -74,7 +74,7 @@ limitations under the License. } .mx_RoomSettings .mx_RoomSettings_tags { - margin-bottom: 10px; + margin-bottom: 8px; } .mx_RoomSettings .mx_RoomSettings_roomColor { @@ -99,29 +99,48 @@ limitations under the License. width: 100%; } +.mx_RoomSettings .mx_RoomSettings_aliasLabel { + margin-bottom: 8px; +} + .mx_RoomSettings .mx_RoomSettings_aliasesTable { margin-top: 12px; - margin-bottom: 12px; + margin-bottom: 0px; margin-left: 56px; display: table; } -.mx_RoomSettings .mx_RoomSettings_aliasesRow { +.mx_RoomSettings .mx_RoomSettings_aliasesTableRow { display: table-row; + margin-bottom: 16px; } .mx_RoomSettings .mx_RoomSettings_alias { - display: table-cell; - margin-bottom: 20px; + max-width: 400px; + margin-bottom: 16px; + /* + commented out so margin applies + display: table-cell; */ } .mx_RoomSettings .mx_RoomSettings_addAlias, .mx_RoomSettings .mx_RoomSettings_deleteAlias { display: table-cell; padding-left: 0.5em; + position: relative; cursor: pointer; } +.mx_RoomSettings .mx_RoomSettings_addAlias img, +.mx_RoomSettings .mx_RoomSettings_deleteAlias img { + visibility: hidden; +} + +.mx_RoomSettings .mx_RoomSettings_aliasesTableRow:hover .mx_RoomSettings_addAlias img, +.mx_RoomSettings .mx_RoomSettings_aliasesTableRow:hover .mx_RoomSettings_deleteAlias img { + visibility: visible; +} + .mx_RoomSettings_editable { border: 0px; border-bottom: 1px solid #c7c7c7; @@ -150,10 +169,6 @@ limitations under the License. color: #a2a2a2; } -.mx_RoomSettings .mx_RoomAvatar { - border-radius: 120px; -} - .mx_RoomSettings_buttons { text-align: right; margin-bottom: 16px; 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 094125fa11..44b884e859 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 @@ -33,10 +33,6 @@ limitations under the License. vertical-align: middle; } -.mx_RoomTile_avatar img { - border-radius: 20px; -} - .mx_RoomTile_name { display: table-cell; width: 100%; diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/SearchableEntityList.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/SearchableEntityList.css index 0283f56e13..6709911870 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/SearchableEntityList.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/SearchableEntityList.css @@ -14,10 +14,68 @@ See the License for the specific language governing permissions and limitations under the License. */ -.mx_SearchableEntityList_list { - border-bottom: 1px solid #e1dddd; +.mx_SearchableEntityList { + flex: 1; + -webkit-flex: 1; + + display: flex; + display: -webkit-flex; + + flex-direction: column; + -webkit-flex-direction: column; } -.mx_SearchableEntityList_list:empty { - border-bottom: 0px; +.mx_SearchableEntityList_query { + font-family: 'Open Sans', Arial, Helvetica, Sans-Serif; + border-radius: 3px; + border: 1px solid #f0f0f0; + padding: 9px; + color: #454545; + margin-left: 3px; + font-size: 15px; + margin-bottom: 8px; + width: 180px; +} + +.mx_SearchableEntityList_query::-moz-placeholder { + color: #454545; + opacity: 0.5; +} + +.mx_SearchableEntityList_query::-webkit-input-placeholder { + color: #454545; + opacity: 0.5; +} + +.mx_SearchableEntityList_listWrapper { + flex: 1; + -webkit-flex: 1; + + overflow-y: auto; +} + +.mx_SearchableEntityList_list { + display: table; + table-layout: fixed; + width: 100%; +} + +.mx_SearchableEntityList_list .mx_EntityTile_chevron { + display: none; +} + +.mx_SearchableEntityList_hrWrapper { + width: 100%; + flex: 0px; + -webkit-flex: 0; +} + +.mx_SearchableEntityList hr { + height: 1px; + border: 0px; + color: #e1dddd; + background-color: #e1dddd; + margin-right: 15px; + margin-top: 11px; + margin-bottom: 11px; } 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 e93eccb96b..e0d0965e34 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 @@ -41,7 +41,6 @@ limitations under the License. } .mx_TabCompleteBar_item img { - border-radius: 24px; margin-right: 8px; vertical-align: middle; }