disable webkit tap highlight color on all elements

Nerwyn · Jul 28, 2024 · 32f55e8 · 32f55e8
1 parent 28193c7
commit 32f55e8
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 2 deletions.
diff --git a/dist/android-tv-card.min.js b/dist/android-tv-card.min.js
diff --git a/src/android-tv-card.ts b/src/android-tv-card.ts
@@ -804,6 +804,7 @@ class AndroidTVCard extends LitElement {
 				padding: 12px;
 
 				-webkit-tap-highlight-color: transparent;
+				-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 				--md-ripple-hover-opacity: var(--ha-ripple-hover-opacity, 0.08);
 				--md-ripple-pressed-opacity: var(
 					--ha-ripple-pressed-opacity,

diff --git a/src/classes/base-remote-element.ts b/src/classes/base-remote-element.ts
@@ -789,6 +789,8 @@ export class BaseRemoteElement extends LitElement {
 				overflow: visible;
 				font-size: inherit;
 				color: inherit;
+				-webkit-tap-highlight-color: transparent;
+				-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 			}
 			ha-icon,
 			svg {

diff --git a/src/classes/keyboard-dialog.ts b/src/classes/keyboard-dialog.ts
@@ -536,6 +536,11 @@ export class KeyboardDialog extends LitElement {
 
 	static get styles() {
 		return css`
+			:host {
+				-webkit-tap-highlight-color: transparent;
+				-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+			}
+
 			dialog {
 				height: 0px;
 				width: 0px;