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

improve button style when focused

Browse source
This commit is contained in:
dkanada 2019-09-06 22:33:15 -07:00
parent 52136b57a2
commit 54ca2e9381
22 changed files with 148 additions and 196 deletions
Download patch file Download diff file Expand all files Collapse all files

26
src/components/themes/appletv/theme.css
View file

@ -71,13 +71,12 @@ html {
background: #f0f0f0
}
.paper-icon-button-light:hover {
.paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc;
background-color: rgba(0,164,220, .2);
transition: 0.2s;
}
.paper-icon-button-light:focus {
.paper-icon-button-light.show-focus:focus {
color: #00a4dc;
}
@ -341,24 +340,25 @@ html {
color: #fff
}
.emby-button-focusscale:focus {
.emby-button.show-focus:focus {
background: #00a4dc;
color: #fff
}
.emby-tab-button {
color: #999;
color: rgba(0, 0, 0, .5)
}
.emby-tab-button-active,
.emby-tab-button-active.emby-button-tv {
color: #fff
}
.emby-tab-button.emby-button-tv:focus {
.emby-tab-button-active {
color: #fff;
}
.emby-tab-button.show-focus:focus {
color: #fff;
}
.emby-tab-button:hover {
color: #fff;
background: 0 0
}
.channelPrograms,
@ -413,7 +413,7 @@ html {
color: #00a4dc
}
.guide-date-tab-button.emby-button-tv:focus {
.guide-date-tab-button.show-focus:focus {
background-color: #00a4dc;
color: #fff
}

17
src/components/themes/blueradiance/theme.css
View file

@ -58,13 +58,12 @@ html {
}
}
.paper-icon-button-light:hover {
.paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc;
background-color: rgba(0,164,220, .2);
transition: 0.2s;
}
.paper-icon-button-light:focus {
.paper-icon-button-light.show-focus:focus {
color: #00a4dc;
}
@ -327,27 +326,25 @@ html {
color: #fff
}
.emby-button-focusscale:focus {
.emby-button.show-focus:focus {
background: #00a4dc;
color: #fff
}
.emby-tab-button {
color: #999;
color: rgba(255, 255, 255, .4)
}
.emby-tab-button-active {
color: #00a4dc
}
.emby-tab-button-active.emby-button-tv {
color: #fff
.emby-tab-button.show-focus:focus {
color: #00a4dc;
}
.emby-tab-button.emby-button-tv:focus {
.emby-tab-button:hover {
color: #00a4dc;
background: 0 0
}
.channelPrograms,
@ -401,7 +398,7 @@ html {
color: #00a4dc
}
.guide-date-tab-button.emby-button-tv:focus {
.guide-date-tab-button.show-focus:focus {
background-color: #00a4dc;
color: #fff
}

28
src/components/themes/dark/theme.css
View file

@ -39,13 +39,12 @@ html {
background-color: rgba(0, 0, 0, .86)
}
.paper-icon-button-light:hover {
.paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc;
background-color: rgba(0,164,220, .2);
transition: 0.2s;
}
.paper-icon-button-light:focus {
.paper-icon-button-light.show-focus:focus {
color: #00a4dc;
}
@ -304,28 +303,25 @@ html {
color: #fff
}
.emby-button-focusscale:focus {
.emby-button.show-focus:focus {
background: #00a4dc;
color: #fff
}
.emby-tab-button {
color: #999;
color: rgba(255, 255, 255, .4)
}
.emby-tab-button-active {
color: #fff
}
.emby-tab-button-active.emby-button-tv {
color: #999;
color: rgba(255, 255, 255, .4)
}
.emby-tab-button.emby-button-tv:focus {
color: #fff;
background: 0 0
}
.emby-tab-button.show-focus:focus {
color: #00a4dc;
}
.emby-tab-button:hover {
color: #00a4dc;
}
.channelPrograms,
@ -379,7 +375,7 @@ html {
color: #00a4dc
}
.guide-date-tab-button.emby-button-tv:focus {
.guide-date-tab-button.show-focus:focus {
background-color: #00a4dc;
color: #fff
}

27
src/components/themes/emby/theme.css
View file

@ -39,13 +39,12 @@ html {
background-color: rgba(0, 0, 0, .86)
}
.paper-icon-button-light:hover {
.paper-icon-button-light:hover:not(:disabled) {
color: #52b54b;
background-color: rgba(82, 181, 75, .2);
transition: 0.2s;
}
.paper-icon-button-light:focus {
.paper-icon-button-light.show-focus:focus {
color: #52b54b;
}
@ -304,27 +303,25 @@ html {
color: #fff
}
.emby-button-focusscale:focus {
.emby-button.show-focus:focus {
background: #52b54b;
color: #fff
}
.emby-tab-button {
color: #999;
color: rgba(255, 255, 255, .4)
}
.emby-tab-button-active {
color: #52b54b
}
.emby-tab-button-active.emby-button-tv {
color: #fff
}
.emby-tab-button.emby-button-tv:focus {
color: #52b54b;
background: 0 0
}
.emby-tab-button.show-focus:focus {
color: #52b54b;
}
.emby-tab-button:hover {
color: #52b54b;
}
.channelPrograms,
@ -378,7 +375,7 @@ html {
color: #52b54b
}
.guide-date-tab-button.emby-button-tv:focus {
.guide-date-tab-button.show-focus:focus {
background-color: #52b54b;
color: #fff
}

27
src/components/themes/light/theme.css
View file

@ -55,13 +55,12 @@ html {
background-color: #f0f0f0
}
.paper-icon-button-light:hover {
.paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc;
background-color: rgba(0,164,220, .2);
transition: 0.2s;
}
.paper-icon-button-light:focus {
.paper-icon-button-light.show-focus:focus {
color: #00a4dc;
}
@ -323,27 +322,25 @@ html {
color: #fff
}
.emby-button-focusscale:focus {
.emby-button.show-focus:focus {
background: #00a4dc;
color: #fff
}
.emby-tab-button {
color: #999;
color: rgba(255, 255, 255, .5)
}
.emby-tab-button-active {
color: #00a4dc
}
.emby-tab-button-active.emby-button-tv {
color: #fff
}
.emby-tab-button.emby-button-tv:focus {
color: #00a4dc;
background: 0 0
}
.emby-tab-button.show-focus:focus {
color: #00a4dc;
}
.emby-tab-button:hover {
color: #00a4dc;
}
.channelPrograms,
@ -397,7 +394,7 @@ html {
color: #00a4dc
}
.guide-date-tab-button.emby-button-tv:focus {
.guide-date-tab-button.show-focus:focus {
background-color: #00a4dc;
color: #fff
}

23
src/components/themes/purple-haze/theme.css
View file

@ -58,13 +58,12 @@ html {
}
}
.paper-icon-button-light:hover {
.paper-icon-button-light:hover:not(:disabled) {
color: rgb(12, 232, 214);
background-color: rgba(0,164,220, .2);
transition: 0.2s;
}
.paper-icon-button-light:focus {
.paper-icon-button-light.show-focus:focus {
color: #ff77f1;
}
@ -420,27 +419,25 @@ a[data-role=button] {
color: #f8f8fe
}
.emby-button-focusscale:focus {
.emby-button.show-focus:focus {
background: #8ae9c1;
color: #f8f8fe
}
.emby-tab-button {
color: #999;
color: rgba(255, 255, 255, .4)
}
.emby-tab-button-active {
color: #f8f8fe
color: #f8f8fe;
}
.emby-tab-button-active.emby-button-tv {
color: #f8f8fe
}
.emby-tab-button.emby-button-tv:focus {
.emby-tab-button.show-focus:focus {
color: #ff77f1;
}
.emby-tab-button:hover {
color: #ff77f1;
background: 0 0
}
.channelPrograms,
@ -494,7 +491,7 @@ a[data-role=button] {
color: #ff77f1
}
.guide-date-tab-button.emby-button-tv:focus {
.guide-date-tab-button.show-focus:focus {
background-color: #48C3C8;
color: #fff
}

20
src/components/themes/wmc/theme.css
View file

@ -64,13 +64,12 @@ html {
background: rgba(17, 98, 164, .9)
}
.paper-icon-button-light:hover {
.paper-icon-button-light:hover:not(:disabled) {
color: #00a4dc;
background-color: rgba(0,164,220, .2);
transition: 0.2s;
}
.paper-icon-button-light:focus {
.paper-icon-button-light.show-focus:focus {
color: #00a4dc;
}
@ -325,24 +324,25 @@ html {
color: #fff
}
.emby-button-focusscale:focus {
.emby-button.show-focus:focus {
background: #00a4dc;
color: #fff
}
.emby-tab-button {
color: #999;
color: rgba(255, 255, 255, .5)
}
.emby-tab-button-active,
.emby-tab-button-active.emby-button-tv {
.emby-tab-button-active {
color: #fff
}
.emby-tab-button.emby-button-tv:focus {
.emby-tab-button.show-focus:focus {
color: #fff;
}
.emby-tab-button:hover {
color: #fff;
background: 0 0
}
.channelPrograms,
@ -397,7 +397,7 @@ html {
color: #00a4dc
}
.guide-date-tab-button.emby-button-tv:focus {
.guide-date-tab-button.show-focus:focus {
background-color: #00a4dc;
color: #fff
}