Skip to content
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

Longer blog name breaks mobile in post list #225

Closed
szpak opened this issue Mar 9, 2020 · 7 comments
Closed

Longer blog name breaks mobile in post list #225

szpak opened this issue Mar 9, 2020 · 7 comments

Comments

@szpak
Copy link
Contributor

szpak commented Mar 9, 2020

Settings longer xx.title in languages.toml causes incorrect page width on /posts/. It seems that the breadcrumb is not properly limited according to the window size (especially visible on mobile - swipe left):
https://blog.solidsoft.pl/posts/

The problem doesn't occur on the single post view, where the breadcrumb behaves correctly:
https://blog.solidsoft.pl/2020/03/02/enable-java-14-preview-features-in-gradle-maven-and-idea/

Btw, it just a version, WITHOUT changes from from #221.

@zzossig
Copy link
Owner

zzossig commented Mar 9, 2020

incorrect page width

What do you mean the incorrect page width?
I checked the blog but the width seems to look normal
주석 2020-03-09 182840

Did you mean the white space in the screenshot?
주석 2020-03-09 183132

@szpak
Copy link
Contributor Author

szpak commented Mar 9, 2020

Yes, the whitespace, but not only in the screenshot. In the Firefox mobile I can just swipe right to see it. And without that not the whole text is visible.

image

image

With Firefox desktop (with the narrow window) I cannot swipe, but the problem with text out-of-the-screen it present.

@szpak
Copy link
Contributor Author

szpak commented Mar 9, 2020

The same breadcrumb (which is missing in your screenshots for some reason), in the single post view behaves correctly:
image

@zzossig
Copy link
Owner

zzossig commented Mar 9, 2020

Yes, when I made display: none, it works as expected.
I'll update soon

zzossig added a commit that referenced this issue Mar 9, 2020
szpak added a commit to szpak/hugo-theme-zzo that referenced this issue Mar 9, 2020
The new title was used in the breadcrumb.
Too long name breaks displaying on mobile:
zzossig#225
@zzossig
Copy link
Owner

zzossig commented Mar 9, 2020

Can you check again?
I just truncated the long site name to 150px

@szpak
Copy link
Contributor Author

szpak commented Mar 9, 2020

Not really :-/

On desktop:
image

Maybe I will just shorten the name of my blog ;-)

@zzossig
Copy link
Owner

zzossig commented Mar 10, 2020

Maybe I will just shorten the name of my blog ;-)

Yes, I think it is the best way for now.
I tried some things but the CSS not working uniformly over cross-browser.
I'm closing this issue as I won't fix it.

@zzossig zzossig closed this as completed Mar 10, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants