From af9bf3320d2cf6d2b9b86f07612b773399e95abf Mon Sep 17 00:00:00 2001 From: Cameron Date: Mon, 31 Aug 2020 10:02:25 +0100 Subject: [PATCH 1/2] Fix hovering (mobile) --- src/themes/appletv/theme.css | 9 ++++++++- src/themes/blueradiance/theme.css | 9 ++++++++- src/themes/dark/theme.css | 9 ++++++++- src/themes/light/theme.css | 9 ++++++++- src/themes/purplehaze/theme.css | 9 ++++++++- src/themes/wmc/theme.css | 9 ++++++++- 6 files changed, 48 insertions(+), 6 deletions(-) diff --git a/src/themes/appletv/theme.css b/src/themes/appletv/theme.css index 41540ce0dd..463065b849 100644 --- a/src/themes/appletv/theme.css +++ b/src/themes/appletv/theme.css @@ -62,7 +62,14 @@ html { background: #f0f0f0; } -.paper-icon-button-light:hover:not(:disabled) { +@media (hover: hover) { + .paper-icon-button-light:hover:not(:disabled) { + color: #00a4dc; + background-color: rgba(0, 164, 220, 0.2); + } +} + +.paper-icon-button-light:active:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2); } diff --git a/src/themes/blueradiance/theme.css b/src/themes/blueradiance/theme.css index 7ecc4a74a5..1c13803034 100644 --- a/src/themes/blueradiance/theme.css +++ b/src/themes/blueradiance/theme.css @@ -64,7 +64,14 @@ html { } } -.paper-icon-button-light:hover:not(:disabled) { +@media (hover: hover) { + .paper-icon-button-light:hover:not(:disabled) { + color: #00a4dc; + background-color: rgba(0, 164, 220, 0.2); + } +} + +.paper-icon-button-light:active:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2); } diff --git a/src/themes/dark/theme.css b/src/themes/dark/theme.css index be2b9269af..15ab434a85 100644 --- a/src/themes/dark/theme.css +++ b/src/themes/dark/theme.css @@ -46,7 +46,14 @@ html { background-color: rgba(0, 0, 0, 0.86); } -.paper-icon-button-light:hover:not(:disabled) { +@media (hover: hover) { + .paper-icon-button-light:hover:not(:disabled) { + color: #00a4dc; + background-color: rgba(0, 164, 220, 0.2); + } +} + +.paper-icon-button-light:active:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2); } diff --git a/src/themes/light/theme.css b/src/themes/light/theme.css index c5161985cd..766dd95359 100644 --- a/src/themes/light/theme.css +++ b/src/themes/light/theme.css @@ -61,7 +61,14 @@ html { color: #000; } -.paper-icon-button-light:hover:not(:disabled) { +@media (hover: hover) { + .paper-icon-button-light:hover:not(:disabled) { + color: #00a4dc; + background-color: rgba(0, 164, 220, 0.2); + } +} + +.paper-icon-button-light:active:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2); } diff --git a/src/themes/purplehaze/theme.css b/src/themes/purplehaze/theme.css index 1d82afc23a..8fe9baae24 100644 --- a/src/themes/purplehaze/theme.css +++ b/src/themes/purplehaze/theme.css @@ -59,7 +59,14 @@ html { } } -.paper-icon-button-light:hover:not(:disabled) { +@media (hover: hover) { + .paper-icon-button-light:hover:not(:disabled) { + color: rgb(12, 232, 214); + background-color: rgba(0, 164, 220, 0.2); + } +} + +.paper-icon-button-light:active:not(:disabled) { color: rgb(12, 232, 214); background-color: rgba(0, 164, 220, 0.2); } diff --git a/src/themes/wmc/theme.css b/src/themes/wmc/theme.css index 4a7375a129..277421e144 100644 --- a/src/themes/wmc/theme.css +++ b/src/themes/wmc/theme.css @@ -62,7 +62,14 @@ html { background: rgba(17, 98, 164, 0.9); } -.paper-icon-button-light:hover:not(:disabled) { +@media (hover: hover) { + .paper-icon-button-light:hover:not(:disabled) { + color: #00a4dc; + background-color: rgba(0, 164, 220, 0.2); + } +} + +.paper-icon-button-light:active:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2); } From fe5ff12cf286cab7386707bd40c7827d8ba756b1 Mon Sep 17 00:00:00 2001 From: Cameron Date: Wed, 2 Sep 2020 10:05:51 +0100 Subject: [PATCH 2/2] Apply Suggestions --- src/themes/appletv/theme.css | 2 +- src/themes/blueradiance/theme.css | 2 +- src/themes/dark/theme.css | 2 +- src/themes/light/theme.css | 2 +- src/themes/purplehaze/theme.css | 2 +- src/themes/wmc/theme.css | 2 +- 6 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/themes/appletv/theme.css b/src/themes/appletv/theme.css index 463065b849..3ea8fa9bce 100644 --- a/src/themes/appletv/theme.css +++ b/src/themes/appletv/theme.css @@ -62,7 +62,7 @@ html { background: #f0f0f0; } -@media (hover: hover) { +@media (hover: hover) and (pointer: fine) { .paper-icon-button-light:hover:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2); diff --git a/src/themes/blueradiance/theme.css b/src/themes/blueradiance/theme.css index 1c13803034..ed4b62dddb 100644 --- a/src/themes/blueradiance/theme.css +++ b/src/themes/blueradiance/theme.css @@ -64,7 +64,7 @@ html { } } -@media (hover: hover) { +@media (hover: hover) and (pointer: fine) { .paper-icon-button-light:hover:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2); diff --git a/src/themes/dark/theme.css b/src/themes/dark/theme.css index 15ab434a85..8bd4417f23 100644 --- a/src/themes/dark/theme.css +++ b/src/themes/dark/theme.css @@ -46,7 +46,7 @@ html { background-color: rgba(0, 0, 0, 0.86); } -@media (hover: hover) { +@media (hover: hover) and (pointer: fine) { .paper-icon-button-light:hover:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2); diff --git a/src/themes/light/theme.css b/src/themes/light/theme.css index 766dd95359..48ceaaddae 100644 --- a/src/themes/light/theme.css +++ b/src/themes/light/theme.css @@ -61,7 +61,7 @@ html { color: #000; } -@media (hover: hover) { +@media (hover: hover) and (pointer: fine) { .paper-icon-button-light:hover:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2); diff --git a/src/themes/purplehaze/theme.css b/src/themes/purplehaze/theme.css index 8fe9baae24..352e569eb5 100644 --- a/src/themes/purplehaze/theme.css +++ b/src/themes/purplehaze/theme.css @@ -59,7 +59,7 @@ html { } } -@media (hover: hover) { +@media (hover: hover) and (pointer: fine) { .paper-icon-button-light:hover:not(:disabled) { color: rgb(12, 232, 214); background-color: rgba(0, 164, 220, 0.2); diff --git a/src/themes/wmc/theme.css b/src/themes/wmc/theme.css index 277421e144..e97bdc171b 100644 --- a/src/themes/wmc/theme.css +++ b/src/themes/wmc/theme.css @@ -62,7 +62,7 @@ html { background: rgba(17, 98, 164, 0.9); } -@media (hover: hover) { +@media (hover: hover) and (pointer: fine) { .paper-icon-button-light:hover:not(:disabled) { color: #00a4dc; background-color: rgba(0, 164, 220, 0.2);