Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Add width to roomTile_nameStack in _InviteDialog.scss #8092

Closed
wants to merge 1 commit into from
+1 −0
Closed

Add width to roomTile_nameStack in _InviteDialog.scss #8092

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions res/css/views/dialogs/_InviteDialog.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -195,6 +195,7 @@ limitations under the License.
.mx_InviteDialog_roomTile_nameStack {
display: inline-block;
overflow: hidden;
width: calc(70%);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why 70%?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It was chosen so that the layout remained intact, because if it was set to 100% the name would appear under the users avatar like in the first picture, it would also push the "23 hours ago" underneath the box. Setting it to 70% fixed those issues.

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@turt2live

Copy link
Contributor

@luixxiul luixxiul Mar 26, 2022 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

By setting so, the time strings can be placed under the nameStack due to float and/or text-align stuff.

before

It looks like the display style of roomTile in which they are placed needs changing with flex/grid. From my trial I guess that should be the most straightforward way.

temp

I am not sure if ellipsis functionality should be enabled here from the perspective of UX, though.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The issue with 70% is that the UI cuts off prematurely in the screenshots, so I suspect the change is a bit more involved than what is implied here.

Also, magic numbers like these need comments in the code.

}

.mx_InviteDialog_roomTile_name {
Expand Down