MLocationBody 'Expand map' z-index stacks over message composer

[kerryarchibald]

Steps to reproduce

1. Share a location, then post a few normal messages below so you can scroll the chat timeline down
2. Scroll the chat timeline so the map and the message composer overlap
3. Hover on the map, notice the 'expand map' stacks over the message composer

Screen.Recording.2022-04-01.at.08.40.49.mov

Outcome

What did you expect?

What happened instead?

Operating system

No response

Browser information

No response

URL for webapp

No response

Application version

No response

Homeserver

No response

Will you send logs?

No

[goelesha]

@kerryarchibald Can you pls elaborate more on the issue.
I tried reproducing the issue but the expand map z index stacks within the map for me, as shown below.

[kerryarchibald]

Hi @goelesha, I've updated the description to be more clear, hope that helps!

[goelesha]

Hi @goelesha, I've updated the description to be more clear, hope that helps!

Hi, @kerryarchibald Yeah I am able to reproduce the issue on the hosted version of the app. But on localhost, I see this error "Unable to load map: This homeserver is not configured to display maps."

I would like to work on this issue. Can you help me with how can I reproduce the issue on localhost.

[kerryarchibald]

@goelesha Ah yes, you need to configure the map_style_url in your element-web config.json, check the docs for it here: https://github.com/vector-im/element-web/blob/develop/docs/config.md
I use the same one as suggested in the docs https://api.maptiler.com, you'll need to sign up to get an api key.

If you have any more questions or sticky points please reach out in https://matrix.to/#/#element-dev:matrix.org

[goelesha]

@goelesha Ah yes, you need to configure the map_style_url in your element-web config.json, check the docs for it here: https://github.com/vector-im/element-web/blob/develop/docs/config.md I use the same one as suggested in the docs https://api.maptiler.com, you'll need to sign up to get an api key.

If you have any more questions or sticky points please reach out in https://matrix.to/#/#element-dev:matrix.org

Noted @kerryarchibald
Kindly assign this issue to me. I would like to work on it.
Thanks!

[goelesha]

@kerryarchibald can you pls guide me.

I am confused about how to edit the properties of tooltip. In MBodyLocation.tsx the tooltip is displayed using TooltipTarget. If I change the properties of Tooltiptarget then it would change all the tooltips.
I want to seek help on what would be a nice approach to handle the issue.

I posted the same msg on public chat also but didn't receive any response.