diff --git a/res/css/views/rooms/_MemberInfo.pcss b/res/css/views/rooms/_MemberInfo.pcss index 28b948ad9d..cc5ea79f83 100644 --- a/res/css/views/rooms/_MemberInfo.pcss +++ b/res/css/views/rooms/_MemberInfo.pcss @@ -20,15 +20,47 @@ limitations under the License. flex: 1; overflow-y: auto; margin-top: 8px; + + h2 { + font-size: $font-18px; + font-weight: var(--font-semi-bold); + margin: 16px 0 16px 15px; + } + + .mx_RoomTile_titleContainer { + width: 154px; + } + + .mx_RoomTile_badge { + display: none; + } + + .mx_RoomTile_title { + width: 160px; + } + + h3 { + text-transform: uppercase; + color: $input-darker-fg-color; + font-weight: bold; + font-size: $font-12px; + margin: 4px 0; + } } .mx_MemberInfo_name { align-items: center; display: flex; -} -.mx_MemberInfo_name > .mx_E2EIcon { - margin-right: 0; + > .mx_E2EIcon { + margin-right: 0; + } + + h2 { + flex: 1; + overflow-x: auto; + max-height: 50px; + } } .mx_MemberInfo_cancel { @@ -42,63 +74,31 @@ limitations under the License. background-color: $header-panel-text-primary-color; } -.mx_MemberInfo_name h2 { - flex: 1; - overflow-x: auto; - max-height: 50px; -} - -.mx_MemberInfo h2 { - font-size: $font-18px; - font-weight: var(--font-semi-bold); - margin: 16px 0 16px 15px; -} - .mx_MemberInfo_container { margin: 0 16px 16px 16px; } -.mx_MemberInfo .mx_RoomTile_titleContainer { - width: 154px; -} - -.mx_MemberInfo .mx_RoomTile_badge { - display: none; -} - -.mx_MemberInfo .mx_RoomTile_title { - width: 160px; -} - .mx_MemberInfo_avatar { background: $spacePanel-bg-color; margin-bottom: 16px; -} -.mx_MemberInfo_avatar > img { - height: auto; - width: 100%; - max-height: 30vh; - object-fit: contain; - display: block; -} + > img { + height: auto; + width: 100%; + max-height: 30vh; + object-fit: contain; + display: block; + } -.mx_MemberInfo_avatar .mx_BaseAvatar.mx_BaseAvatar_image { - cursor: zoom-in; + .mx_BaseAvatar.mx_BaseAvatar_image { + cursor: zoom-in; + } } .mx_MemberInfo_profile { margin-bottom: 16px; } -.mx_MemberInfo h3 { - text-transform: uppercase; - color: $input-darker-fg-color; - font-weight: bold; - font-size: $font-12px; - margin: 4px 0; -} - .mx_MemberInfo_profileField { font-size: $font-15px; position: relative;