-
-
Notifications
You must be signed in to change notification settings - Fork 50
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
Text panel obscures map and pin on mobile, off-center on desktop #2168
Comments
Changed title, added some text, added formatting (using markdown https://github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet) and inserted the screenshot and video into the issue itself (better for easy reference - drag and drop or attach those media files). Also tagged it for devs to look at. |
The map seems to center itself as if the text panel is at its smallest size — and with the current public and dev versions, the text panel is maximized, completely covering the highlighted pins. The map it seems to ignore the text panel’s existence — the map should instead calculate its visible area and center itself using that. |
Hi Guys. I checked the devla.foodoasis.net site : this is what I am experiencing still: The icons are nonresponsive at times. And they are still NOT CENTERED in the selected location in the mobile version. Please the clip attached FOLA-BUG_.PIN.issue.mp4 |
@Shienny1 could you please add that comment to
I’ve reopened this issue so we don’t lose track of it but I believe it’s the same problem as that one. |
severity 5/5
Near impossible to see location on map on mobile devices
Maps are centered as if text panel doesn’t exist leading to obscured or weird alignments. Map should center using its visible area, not the entire screen.
Problem:
On mobile, tapping a result to get details loads org detail view, but layout of split screen obscures map and pin, and pin is off-screen.
Desktop has a similar problem.
To reproduce the desktop version of this bug:
From landing page, enter an address. On desktop, map Pin appears in the correct place at first.
![IMG_1253](https://private-user-images.githubusercontent.com/3376957/350647829-cf8cc736-3d32-4d47-b1df-c11b90211b6e.jpeg?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQzMjk5NzksIm5iZiI6MTcyNDMyOTY3OSwicGF0aCI6Ii8zMzc2OTU3LzM1MDY0NzgyOS1jZjhjYzczNi0zZDMyLTRkNDctYjFkZi1jMTFiOTAyMTFiNmUuanBlZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODIyVDEyMjc1OVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTBiNzZkYTliODlkNjJmNzg2ZTRlM2QzNjBiZGE2ODEwMzcwM2ZlZDAyMTZlZDg0MjFkNzQ4MzY4MDQ3OGY1MDQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.XsHkR7FcB0MGKlnT8MXkZO2jznGAK5KaZOMkHNP1jus)
Do a search again from the map page and the map now re-centers in the wrong place.
![IMG_1252](https://private-user-images.githubusercontent.com/3376957/350647840-8f2c2963-54e4-4f92-8cde-400a22217782.jpeg?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQzMjk5NzksIm5iZiI6MTcyNDMyOTY3OSwicGF0aCI6Ii8zMzc2OTU3LzM1MDY0Nzg0MC04ZjJjMjk2My01NGU0LTRmOTItOGNkZS00MDBhMjIyMTc3ODIuanBlZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjIlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODIyVDEyMjc1OVomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTk1ZThkMGRkM2Y2NTQyMDcyM2NmNWQ0NDVjZWU2ODNlNzU0YWJjZGQzZDVkMDM0NzFiMGRlYjBkN2Y1YTNjN2UmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.SA6OmXZliXA--yVJZIe8CqvROvKfUG4Ws0M4zrXypMA)
To it might have something to do with loading the page for the first time vs going to a new location
User goal:
to get see the cross streets of the location indicated on the map so i tap on the icon
my expectation:
To zoom in to that specific location and see more information of the name and hours of operation (maybe covering maximum bottom half, and leave the upper half of the screen on the map showing the selected location zoomed in.
actual result:
80% screen covered by TEXT on location's information etc. Covering the map.
So I swipe down to open the window to map again.
BUT the map window has migrated to a different location, no where close to the selected location.
screenshots and video
Devlasite_Textpanel.on.Map.mov
ScreenRecording_07-19-2024.17-15-01_1.mp4
possible solutions
make map larger - see figma designs - I believe it’s supposed to be 50% text at first? — Bryan
Ensure that with new split-screen view that pin is centered in map viewport at first load. This might mean calculating visible map and centering it as text panel is resized.
for example if text is 80% of screen, map is remaining 20% and pin should be at approx 10%.
Ideally the selected pin and the user’s location are both visible on the map at the same time. This will give them a sense of location relative to where they are now.
Stretch goal: if pin is centered, then keep it centered as user resizes text panel.
related issues
The text was updated successfully, but these errors were encountered: