From 76d32181301ade63f1cdcf331d325ab0ffeae717 Mon Sep 17 00:00:00 2001
From: Ian Richardson <iantrich@gmail.com>
Date: Wed, 2 Oct 2019 06:33:16 -0500
Subject: [PATCH] Allow user selection of text in Lovelace (#3605)

* Allow user selection of text in Lovelace

Closes https://github.com/home-assistant/home-assistant-polymer/issues/2110

* set negative tabindex

This appears to work locally, but pushing it up to try on the demo to be sure

* toggle class for android

* apply suggestions
---
 src/panels/lovelace/hui-root.ts | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/panels/lovelace/hui-root.ts b/src/panels/lovelace/hui-root.ts
index 7788d24116..e01f7ddfe1 100644
--- a/src/panels/lovelace/hui-root.ts
+++ b/src/panels/lovelace/hui-root.ts
@@ -73,6 +73,14 @@ class HUIRoot extends LitElement {
     );
   }
 
+  protected firstUpdated(changedProperties: PropertyValues): void {
+    super.firstUpdated(changedProperties);
+    this.classList.toggle(
+      "disable-text-select",
+      /Chrome/.test(navigator.userAgent) && /Android/.test(navigator.userAgent)
+    );
+  }
+
   protected render(): TemplateResult | void {
     return html`
     <app-route .route="${this.route}" pattern="/:view" data="${
@@ -298,11 +306,14 @@ class HUIRoot extends LitElement {
       haStyle,
       css`
         :host {
+          --dark-color: #455a64;
+          --text-dark-color: #fff;
+        }
+
+        :host(.disable-text-select) {
           -ms-user-select: none;
           -webkit-user-select: none;
           -moz-user-select: none;
-          --dark-color: #455a64;
-          --text-dark-color: #fff;
         }
 
         ha-app-layout {