Skip to content

User image in user context menu gets squeezed when user name is too long #28

@ThomasKiljanczykDev

Description

@ThomasKiljanczykDev

Problem

We're maintaining an app where the username is often same as email. This causes long usernames which in turn cause squeezed user image.

Below is an example image of the issue:
Image

If the username is short enough, the image is not squeezed. Here's the same user but with artificially shortened username via DevTools:
Image

Additional Information

Our investigation pinpointed the issue to the fact that the image and the username elements are within a flexbox.
The user image is missing flex-shrink: 0 which makes it possible that the image can be forcefully resized if other flexbox element grow too much.

We have implemented a fix for our project via our scss files.
It would be great if it was also applied to the lepton theme package itself.

Below is an example image of our fix:
Image

Metadata

Metadata

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions