Tweak layout of the space room directory for better legibility

pull/21833/head
Michael Telatynski 2021-03-25 14:09:56 +00:00
parent 35ede972db
commit 4df197ac61
1 changed files with 21 additions and 8 deletions

View File

@ -182,7 +182,7 @@ limitations under the License.
.mx_SpaceRoomDirectory_roomTile { .mx_SpaceRoomDirectory_roomTile {
position: relative; position: relative;
padding: 6px 16px; padding: 8px 16px;
border-radius: 8px; border-radius: 8px;
min-height: 56px; min-height: 56px;
box-sizing: border-box; box-sizing: border-box;
@ -190,6 +190,7 @@ limitations under the License.
display: grid; display: grid;
grid-template-columns: 20px auto max-content; grid-template-columns: 20px auto max-content;
grid-column-gap: 8px; grid-column-gap: 8px;
grid-row-gap: 6px;
align-items: center; align-items: center;
.mx_BaseAvatar { .mx_BaseAvatar {
@ -213,16 +214,28 @@ limitations under the License.
.mx_InfoTooltip_icon { .mx_InfoTooltip_icon {
margin-right: 4px; margin-right: 4px;
position: relative;
vertical-align: text-top;
&::before {
position: absolute;
top: 0;
left: 0;
}
} }
} }
} }
.mx_SpaceRoomDirectory_roomTile_info { .mx_SpaceRoomDirectory_roomTile_info {
font-size: $font-12px; font-size: $font-13px;
line-height: $font-15px; line-height: $font-18px;
color: $tertiary-fg-color; color: $secondary-fg-color;
grid-row: 2; grid-row: 2;
grid-column: 1/3; grid-column: 1/3;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
} }
.mx_SpaceRoomDirectory_actions { .mx_SpaceRoomDirectory_actions {
@ -232,9 +245,9 @@ limitations under the License.
grid-row: 1/3; grid-row: 1/3;
.mx_AccessibleButton { .mx_AccessibleButton {
padding: 6px 18px; padding: 8px 18px;
display: inline-block;
display: none; visibility: hidden;
} }
.mx_Checkbox { .mx_Checkbox {
@ -248,7 +261,7 @@ limitations under the License.
background-color: $groupFilterPanel-bg-color; background-color: $groupFilterPanel-bg-color;
.mx_AccessibleButton { .mx_AccessibleButton {
display: inline-block; visibility: visible;
} }
} }
} }