Skip to content

Long username overflows on profile page #6880

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
di opened this issue Oct 18, 2019 · 10 comments · Fixed by #6886
Closed

Long username overflows on profile page #6880

di opened this issue Oct 18, 2019 · 10 comments · Fixed by #6886
Labels
CSS/SCSS requires change to CSS/SCSS files UX/UI design, user experience, user interface

Comments

@di
Copy link
Member

di commented Oct 18, 2019

A sufficiently long username overflows on the user's profile page:

Screen Shot 2019-10-18 at 4 06 31 PM

This will become more of a problem once #5944 is resolved and email addresses appear here as well.

@di di added UX/UI design, user experience, user interface CSS/SCSS requires change to CSS/SCSS files labels Oct 18, 2019
@sargamm
Copy link
Contributor

sargamm commented Oct 19, 2019

I would like to work on this

@sargamm
Copy link
Contributor

sargamm commented Oct 19, 2019

@di I figured out that the overflow property of the author-profile needs to be changed, what would you like me to add a scrollbar option for the same so that the a longer user name can be seen properly and also an email address if visible(the issue that is being worked upon)?

@sargamm
Copy link
Contributor

sargamm commented Oct 20, 2019

I have made a pull request #6886 for the same. Please have a look!

@di
Copy link
Member Author

di commented Oct 21, 2019

I'm not sure adding a scrollbar is the right approach here. For example, this is what Github does:

Screen Shot 2019-10-21 at 11 09 24 AM

  • Full name wraps
  • Username wraps
  • Email truncates with an ellipsis

I think we probably want to do the same thing here, and I think #5944 can handle truncating the email since that is different behavior.

@di di mentioned this issue Oct 21, 2019
@sargamm
Copy link
Contributor

sargamm commented Oct 22, 2019

Okay, so for this I can add the word-wrap property for the required class, and undo the change I made in the overflow property. Does that work?

@di
Copy link
Member Author

di commented Oct 22, 2019

I think that should work.

@sargamm
Copy link
Contributor

sargamm commented Oct 23, 2019

I have made changes, please have a look at the pull request

@sargamm
Copy link
Contributor

sargamm commented Dec 16, 2019

Hi! Sorry for this huge delay, was caught up with my exams and assignments. I was trying to setup the project locally. I am getting an error in the make serve command, it starts with the error - database "warehouse" does not exist. Where is the database "warehouse" being created? How can I resolve this? Please help @di . Thanks!

@di
Copy link
Member Author

di commented Dec 16, 2019

You need to run make initdb first, see the development docs here: https://warehouse.readthedocs.io/development/getting-started/

@sargamm
Copy link
Contributor

sargamm commented Dec 17, 2019

It worked. Thanks you.

@di di closed this as completed in #6886 Jan 14, 2020
di added a commit that referenced this issue Jan 14, 2020
* Update _author-profile.scss

* Update _author-profile.scss

* Update _author-profile.scss

* Update _author-profile.scss

* Update _author-profile.scss

* Use break-all to avoid unnecessary line breaks

Co-authored-by: Dustin Ingram <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CSS/SCSS requires change to CSS/SCSS files UX/UI design, user experience, user interface
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants