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

Displays incorrectly on iPad #275

Open
Resonanz opened this issue Mar 5, 2020 · 4 comments
Open

Displays incorrectly on iPad #275

Resonanz opened this issue Mar 5, 2020 · 4 comments
Labels

Comments

@Resonanz
Copy link

Resonanz commented Mar 5, 2020

The black header bar displays incorrectly on iPad in landscape mode. The magnifying glass in the search box is not situated correctly, and the Twitter and github icons on the right hand side are not aligned correctly in the vertical direction.

@coliff coliff added the bug label Mar 27, 2020
@davidsneighbour
Copy link
Contributor

Please add a screenshot?

@stale
Copy link

stale bot commented Dec 25, 2020

This issue has been automatically marked as stale because it has not had recent activity. The resources of the Hugo team are limited, and so we are asking for your help.
If you still think this is important, please tell us why.
This issue will automatically be closed in the near future if no further activity occurs. Thank you for all your contributions.

@polarweasel
Copy link

Here's a screenshot from today, on an iPad Air 2 running iOS 15.4. Note the overlap of the search input field and the Twitter and GitHub icons.

IMG_0453

@thewheat
Copy link

thewheat commented Oct 1, 2022

I believe this can be replicated in Chrome dev tools as shown below

image

It seems just a minor overlap to me and I'm not sure what would the best way to tackle it: tried a couple of ways but there are issues and I think leaving this as is would be a minor thing since it is a slight overlap at the end of the box


Option 1) Reduce padding of social to 0

Issue that is looks odd to me without padding

https://github.com/thewheat/hugoDocs/pull/new/fix-ipad-display-option-1

image


Option 2) Add right padding to the search bar so that there is space without overlapping

https://github.com/gohugoio/hugoDocs/compare/master...thewheat:hugoDocs:fix-ipad-display-option-2?expand=1

image

Caveat with this is that at 1024px the search is now on a second line
image


Option 3) Reduce right margin of menu items to allow extra space without overlap

This probably has the least caveats but there is still a very slight overlap and things feel a bit more cramped and if the menu items change to be longer it would still overlap

https://github.com/gohugoio/hugoDocs/compare/master...thewheat:hugoDocs:fix-ipad-display-option-3?expand=1

image


Am open to other suggestions that I can try test out

@jmooring jmooring transferred this issue from gohugoio/hugoDocs Nov 6, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

5 participants