-
-
Notifications
You must be signed in to change notification settings - Fork 830
Add width to roomTile_nameStack in _InviteDialog.scss #8092
Conversation
@@ -195,6 +195,7 @@ limitations under the License. | |||
.mx_InviteDialog_roomTile_nameStack { | |||
display: inline-block; | |||
overflow: hidden; | |||
width: calc(70%); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
why 70%?
There was a problem hiding this comment.
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.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
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.
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.
I am not sure if ellipsis functionality should be enabled here from the perspective of UX, though.
There was a problem hiding this comment.
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.
Codecov Report
@@ Coverage Diff @@
## develop #8092 +/- ##
========================================
Coverage 26.66% 26.66%
========================================
Files 870 870
Lines 52166 52166
Branches 13217 13217
========================================
Hits 13910 13910
Misses 38256 38256 |
@SpookyDooky I wanted to check in if you're intending to update your PR with the requested changes? If not, we'd like to unassign the issue in case anyone else would like to pick it up 👍 |
This PR fixes vector-im/element-web#19463 by adding a width to
roomTile_namestack
in_InviteDialgo.scss
.Before:
After:
Please add the T-Defect label.
Signed-off-by: Raymond d'Anjou [email protected]
Here's what your changelog entry will look like:
🐛 Bug Fixes
Preview: https://pr8092--matrix-react-sdk.netlify.app
⚠️ Do you trust the author of this PR? Maybe this build will steal your keys or give you malware. Exercise caution. Use test accounts.