Problem/Motivation
Originally found in #3331424: Drop -moz- vendor prefixed properties and then discussed in Slack with @alexpott, @mherchel and @andy-blum.
In toolbar's CSS we have the following non-standard properties:
-moz-tap-highlight-color: rgba(0, 0, 0, 0);
-o-tap-highlight-color: rgba(0, 0, 0, 0);
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
tap-highlight-color: rgba(0, 0, 0, 0);
-moz-touch-callout: none;
-o-touch-callout: none;
-webkit-touch-callout: none;
touch-callout: none;
These were originally introduced in an early prototype of the toolbar CSS in #1137920: Fix toolbar on small screen sizes and redesign toolbar for desktop
These properties are currently only supported by Safari on iOS, with the -webkit- vendor prefix, and even then we are not sure that they do anything useful.
https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-touch-callout
https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-tap-highlight-c...
Steps to reproduce
Proposed resolution
Remove these properties.
Check for regressions on iOS.
If the properties are useful:
- Keep only the
-webkit-
prefixed versions. - Add a comment explaining what the properties do.
Comments
Comment #2
andy-blumNote that these toolbar styles are also in Claro: https://git.drupalcode.org/project/drupal/-/blob/10.1.x/core/themes/clar...
Comment #3
longwaveComment #7
longwaveAdding issue credits for discussion and also @Spokje who created duplicates of this issue at the same time.