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

Top navigation is too wide to fit #632

Closed
Carpetsmoker opened this Issue Jan 2, 2019 · 5 comments

Comments

Projects
None yet
4 participants
@Carpetsmoker
Copy link

Carpetsmoker commented Jan 2, 2019

Currently the top navbar looks like this to me, since I reached a triple-digit karma:

2019-01-03-125125_1685x106_scrot

Which is rather sub-optimal. The right part of the navbar gets pushed down as it's too wide.


I'm not sure what the best way to fix this is, but one way would be to shorten "Submit story" to "Submit", and "Your Threads to "Threads", possibly with a tooltip to read the full text?

2019-01-03-125150_1674x73_scrot

This should give plenty of space, even for people with longer usernames.

@alanpost

This comment has been minimized.

Copy link
Member

alanpost commented Jan 3, 2019

What device and browser are you using? I'm asking both because it makes confirming platform issues easier but also to ask "can you make the window wider?"

I get the same behavior (a break in the top navigation regardless of window width) on the newest stories page.

@Carpetsmoker

This comment has been minimized.

Copy link

Carpetsmoker commented Jan 3, 2019

I'm using Firefox on Linux (Arch).

It doesn't really depend on the window width, as the container has a maximum width. Here's a full-screen screenshot:

2019-01-03-130441_1920x1080_scrot


The reason you get it on "Newest stories" is because it has the longer "Newest Stories" instead of "Lobsters" on the top-left. Shortening that to "Newest" combined with my previous proposals would fix that.

I actually don't get the break with most pages, as those have the shorter "Home" instead of "Lobsters" in the top-left, which shortens the entire thing just enough to fit. However, if I add just one character to my username in the web inspector it doesn't fit again.

@alanpost

This comment has been minimized.

Copy link
Member

alanpost commented Jan 3, 2019

Perfect, thank you.

I'd rather not shorten or otherwise abbreviate the labels preferring instead to increase or adjust the container size. I'd like top navigation to fit on a single line, however.

@hmadison

This comment has been minimized.

Copy link
Member

hmadison commented Jan 3, 2019

#580 Describes the same issue too. @pushcx posted a good remediation path for the root causes.

@pushcx pushcx added the duplicate label Jan 3, 2019

@pushcx

This comment has been minimized.

Copy link
Member

pushcx commented Jan 3, 2019

Closing in favor of #580, yeah.

@pushcx pushcx closed this Jan 3, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment