browser/extensions/webcompat/injections/css/bug1605611-maps.google.com-directions-time.css


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

/**
 * Bug 1605611 - Cannot change Departure/arrival dates in Google Maps on Android
 *
 * This is step 3 - see injections/js/bug1605611-maps.google.com-directions-time.js.
 * Google Maps calls .click() on a datetime-local input element, with the intent
 * to show the native date picker. But the native date picker does not appear,
 * because that only happens when a user initiated the click.
 * To fix the problem of the date picker not appearing in Google Maps, alter the
 * styles of the datetime-local input element, to be rendered on top of the
 * usual UI (i.e. the icon and date/time text). This allows the user to summon
 * the native date picker when they tap on the relevant UI in Google Maps.
 */

.ml-route-options-picker-content-button
  > #ml-route-options-time-selector-time-input {
  z-index: 1; /* overrides -5000, to show on top of the icon AND the rendered date */
  opacity: 0; /* let the input element be fully transparent */
  width: 100vw; /* render over the rendered date from Maps' dialog */
  /* position this (absolute) element to fully cover the parent container */
  left: 0;
  bottom: 0;
  top: 0;
  height: 100%;
}