milas/jellyfish-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge pull request #1867 from Camc314/fix-hovering-on-mobile

Browse source 
Fix hovering CSS changes on mobile
This commit is contained in:
dkanada 2020-09-03 23:35:14 +09:00 • committed by GitHub
commit c5223cbc80
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 48 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/themes/appletv/theme.css
View file

@ -66,10 +66,17 @@ html {
background: #f0f0f0; background: #f0f0f0;
} }
@media (hover: hover) and (pointer: fine) {
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc; color: #00a4dc;
background-color: rgba(0, 164, 220, 0.2); 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);
}
.paper-icon-button-light.show-focus:focus { .paper-icon-button-light.show-focus:focus {
color: #00a4dc; color: #00a4dc;

7
src/themes/blueradiance/theme.css
View file

@ -66,10 +66,17 @@ html {
} }
} }
@media (hover: hover) and (pointer: fine) {
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc; color: #00a4dc;
background-color: rgba(0, 164, 220, 0.2); 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);
}
.paper-icon-button-light.show-focus:focus { .paper-icon-button-light.show-focus:focus {
color: #00a4dc; color: #00a4dc;

7
src/themes/dark/theme.css
View file

@ -54,10 +54,17 @@ html {
background-color: rgba(0, 0, 0, 0.86); background-color: rgba(0, 0, 0, 0.86);
} }
@media (hover: hover) and (pointer: fine) {
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc; color: #00a4dc;
background-color: rgba(0, 164, 220, 0.2); 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);
}
.paper-icon-button-light.show-focus:focus { .paper-icon-button-light.show-focus:focus {
color: #00a4dc; color: #00a4dc;

7
src/themes/light/theme.css
View file

@ -69,10 +69,17 @@ html {
color: #000; color: #000;
} }
@media (hover: hover) and (pointer: fine) {
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc; color: #00a4dc;
background-color: rgba(0, 164, 220, 0.2); 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);
}
.paper-icon-button-light.show-focus:focus { .paper-icon-button-light.show-focus:focus {
color: #00a4dc; color: #00a4dc;

7
src/themes/purplehaze/theme.css
View file

@ -62,10 +62,17 @@ html {
} }
} }
@media (hover: hover) and (pointer: fine) {
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
color: rgb(12, 232, 214); color: rgb(12, 232, 214);
background-color: rgba(0, 164, 220, 0.2); 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);
}
.paper-icon-button-light.show-focus:focus { .paper-icon-button-light.show-focus:focus {
color: #ff77f1; color: #ff77f1;

7
src/themes/wmc/theme.css
View file

@ -64,10 +64,17 @@ html {
background: rgba(17, 98, 164, 0.9); background: rgba(17, 98, 164, 0.9);
} }
@media (hover: hover) and (pointer: fine) {
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc; color: #00a4dc;
background-color: rgba(0, 164, 220, 0.2); 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);
}
.paper-icon-button-light.show-focus:focus { .paper-icon-button-light.show-focus:focus {
color: #00a4dc; color: #00a4dc;