Added a hovereffect on listItems for all themes

src/themes/appletv/theme.css

@@ -271,6 +271,14 @@ html {
     background: rgba(0, 0, 0, 0.2);
 }
 
+.listItem:hover {
+    background: rgba(0, 0, 0, 0.1);
+}
+
+.actionSheetMenuItem:hover {
+    background-color: #ddd;
+}
+
 .progressring-spiner {
     border-color: #00a4dc;
 }

src/themes/blueradiance/theme.css

@@ -261,6 +261,14 @@ html {
     background: rgba(0, 0, 0, 0.3);
 }
 
+.listItem:hover {
+    background: rgba(0, 0, 0, 0.15);
+}
+
+.actionSheetMenuItem:hover {
+    background-color: rgba(0, 0, 0, 0.5);
+}
+
 .progressring-spiner {
     border-color: #00a4dc;
 }

src/themes/dark/theme.css

@@ -172,10 +172,6 @@ html {
     opacity: 0.5;
 }
 
-.actionSheetMenuItem:hover {
-    background-color: #242424;
-}
-
 .toast {
     background: #303030;
     color: #fff;
@@ -238,6 +234,10 @@ html {
     background: #333;
 }
 
+.listItem:hover {
+    background: #242424;
+}
+
 .progressring-spiner {
     border-color: #00a4dc;
 }

src/themes/light/theme.css

@@ -200,10 +200,6 @@ html {
     color: #fff;
 }
 
-.actionSheetMenuItem:hover {
-    background-color: #ddd;
-}
-
 .toast {
     background: #303030;
     color: rgba(255, 255, 255, 0.87);
@@ -266,6 +262,10 @@ html {
 }
 
 .listItem:focus {
+    background: #bbb;
+}
+
+.listItem:hover {
     background: #ddd;
 }
 

src/themes/purplehaze/theme.css

@@ -347,6 +347,14 @@ a[data-role=button] {
     background: rgba(0, 0, 0, 0.3);
 }
 
+.listItem:hover {
+    background: #12122f;
+}
+
+.actionSheetMenuItem:hover {
+    background-color: rgba(0, 0, 0, 0.5);
+}
+
 .progressring-spiner {
     border-color: #48c3c8;
 }

src/themes/wmc/theme.css

@@ -241,7 +241,11 @@ html {
 }
 
 .listItem:focus {
-    background: #333;
+    background: rgba(0, 0, 0, 0.2);
+}
+
+.listItem:hover {
+    background: rgba(0, 0, 0, 0.4);
 }
 
 .progressring-spiner {