Open rachelfwells opened 10 years ago
![Uploading photo 3.PNG . . .]()
Header - simplest solution was to reduce the size to ensure that the left and right text don't collide and displace subsequent elements on the header.
Thanks Sam
Sent from my iPhone
On 25 Apr 2014, at 7:29 am, samadd notifications@github.com wrote:
Header - simplest solution was to reduce the size to ensure that the left and right text don't collide and displace subsequent elements on the header.
— Reply to this email directly or view it on GitHub.
Okay, grabbed the ipad to check the stuff that isn't related to sizing / layout.
Although on desktop Chrome, the widths were adequate to avoid collisions before the layout becomes a vertical stack, it was a few pixels out on the iPad vertical layout. Fixed now. No more displacement.
The iPad was picking up the phone number and auto-rendering it as a click-to-call link, and thus dark blue! I've over-ridden that.
Also, iOS-specific was the rounding of input fields by default. Again, I've over-ridden and set the search fields borders to square.
Brilliant. Thank you
Sent from my iPhone
On 25 Apr 2014, at 8:03 am, samadd notifications@github.com wrote:
Okay, grabbed the ipad to check the stuff that isn't related to sizing / layout.
Although on desktop Chrome, the widths were adequate to avoid collisions before the layout becomes a vertical stack, it was a few pixels out on the iPad vertical layout. Fixed now. No more displacement.
The iPad was picking up the phone number and auto-rendering it as a click-to-call link, and thus dark blue! I've over-ridden that.
Also, iOS-specific was the rounding of input fields by default. Again, I've over-ridden and set the search fields borders to square.
— Reply to this email directly or view it on GitHub.
All looks great except one last thing.
The product menu seems to be pushed down on iPad mini
Tricky to debug this one - really the product menu shouldn't appear in this case as the mobile menu icon is in view. Seems to be a consequence of differing measurements being used to determine which layout to present, and it's displaying both.
I've applied a kind of hacky fix. On the ipad mini on that view, it should just show the mobile menu and not allow the mega menu to (mis)display. At least, where I could reproduce it by careful browser re-sizing, it no longer occurs for me.
So give it a quick check and see!
Responsive issues similar to iphone. The screen grabs below are from an ipad mini -
home page - ipad is vertical • Mega menu • Header - logo/search and menu icons are displaced • search button doesnt meet up with green search icon • text on slider images too big and gets truncated
ipad is horizontal • Phone number missing - can the size be reduced? • search button doesnt meet up with green search icon • text on slider images too big and gets truncated
mega menu does work here. yay