mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
Merge pull request #327 from DrPandemic/focus-checkbox
Changes checkboxes focus appearance
This commit is contained in:
commit
dd2cd4ab8a
10 changed files with 67 additions and 61 deletions
|
@ -286,11 +286,19 @@ html {
|
|||
border: .07em solid rgba(0, 0, 0, .158)
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.emby-select-withcolor:focus {
|
||||
border-color: #00a4dc
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.checkboxOutline {
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
|
||||
border-color: #00a4dc;
|
||||
}
|
||||
|
||||
.emby-select-withcolor>option {
|
||||
color: #000;
|
||||
background: #fff
|
||||
|
@ -301,11 +309,7 @@ html {
|
|||
color: #fff
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.emby-checkbox-focushelper {
|
||||
background-color: rgba(0,164,220, .26)
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.itemProgressBarForeground {
|
||||
background-color: #00a4dc
|
||||
}
|
||||
|
|
|
@ -279,15 +279,19 @@ html {
|
|||
color: #fff !important
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline {
|
||||
.emby-checkbox:checked+span+.checkboxOutline {
|
||||
border-color: #00a4dc
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.emby-checkbox-focushelper {
|
||||
background-color: rgba(0,164,220, .26)
|
||||
.emby-checkbox:focus+span+.checkboxOutline {
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
|
||||
border-color: #00a4dc;
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.itemProgressBarForeground {
|
||||
background-color: #00a4dc
|
||||
}
|
||||
|
|
|
@ -264,15 +264,19 @@ html {
|
|||
color: #fff !important
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline {
|
||||
.emby-checkbox:checked+span+.checkboxOutline {
|
||||
border-color: #00a4dc
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.emby-checkbox-focushelper {
|
||||
background-color: rgba(0,164,220, .26)
|
||||
.emby-checkbox:focus+span+.checkboxOutline {
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
|
||||
border-color: #00a4dc;
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.itemProgressBarForeground {
|
||||
background-color: #00a4dc
|
||||
}
|
||||
|
|
|
@ -264,15 +264,19 @@ html {
|
|||
color: #fff !important
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline {
|
||||
.emby-checkbox:checked+span+.checkboxOutline {
|
||||
border-color: #52b54b
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.emby-checkbox-focushelper {
|
||||
background-color: rgba(82, 181, 75, .26)
|
||||
.emby-checkbox:focus+span+.checkboxOutline {
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
|
||||
border-color: #52b54b;
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.itemProgressBarForeground {
|
||||
background-color: #52b54b
|
||||
}
|
||||
|
|
|
@ -272,11 +272,19 @@ html {
|
|||
border: .07em solid rgba(0, 0, 0, .158)
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.emby-select-withcolor:focus {
|
||||
border-color: #00a4dc
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.checkboxOutline {
|
||||
border-color: #000;
|
||||
}
|
||||
|
||||
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
|
||||
border-color: #00a4dc;
|
||||
}
|
||||
|
||||
.emby-select-withcolor>option {
|
||||
color: #000;
|
||||
background: #fff
|
||||
|
@ -287,11 +295,7 @@ html {
|
|||
color: #fff
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.emby-checkbox-focushelper {
|
||||
background-color: rgba(0,164,220, .26)
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.itemProgressBarForeground {
|
||||
background-color: #00a4dc
|
||||
}
|
||||
|
|
|
@ -308,15 +308,19 @@ progress::-webkit-progress-value {
|
|||
color: #fff !important
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline {
|
||||
.emby-checkbox:checked+span+.checkboxOutline {
|
||||
border-color: #48C3C8
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.emby-checkbox-focushelper {
|
||||
background-color: rgba(0,164,220, .26)
|
||||
.emby-checkbox:focus+span+.checkboxOutline {
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
|
||||
border-color: #48C3C8;
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.itemProgressBarForeground {
|
||||
background-color: #48C3C8
|
||||
}
|
||||
|
|
|
@ -266,11 +266,19 @@ html {
|
|||
border: .07em solid rgba(255, 255, 255, .135)
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.emby-select-withcolor:focus {
|
||||
border-color: #00a4dc
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.checkboxOutline {
|
||||
border-color: #fff;
|
||||
}
|
||||
|
||||
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
|
||||
border-color: #00a4dc;
|
||||
}
|
||||
|
||||
.emby-select-withcolor>option {
|
||||
color: #000;
|
||||
background: #fff
|
||||
|
@ -281,11 +289,7 @@ html {
|
|||
color: #fff
|
||||
}
|
||||
|
||||
.emby-checkbox:focus+span+.emby-checkbox-focushelper {
|
||||
background-color: rgba(0,164,220, .26)
|
||||
}
|
||||
|
||||
.emby-checkbox:checked+span+span+.checkboxOutline,
|
||||
.emby-checkbox:checked+span+.checkboxOutline,
|
||||
.itemProgressBarForeground {
|
||||
background-color: #00a4dc
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue