In Google Maps, why did Google use back arrow icon instead of "X" close for search results list when its clearly a layer on top of the main interface?

Question

I've been getting into Material design lately, and I really liked one of the material concepts, and thats to think of the UI in X,Y,Z axis. But noticed a discrepancy with what might be extremely trivial but its confusing me right now.

According to Google's own Material Design docs, there's a sense of elevation on how things are arranged on the screen and its relation to other screens here

But for some reason on Google Maps, when you type to search for something like "KFC", the search results list is clearly above the interface yet it's treated as if its on the same plane with the back button instead of an "X".

Can someone explain why they might have done that? or if its an oversight?

Answer 1

It seems like you're asking two things:

1. Why was the ← used instead of ×?
2. Why is this search bar z-indexed above the other content?

RE: Question 1

In Material Design, × represents "clear" in text fields, and "close" elsewhere. If the header maintains the search functionality (as indicated by the 🔍), then you can't have 2 × to mean two different things.

RE: Question 2

See the following screens:

^{download bmml source – Wireframes created with Balsamiq Mockups}

In the app, observe the motion when the bar comes in for that final state. The top search bar is z-indexed above everything. The list of results is z-indexed above the map.

Hope that helps.