mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Fix declaration-block-trailing-semicolon (CSS)

Browse source
This commit is contained in:
MrTimscampi 2020-01-19 14:49:56 +01:00
parent b2e2cf2012
commit f290604615
21 changed files with 1227 additions and 789 deletions
Download patch file Download diff file Expand all files Collapse all files

126
src/assets/css/dashboard.css
View file

@ -7,11 +7,11 @@
.dashboardFooter { .dashboardFooter {
margin-top: 3.5em; margin-top: 3.5em;
text-align: center text-align: center;
} }
.dashboardFooter a { .dashboardFooter a {
margin: 0 .7em margin: 0 .7em;
} }
progress { progress {
@ -19,32 +19,32 @@ progress {
-moz-appearance: none; -moz-appearance: none;
-webkit-appearance: none; -webkit-appearance: none;
margin: 0; margin: 0;
background: #ccc !important background: #ccc !important;
} }
progress[role]:after { progress[role]:after {
background-image: none background-image: none;
} }
progress::-webkit-progress-bar { progress::-webkit-progress-bar {
background: #ccc background: #ccc;
} }
progress::-moz-progress-bar { progress::-moz-progress-bar {
background-color: #00a4dc background-color: #00a4dc;
} }
progress::-webkit-progress-value { progress::-webkit-progress-value {
background-color: #00a4dc background-color: #00a4dc;
} }
progress[aria-valuenow]:before { progress[aria-valuenow]:before {
border-radius: .4em; border-radius: .4em;
background-color: #00a4dc background-color: #00a4dc;
} }
.localnav { .localnav {
margin-bottom: 2.2em !important margin-bottom: 2.2em !important;
} }
@media all and (min-width:50em) { @media all and (min-width:50em) {
@ -54,24 +54,24 @@ progress[aria-valuenow]:before {
padding-right: 0; padding-right: 0;
padding-left: 0; padding-left: 0;
padding-top: 0; padding-top: 0;
overflow: hidden overflow: hidden;
} }
} }
.dashboardDocument .dashboardEntryHeaderButton, .dashboardDocument .dashboardEntryHeaderButton,
.dashboardDocument .lnkManageServer { .dashboardDocument .lnkManageServer {
display: none !important display: none !important;
} }
.adminDrawerLogo { .adminDrawerLogo {
padding: 1.5em 1em 1.2em; padding: 1.5em 1em 1.2em;
border-bottom: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0;
margin-bottom: 1em; margin-bottom: 1em;
display: block display: block;
} }
.adminDrawerLogo img { .adminDrawerLogo img {
height: 4em height: 4em;
} }
a[data-role=button] { a[data-role=button] {
@ -96,31 +96,31 @@ div[data-role=controlgroup] a[data-role=button] {
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
-webkit-border-radius: 0; -webkit-border-radius: 0;
border-radius: 0 border-radius: 0;
} }
div[data-role=controlgroup] a[data-role=button]:first-child { div[data-role=controlgroup] a[data-role=button]:first-child {
-webkit-border-bottom-left-radius: .3125em; -webkit-border-bottom-left-radius: .3125em;
border-bottom-left-radius: .3125em; border-bottom-left-radius: .3125em;
-webkit-border-top-left-radius: .3125em; -webkit-border-top-left-radius: .3125em;
border-top-left-radius: .3125em border-top-left-radius: .3125em;
} }
div[data-role=controlgroup] a[data-role=button]:last-child { div[data-role=controlgroup] a[data-role=button]:last-child {
-webkit-border-bottom-right-radius: .3125em; -webkit-border-bottom-right-radius: .3125em;
border-bottom-right-radius: .3125em; border-bottom-right-radius: .3125em;
-webkit-border-top-right-radius: .3125em; -webkit-border-top-right-radius: .3125em;
border-top-right-radius: .3125em border-top-right-radius: .3125em;
} }
div[data-role=controlgroup] a[data-role=button]+a[data-role=button] { div[data-role=controlgroup] a[data-role=button]+a[data-role=button] {
border-left-width: 0 !important; border-left-width: 0 !important;
margin: 0 0 0 -.4em !important margin: 0 0 0 -.4em !important;
} }
div[data-role=controlgroup] a.ui-btn-active { div[data-role=controlgroup] a.ui-btn-active {
background: #00a4dc !important; background: #00a4dc !important;
color: #292929 !important color: #292929 !important;
} }
.sessionAppInfo img { .sessionAppInfo img {
@ -130,7 +130,7 @@ div[data-role=controlgroup] a.ui-btn-active {
} }
.appLinks img { .appLinks img {
height: 36px height: 36px;
} }
.wizardContent h2 img { .wizardContent h2 img {
@ -138,46 +138,46 @@ div[data-role=controlgroup] a.ui-btn-active {
vertical-align: middle; vertical-align: middle;
margin-right: .5em; margin-right: .5em;
position: relative; position: relative;
top: -.3em top: -.3em;
} }
.header .imageLink { .header .imageLink {
display: inline-block display: inline-block;
} }
.header .imageLink img { .header .imageLink img {
height: 2.1em; height: 2.1em;
vertical-align: middle vertical-align: middle;
} }
.content-primary { .content-primary {
padding-top: 6em; padding-top: 6em;
padding-right: 1em; padding-right: 1em;
padding-left: 1em padding-left: 1em;
} }
.withTabs .content-primary { .withTabs .content-primary {
padding-top: 9em !important padding-top: 9em !important;
} }
@media all and (min-width:40em) { @media all and (min-width:40em) {
.content-primary { .content-primary {
padding-top: 7em padding-top: 7em;
} }
.withTabs .content-primary { .withTabs .content-primary {
padding-top: 10em !important padding-top: 10em !important;
} }
} }
@media all and (min-width:84em) { @media all and (min-width:84em) {
.withTabs .content-primary { .withTabs .content-primary {
padding-top: 7em !important padding-top: 7em !important;
} }
} }
.content-primary ul:first-child { .content-primary ul:first-child {
margin-top: 0 margin-top: 0;
} }
.dashboardSections { .dashboardSections {
@ -185,7 +185,7 @@ div[data-role=controlgroup] a.ui-btn-active {
display: -webkit-flex; display: -webkit-flex;
display: flex; display: flex;
-webkit-flex-direction: column; -webkit-flex-direction: column;
flex-direction: column flex-direction: column;
} }
.dashboardColumn { .dashboardColumn {
@ -198,7 +198,7 @@ div[data-role=controlgroup] a.ui-btn-active {
flex-shrink: 0; flex-shrink: 0;
-webkit-box-flex: 1; -webkit-box-flex: 1;
-webkit-flex-grow: 1; -webkit-flex-grow: 1;
flex-grow: 1 flex-grow: 1;
} }
.sessionNowPlayingContent { .sessionNowPlayingContent {
@ -210,26 +210,26 @@ div[data-role=controlgroup] a.ui-btn-active {
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
bottom: 0 bottom: 0;
} }
.activeSession:not(.playingSession) .sessionNowPlayingContent { .activeSession:not(.playingSession) .sessionNowPlayingContent {
display: none display: none;
} }
.dashboardSection { .dashboardSection {
-webkit-flex-shrink: 0; -webkit-flex-shrink: 0;
flex-shrink: 0; flex-shrink: 0;
margin: 0 0 2em margin: 0 0 2em;
} }
.dashboardSection h3 { .dashboardSection h3 {
margin-top: .5em; margin-top: .5em;
margin-bottom: .5em margin-bottom: .5em;
} }
.activeRecordingItems>.card { .activeRecordingItems>.card {
width: 50% width: 50%;
} }
@media all and (min-width:70em) { @media all and (min-width:70em) {
@ -239,23 +239,23 @@ div[data-role=controlgroup] a.ui-btn-active {
-webkit-box-orient: horizontal; -webkit-box-orient: horizontal;
-webkit-box-direction: normal; -webkit-box-direction: normal;
-webkit-flex-direction: row; -webkit-flex-direction: row;
flex-direction: row flex-direction: row;
} }
.dashboardColumn-2-60 { .dashboardColumn-2-60 {
width: 46% width: 46%;
} }
.dashboardColumn-2-40 { .dashboardColumn-2-40 {
width: 27% width: 27%;
} }
.dashboardSection { .dashboardSection {
padding: 0 1.5em padding: 0 1.5em;
} }
.activeRecordingItems>.card { .activeRecordingItems>.card {
width: 25% width: 25%;
} }
} }
@ -263,23 +263,23 @@ div[data-role=controlgroup] a.ui-btn-active {
max-width: 62em; max-width: 62em;
padding: .5em 2em 1em; padding: .5em 2em 1em;
margin: 0 auto; margin: 0 auto;
background: #fff background: #fff;
} }
.wizardNavigation { .wizardNavigation {
text-align: right text-align: right;
} }
.wizardContent form { .wizardContent form {
max-width: 100% max-width: 100%;
} }
.scheduledTaskPaperIconItem { .scheduledTaskPaperIconItem {
outline: 0 !important outline: 0 !important;
} }
.activeSession { .activeSession {
width: 100% !important width: 100% !important;
} }
.activitylogUserPhoto { .activitylogUserPhoto {
@ -294,13 +294,13 @@ div[data-role=controlgroup] a.ui-btn-active {
@media all and (min-width:40em) { @media all and (min-width:40em) {
.activeSession { .activeSession {
width: 100% !important width: 100% !important;
} }
} }
@media all and (min-width:50em) { @media all and (min-width:50em) {
.activeSession { .activeSession {
width: 50% !important width: 50% !important;
} }
} }
@ -309,7 +309,7 @@ div[data-role=controlgroup] a.ui-btn-active {
padding-bottom: 1em !important; padding-bottom: 1em !important;
border-top: 1px solid #eee; border-top: 1px solid #eee;
text-align: center; text-align: center;
position: relative position: relative;
} }
.sessionAppInfo { .sessionAppInfo {
@ -318,11 +318,11 @@ div[data-role=controlgroup] a.ui-btn-active {
} }
.sessionCardButtons { .sessionCardButtons {
min-height: 2.7em min-height: 2.7em;
} }
.sessionCardButton { .sessionCardButton {
margin: 0 margin: 0;
} }
.sessionNowPlayingInnerContent { .sessionNowPlayingInnerContent {
@ -331,17 +331,17 @@ div[data-role=controlgroup] a.ui-btn-active {
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
font-weight: 400 font-weight: 400;
} }
.sessionNowPlayingContent-withbackground+.sessionNowPlayingInnerContent { .sessionNowPlayingContent-withbackground+.sessionNowPlayingInnerContent {
color: #fff !important; color: #fff !important;
background: rgba(0, 0, 0, .7) background: rgba(0, 0, 0, .7);
} }
.sessionAppName { .sessionAppName {
vertical-align: top; vertical-align: top;
max-width: 200px max-width: 200px;
} }
.sessionNowPlayingDetails { .sessionNowPlayingDetails {
@ -396,31 +396,31 @@ div[data-role=controlgroup] a.ui-btn-active {
@media all and (max-width:34.375em) { @media all and (max-width:34.375em) {
.sessionAppName { .sessionAppName {
max-width: 160px max-width: 160px;
} }
} }
@media all and (max-width:31.25em) { @media all and (max-width:31.25em) {
.sessionAppName { .sessionAppName {
max-width: 150px max-width: 150px;
} }
} }
.disabledUser { .disabledUser {
-webkit-filter: grayscale(100%); -webkit-filter: grayscale(100%);
filter: grayscale(100%) filter: grayscale(100%);
} }
.disabledUserBanner { .disabledUserBanner {
margin: 0 0 2em margin: 0 0 2em;
} }
.appLinks a { .appLinks a {
text-decoration: none !important text-decoration: none !important;
} }
.appLinks a+a { .appLinks a+a {
margin-left: 5px margin-left: 5px;
} }
@-webkit-keyframes rotating { @-webkit-keyframes rotating {
@ -438,23 +438,23 @@ div[data-role=controlgroup] a.ui-btn-active {
@keyframes rotating { @keyframes rotating {
from { from {
-webkit-transform: rotate(0); -webkit-transform: rotate(0);
transform: rotate(0) transform: rotate(0);
} }
to { to {
-webkit-transform: rotate(360deg); -webkit-transform: rotate(360deg);
transform: rotate(360deg) transform: rotate(360deg);
} }
} }
.rotatingCircle { .rotatingCircle {
-webkit-animation: rotating 2s linear infinite; -webkit-animation: rotating 2s linear infinite;
animation: rotating 2s linear infinite animation: rotating 2s linear infinite;
} }
.pluginPreviewImg { .pluginPreviewImg {
-webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); -webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37) box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
} }
.ui-bar-a { .ui-bar-a {

6
src/assets/css/detailtable.css
View file

@ -1,7 +1,7 @@
.detailTableBodyCell, .detailTableBodyCell,
.detailTableHeaderCell { .detailTableHeaderCell {
border-spacing: 0; border-spacing: 0;
padding: .4em padding: .4em;
} }
.detailTable { .detailTable {
@ -9,11 +9,11 @@
border-spacing: 0; border-spacing: 0;
text-align: left; text-align: left;
width: 100%; width: 100%;
margin: 0 auto margin: 0 auto;
} }
.detailTableHeaderCell { .detailTableHeaderCell {
font-weight: 700; font-weight: 700;
text-align: left; text-align: left;
vertical-align: top vertical-align: top;
} }

4
src/assets/css/ios.css
View file

@ -1,8 +1,8 @@
html { html {
font-size: 82% !important font-size: 82% !important;
} }
.formDialogFooter { .formDialogFooter {
position: static !important; position: static !important;
margin: 0 -1em !important margin: 0 -1em !important;
} }

268
src/assets/css/librarybrowser.css
View file

@ -1,7 +1,7 @@
.headerUserImage, .headerUserImage,
.navMenuOption, .navMenuOption,
.pageTitle { .pageTitle {
vertical-align: middle vertical-align: middle;
} }
.detailButton-mobile, .detailButton-mobile,
@ -9,7 +9,7 @@
.listPaging, .listPaging,
.sectionTabs, .sectionTabs,
.viewSettings { .viewSettings {
text-align: center text-align: center;
} }
.headerSelectedPlayer, .headerSelectedPlayer,
@ -17,27 +17,27 @@
.navMenuOptionText { .navMenuOptionText {
-o-text-overflow: ellipsis; -o-text-overflow: ellipsis;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden overflow: hidden;
} }
.libraryPage { .libraryPage {
padding-top: 7em !important padding-top: 7em !important;
} }
.itemDetailPage { .itemDetailPage {
padding-top: 0em !important padding-top: 0em !important;
} }
.standalonePage { .standalonePage {
padding-top: 4.5em !important padding-top: 4.5em !important;
} }
.wizardPage { .wizardPage {
padding-top: 7em !important padding-top: 7em !important;
} }
.libraryPage:not(.noSecondaryNavPage) { .libraryPage:not(.noSecondaryNavPage) {
padding-top: 7.5em !important padding-top: 7.5em !important;
} }
.absolutePageTabContent { .absolutePageTabContent {
@ -50,11 +50,11 @@
top: 6.9em !important; top: 6.9em !important;
-webkit-transition: -webkit-transform .2s ease-out; -webkit-transition: -webkit-transform .2s ease-out;
-o-transition: transform .2s ease-out; -o-transition: transform .2s ease-out;
transition: transform .2s ease-out transition: transform .2s ease-out;
} }
.pageTabContent:not(.is-active) { .pageTabContent:not(.is-active) {
display: none !important display: none !important;
} }
.headerUserImage { .headerUserImage {
@ -64,7 +64,7 @@
background-position: center center; background-position: center center;
-webkit-border-radius: 100em; -webkit-border-radius: 100em;
border-radius: 100em; border-radius: 100em;
display: inline-block display: inline-block;
} }
.headerUserButtonRound div { .headerUserButtonRound div {
@ -77,11 +77,11 @@
.headerButton { .headerButton {
-webkit-flex-shrink: 0; -webkit-flex-shrink: 0;
flex-shrink: 0 flex-shrink: 0;
} }
.hideMainDrawer .mainDrawerButton { .hideMainDrawer .mainDrawerButton {
display: none display: none;
} }
.headerLeft, .headerLeft,
@ -97,12 +97,12 @@
align-items: center; align-items: center;
-webkit-box-pack: end; -webkit-box-pack: end;
-webkit-justify-content: flex-end; -webkit-justify-content: flex-end;
justify-content: flex-end justify-content: flex-end;
} }
.noHeaderRight .headerRight, .noHeaderRight .headerRight,
.noHomeButtonHeader .headerHomeButton { .noHomeButtonHeader .headerHomeButton {
display: none !important display: none !important;
} }
.pageTitle { .pageTitle {
@ -115,7 +115,7 @@
-webkit-align-items: center; -webkit-align-items: center;
align-items: center; align-items: center;
-webkit-flex-shrink: 1; -webkit-flex-shrink: 1;
flex-shrink: 1 flex-shrink: 1;
} }
.headerLeft, .headerLeft,
@ -137,7 +137,7 @@
-webkit-background-size: contain; -webkit-background-size: contain;
background-size: contain; background-size: contain;
background-repeat: no-repeat; background-repeat: no-repeat;
width: 13.2em width: 13.2em;
} }
.skinHeader { .skinHeader {
@ -149,7 +149,7 @@
border: 0; border: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
contain: layout style paint contain: layout style paint;
} }
.headerLeft, .headerLeft,
@ -158,11 +158,11 @@
} }
.hiddenViewMenuBar .skinHeader { .hiddenViewMenuBar .skinHeader {
display: none display: none;
} }
.headerTop { .headerTop {
padding: .54em 0 padding: .54em 0;
} }
.headerLeft { .headerLeft {
@ -177,11 +177,11 @@
} }
.sectionTabs { .sectionTabs {
width: 100% width: 100%;
} }
.selectedMediaFolder { .selectedMediaFolder {
background-color: #f2f2f2 !important background-color: #f2f2f2 !important;
} }
.navMenuOption { .navMenuOption {
@ -200,22 +200,22 @@
font-weight: 400 !important; font-weight: 400 !important;
margin: 0 !important; margin: 0 !important;
-webkit-border-radius: 0 !important; -webkit-border-radius: 0 !important;
border-radius: 0 !important border-radius: 0 !important;
} }
.navMenuOptionIcon { .navMenuOptionIcon {
margin-right: 1.2em; margin-right: 1.2em;
-webkit-flex-shrink: 0; -webkit-flex-shrink: 0;
flex-shrink: 0 flex-shrink: 0;
} }
.navMenuOptionText { .navMenuOptionText {
white-space: nowrap white-space: nowrap;
} }
.sidebarHeader { .sidebarHeader {
padding-left: 1.2em; padding-left: 1.2em;
margin: 1em 0 .5em margin: 1em 0 .5em;
} }
.dashboardDocument .skinBody { .dashboardDocument .skinBody {
@ -226,24 +226,24 @@
top: 0; top: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0 left: 0;
} }
.layout-desktop .searchTabButton, .layout-desktop .searchTabButton,
.layout-mobile .searchTabButton, .layout-mobile .searchTabButton,
.layout-tv .headerSearchButton { .layout-tv .headerSearchButton {
display: none !important display: none !important;
} }
.mainDrawer-scrollContainer { .mainDrawer-scrollContainer {
padding-bottom: 10vh padding-bottom: 10vh;
} }
@media all and (min-width:40em) { @media all and (min-width:40em) {
.dashboardDocument .adminDrawerLogo, .dashboardDocument .adminDrawerLogo,
.dashboardDocument .mainDrawerButton { .dashboardDocument .mainDrawerButton {
display: none !important display: none !important;
} }
.dashboardDocument .mainDrawer { .dashboardDocument .mainDrawer {
@ -255,21 +255,21 @@
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
width: 20.205em !important; width: 20.205em !important;
font-size: 94% font-size: 94%;
} }
.dashboardDocument .mainDrawer-scrollContainer { .dashboardDocument .mainDrawer-scrollContainer {
margin-top: 5em !important margin-top: 5em !important;
} }
.dashboardDocument .skinBody { .dashboardDocument .skinBody {
left: 20em left: 20em;
} }
} }
@media all and (max-width:60em) { @media all and (max-width:60em) {
.libraryDocument .mainDrawerButton { .libraryDocument .mainDrawerButton {
display: none display: none;
} }
} }
@ -285,7 +285,7 @@
@media all and (min-width:84em) { @media all and (min-width:84em) {
.headerTop { .headerTop {
padding: 1.489em 0 padding: 1.489em 0;
} }
.headerTabs { .headerTabs {
@ -300,19 +300,19 @@
justify-content: center; justify-content: center;
margin-top: -3.34em; margin-top: -3.34em;
position: relative; position: relative;
top: -1.05em top: -1.05em;
} }
.libraryPage:not(.noSecondaryNavPage) { .libraryPage:not(.noSecondaryNavPage) {
padding-top: 4.6em !important padding-top: 4.6em !important;
} }
.pageWithAbsoluteTabs:not(.noSecondaryNavPage) { .pageWithAbsoluteTabs:not(.noSecondaryNavPage) {
padding-top: 6.7em !important padding-top: 6.7em !important;
} }
.absolutePageTabContent { .absolutePageTabContent {
top: 5.7em !important top: 5.7em !important;
} }
.dashboardDocument .mainDrawer-scrollContainer { .dashboardDocument .mainDrawer-scrollContainer {
@ -322,22 +322,22 @@
.headerSelectedPlayer { .headerSelectedPlayer {
max-width: 10em; max-width: 10em;
white-space: nowrap white-space: nowrap;
} }
@media all and (max-width:37.5em) { @media all and (max-width:37.5em) {
.headerSelectedPlayer { .headerSelectedPlayer {
display: none display: none;
} }
} }
.hidingAnimatedTab { .hidingAnimatedTab {
visibility: hidden visibility: hidden;
} }
.headerArrowImage { .headerArrowImage {
height: 20px; height: 20px;
margin-left: .5em margin-left: .5em;
} }
.backdropContainer { .backdropContainer {
@ -346,30 +346,30 @@
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
z-index: -1 z-index: -1;
} }
.libraryPage .header { .libraryPage .header {
padding-bottom: 0 padding-bottom: 0;
} }
.flexPageTabContent.is-active { .flexPageTabContent.is-active {
display: -webkit-box !important; display: -webkit-box !important;
display: -webkit-flex !important; display: -webkit-flex !important;
display: flex !important display: flex !important;
} }
.viewSettings { .viewSettings {
margin: 0 0 .25em margin: 0 0 .25em;
} }
.listTopPaging, .listTopPaging,
.viewControls { .viewControls {
display: inline-block display: inline-block;
} }
.viewControls+.listTopPaging { .viewControls+.listTopPaging {
margin-left: .5em !important margin-left: .5em !important;
} }
.criticReview { .criticReview {
@ -378,60 +378,60 @@
padding: .8em .8em .8em 3em; padding: .8em .8em .8em 3em;
-webkit-border-radius: .3em; -webkit-border-radius: .3em;
border-radius: .3em; border-radius: .3em;
position: relative position: relative;
} }
.detailLogo, .detailLogo,
.itemBackdrop { .itemBackdrop {
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center center background-position: center center;
} }
.criticReview:first-child { .criticReview:first-child {
margin-top: .5em margin-top: .5em;
} }
.criticReview img { .criticReview img {
width: 2.4em width: 2.4em;
} }
.criticRatingScore { .criticRatingScore {
margin-bottom: .5em margin-bottom: .5em;
} }
.itemTag { .itemTag {
display: inline-block; display: inline-block;
margin-right: 1em margin-right: 1em;
} }
.itemOverview { .itemOverview {
white-space: pre-wrap white-space: pre-wrap;
} }
.itemLinks { .itemLinks {
padding: 0 padding: 0;
} }
.itemLinks p { .itemLinks p {
margin: .5em 0 margin: .5em 0;
} }
.reviewLink, .reviewLink,
.reviewerName { .reviewerName {
margin-top: .5em margin-top: .5em;
} }
.reviewerName { .reviewerName {
color: #ccc color: #ccc;
} }
.reviewDate { .reviewDate {
margin-left: 1em margin-left: 1em;
} }
.reviewScore { .reviewScore {
position: absolute; position: absolute;
left: .8em left: .8em;
} }
.itemBackdrop { .itemBackdrop {
@ -440,19 +440,19 @@
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
height: 50vh; height: 50vh;
position: relative position: relative;
} }
.itemBackdropProgressBar { .itemBackdropProgressBar {
position: absolute !important; position: absolute !important;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0 right: 0;
} }
.desktopMiscInfoContainer { .desktopMiscInfoContainer {
position: absolute; position: absolute;
bottom: .75em bottom: .75em;
} }
.detailPagePrimaryContainer { .detailPagePrimaryContainer {
@ -510,7 +510,7 @@
position: relative; position: relative;
-webkit-box-flex: 1; -webkit-box-flex: 1;
-webkit-flex-grow: 1; -webkit-flex-grow: 1;
flex-grow: 1 flex-grow: 1;
} }
.detailLogo { .detailLogo {
@ -520,18 +520,18 @@
top: 14.5%; top: 14.5%;
right: 10.5%; right: 10.5%;
-webkit-background-size: contain; -webkit-background-size: contain;
background-size: contain background-size: contain;
} }
@media all and (max-width:87.5em) { @media all and (max-width:87.5em) {
.detailLogo { .detailLogo {
right: 5% right: 5%;
} }
} }
@media all and (max-width:75em) { @media all and (max-width:75em) {
.detailLogo { .detailLogo {
right: 2% right: 2%;
} }
} }
@ -543,7 +543,7 @@
bottom: 5%; bottom: 5%;
top: auto; top: auto;
background-position: center right; background-position: center right;
display: none display: none;
} }
} }
@ -555,23 +555,23 @@
@media all and (max-width:62.5em) { @media all and (max-width:62.5em) {
.detailPageContent { .detailPageContent {
position: relative position: relative;
} }
.btnPlaySimple { .btnPlaySimple {
display: none !important display: none !important;
} }
} }
@media all and (max-width:75em) { @media all and (max-width:75em) {
.lnkSibling { .lnkSibling {
display: none !important display: none !important;
} }
} }
.parentName { .parentName {
display: block; display: block;
margin-bottom: .5em margin-bottom: .5em;
} }
.emby-button.detailFloatingButton { .emby-button.detailFloatingButton {
@ -582,36 +582,36 @@
left: 50%; left: 50%;
margin: -2.2em 0 0 -2.2em; margin: -2.2em 0 0 -2.2em;
padding: 0.4em !important; padding: 0.4em !important;
color: rgba(255, 255, 255, .76) color: rgba(255, 255, 255, .76);
} }
.emby-button.detailFloatingButton i { .emby-button.detailFloatingButton i {
font-size: 3.5em font-size: 3.5em;
} }
@media all and (max-width:62.5em) { @media all and (max-width:62.5em) {
.parentName { .parentName {
margin-bottom: 1em margin-bottom: 1em;
} }
.itemDetailPage { .itemDetailPage {
padding-top: 0 !important padding-top: 0 !important;
} }
.detailimg-hidemobile { .detailimg-hidemobile {
display: none display: none;
} }
} }
@media all and (min-width:31.25em) { @media all and (min-width:31.25em) {
.mobileDetails { .mobileDetails {
display: none display: none;
} }
} }
@media all and (max-width:31.25em) { @media all and (max-width:31.25em) {
.desktopDetails { .desktopDetails {
display: none !important display: none !important;
} }
} }
@ -623,19 +623,19 @@
} }
.itemName { .itemName {
margin: .5em 0 margin: .5em 0;
} }
.empty { .empty {
margin: 0 margin: 0;
} }
.detailCollapsibleSection:not(.hide)+.detailCollapsibleSection { .detailCollapsibleSection:not(.hide)+.detailCollapsibleSection {
margin-top: -2em margin-top: -2em;
} }
.detailPageCollabsible { .detailPageCollabsible {
margin-top: 0 margin-top: 0;
} }
.mainDetailButtons { .mainDetailButtons {
@ -652,11 +652,11 @@
margin-left: 0; margin-left: 0;
margin-right: .5em; margin-right: .5em;
-webkit-flex-shrink: 0; -webkit-flex-shrink: 0;
flex-shrink: 0 flex-shrink: 0;
} }
.mainDetailButtons.hide+.recordingFields { .mainDetailButtons.hide+.recordingFields {
margin-top: 1.5em !important margin-top: 1.5em !important;
} }
.detailButton-mobile { .detailButton-mobile {
@ -669,31 +669,31 @@
-webkit-align-items: center; -webkit-align-items: center;
align-items: center; align-items: center;
margin: 0 !important; margin: 0 !important;
padding: .5em .7em !important padding: .5em .7em !important;
} }
.detailButton { .detailButton {
margin: 0 .5em 0 0 !important margin: 0 .5em 0 0 !important;
} }
@media all and (min-width:29em) { @media all and (min-width:29em) {
.detailButton-mobile { .detailButton-mobile {
padding-left: .75em !important; padding-left: .75em !important;
padding-right: .75em !important padding-right: .75em !important;
} }
} }
@media all and (min-width:32em) { @media all and (min-width:32em) {
.detailButton-mobile { .detailButton-mobile {
padding-left: .8em !important; padding-left: .8em !important;
padding-right: .8em !important padding-right: .8em !important;
} }
} }
@media all and (min-width:35em) { @media all and (min-width:35em) {
.detailButton-mobile { .detailButton-mobile {
padding-left: .85em !important; padding-left: .85em !important;
padding-right: .85em !important padding-right: .85em !important;
} }
} }
@ -710,13 +710,13 @@
justify-content: center; justify-content: center;
-webkit-box-align: center; -webkit-box-align: center;
-webkit-align-items: center; -webkit-align-items: center;
align-items: center align-items: center;
} }
.detailButton-mobile-icon { .detailButton-mobile-icon {
font-size: 1.6em !important; font-size: 1.6em !important;
width: 1em; width: 1em;
height: 1em height: 1em;
} }
.detailImageProgressContainer { .detailImageProgressContainer {
@ -727,33 +727,33 @@
.detailButton-mobile-text { .detailButton-mobile-text {
margin-top: .7em; margin-top: .7em;
font-size: 80%; font-size: 80%;
font-weight: 400 font-weight: 400;
} }
@media all and (max-width:62.5em) { @media all and (max-width:62.5em) {
.mainDetailButtons { .mainDetailButtons {
margin-left: -.5em margin-left: -.5em;
} }
.detailButton { .detailButton {
display: none !important display: none !important;
} }
} }
@media all and (min-width:62.5em) { @media all and (min-width:62.5em) {
.detailFloatingButton { .detailFloatingButton {
display: none !important display: none !important;
} }
.mainDetailButtons { .mainDetailButtons {
font-size: 108%; font-size: 108%;
margin: 1.25em 0 margin: 1.25em 0;
} }
} }
@media all and (max-width:50em) { @media all and (max-width:50em) {
.editorMenuLink { .editorMenuLink {
display: none display: none;
} }
} }
@ -765,7 +765,7 @@
flex-wrap: wrap; flex-wrap: wrap;
-webkit-box-align: center; -webkit-box-align: center;
-webkit-align-items: center; -webkit-align-items: center;
align-items: center align-items: center;
} }
@media all and (max-width:31.25em) { @media all and (max-width:31.25em) {
@ -773,16 +773,16 @@
text-align: center; text-align: center;
-webkit-box-pack: center; -webkit-box-pack: center;
-webkit-justify-content: center; -webkit-justify-content: center;
justify-content: center justify-content: center;
} }
.itemMiscInfo .endsAt { .itemMiscInfo .endsAt {
display: none display: none;
} }
} }
.layout-tv .detailVerticalSection { .layout-tv .detailVerticalSection {
margin-bottom: 3.4em !important margin-bottom: 3.4em !important;
} }
.detailPageContent { .detailPageContent {
@ -799,66 +799,66 @@
.mediaInfoStream { .mediaInfoStream {
margin: 0 3em 0 0; margin: 0 3em 0 0;
display: inline-block; display: inline-block;
vertical-align: top vertical-align: top;
} }
.mediaInfoStreamType { .mediaInfoStreamType {
display: block; display: block;
margin: 1em 0 margin: 1em 0;
} }
.mediaInfoAttribute, .mediaInfoAttribute,
.mediaInfoLabel { .mediaInfoLabel {
display: inline-block display: inline-block;
} }
.mediaInfoLabel { .mediaInfoLabel {
margin-right: 1em; margin-right: 1em;
font-weight: 600 font-weight: 600;
} }
.recordingProgressBar::-moz-progress-bar { .recordingProgressBar::-moz-progress-bar {
background-color: #c33 background-color: #c33;
} }
.recordingProgressBar::-webkit-progress-value { .recordingProgressBar::-webkit-progress-value {
background-color: #c33 background-color: #c33;
} }
.recordingProgressBar[aria-valuenow]:before { .recordingProgressBar[aria-valuenow]:before {
background-color: #c33 background-color: #c33;
} }
.timelineHeader { .timelineHeader {
margin-bottom: .25em; margin-bottom: .25em;
line-height: 1.25em; line-height: 1.25em;
line-height: initial line-height: initial;
} }
.itemsContainer { .itemsContainer {
margin: 0 auto margin: 0 auto;
} }
@media all and (max-height:31.25em) { @media all and (max-height:31.25em) {
.itemBackdrop { .itemBackdrop {
height: 52vh height: 52vh;
} }
} }
@media all and (max-width:75em) { @media all and (max-width:75em) {
.listViewUserDataButtons { .listViewUserDataButtons {
display: none !important display: none !important;
} }
} }
@media all and (max-width:62.5em) { @media all and (max-width:62.5em) {
.detailsHiddenOnMobile { .detailsHiddenOnMobile {
display: none display: none;
} }
} }
.btnSyncComplete { .btnSyncComplete {
background: #673ab7 !important background: #673ab7 !important;
} }
.btnSyncComplete i { .btnSyncComplete i {
@ -867,7 +867,7 @@
} }
.bulletSeparator { .bulletSeparator {
margin: 0 .35em margin: 0 .35em;
} }
.mediaInfoIcons { .mediaInfoIcons {
@ -879,18 +879,18 @@
align-items: center; align-items: center;
margin: 1em 0; margin: 1em 0;
-webkit-flex-wrap: wrap; -webkit-flex-wrap: wrap;
flex-wrap: wrap flex-wrap: wrap;
} }
.verticalSection-extrabottompadding { .verticalSection-extrabottompadding {
margin-bottom: 2.7em margin-bottom: 2.7em;
} }
.sectionTitleButton, .sectionTitleButton,
.sectionTitleIconButton { .sectionTitleIconButton {
margin-right: 0 !important; margin-right: 0 !important;
display: inline-block; display: inline-block;
vertical-align: middle vertical-align: middle;
} }
.sectionTitleContainer { .sectionTitleContainer {
@ -917,11 +917,11 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards {
.sectionTitleButton { .sectionTitleButton {
margin-left: 1.5em !important; margin-left: 1.5em !important;
-webkit-flex-shrink: 0; -webkit-flex-shrink: 0;
flex-shrink: 0 flex-shrink: 0;
} }
.sectionTitleButton + .sectionTitleButton { .sectionTitleButton + .sectionTitleButton {
margin-left: .5em !important margin-left: .5em !important;
} }
.sectionTitleIconButton { .sectionTitleIconButton {
@ -929,13 +929,13 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards {
-webkit-flex-shrink: 0; -webkit-flex-shrink: 0;
flex-shrink: 0; flex-shrink: 0;
font-size: 84% !important; font-size: 84% !important;
padding: .5em !important padding: .5em !important;
} }
.horizontalItemsContainer { .horizontalItemsContainer {
display: -webkit-box; display: -webkit-box;
display: -webkit-flex; display: -webkit-flex;
display: flex display: flex;
} }
.sectionTitleTextButton { .sectionTitleTextButton {
@ -943,22 +943,22 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards {
display: -webkit-inline-box !important; display: -webkit-inline-box !important;
display: -webkit-inline-flex !important; display: -webkit-inline-flex !important;
display: inline-flex !important; display: inline-flex !important;
color: inherit !important color: inherit !important;
} }
.sectionTitleTextButton:not(.padded-left) { .sectionTitleTextButton:not(.padded-left) {
padding: 0 !important padding: 0 !important;
} }
.sectionTitleTextButton.padded-left { .sectionTitleTextButton.padded-left {
padding-bottom: 0 !important; padding-bottom: 0 !important;
padding-right: 0 !important; padding-right: 0 !important;
padding-top: 0 !important padding-top: 0 !important;
} }
.sectionTitleTextButton>.sectionTitle { .sectionTitleTextButton>.sectionTitle {
margin-bottom: 0; margin-bottom: 0;
margin-top: 0 margin-top: 0;
} }
.padded-left { .padded-left {
@ -1009,27 +1009,27 @@ div:not(.sectionTitleContainer-cards) > .sectionTitle-cards {
text-decoration: none; text-decoration: none;
font-weight: inherit !important; font-weight: inherit !important;
vertical-align: middle; vertical-align: middle;
color: inherit !important color: inherit !important;
} }
.itemsViewSettingsContainer { .itemsViewSettingsContainer {
-webkit-box-pack: center; -webkit-box-pack: center;
-webkit-justify-content: center; -webkit-justify-content: center;
justify-content: center justify-content: center;
} }
@media all and (min-width:40em) { @media all and (min-width:40em) {
.listIconButton-autohide { .listIconButton-autohide {
display: none !important display: none !important;
} }
} }
@media all and (max-width:40em) { @media all and (max-width:40em) {
.listTextButton-autohide { .listTextButton-autohide {
display: none !important display: none !important;
} }
} }
.itemsViewSettingsContainer>.button-flat { .itemsViewSettingsContainer>.button-flat {
margin: 0 margin: 0;
} }

4
src/assets/css/livetv.css
View file

@ -1,9 +1,9 @@
.guideVerticalScroller { .guideVerticalScroller {
padding-bottom: 15em padding-bottom: 15em;
} }
@media all and (min-width:62.5em) { @media all and (min-width:62.5em) {
#guideTab { #guideTab {
padding-left: .5em padding-left: .5em;
} }
} }

28
src/assets/css/metadataeditor.css
View file

@ -1,17 +1,17 @@
.editPageSidebar { .editPageSidebar {
display: block display: block;
} }
.editPageSidebar-withcontent { .editPageSidebar-withcontent {
display: none display: none;
} }
.libraryTree { .libraryTree {
margin-left: .25em margin-left: .25em;
} }
.offlineEditorNode { .offlineEditorNode {
color: #c33 color: #c33;
} }
.editorNode img { .editorNode img {
@ -19,11 +19,11 @@
margin: 0 .35em; margin: 0 .35em;
vertical-align: middle; vertical-align: middle;
position: relative; position: relative;
top: -2px top: -2px;
} }
.jstree-anchor { .jstree-anchor {
font-weight: 400 !important font-weight: 400 !important;
} }
.jstree-wholerow-hovered { .jstree-wholerow-hovered {
@ -31,7 +31,7 @@
-webkit-border-radius: 0 !important; -webkit-border-radius: 0 !important;
border-radius: 0 !important; border-radius: 0 !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important box-shadow: none !important;
} }
.jstree-default .jstree-hovered { .jstree-default .jstree-hovered {
@ -40,15 +40,15 @@
border-radius: 0 !important; border-radius: 0 !important;
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important; box-shadow: none !important;
color: #fff !important color: #fff !important;
} }
.jstree-default .jstree-wholerow-clicked { .jstree-default .jstree-wholerow-clicked {
background: #00a4dc !important background: #00a4dc !important;
} }
.metadataSidebarIcon { .metadataSidebarIcon {
margin-right: .4em margin-right: .4em;
} }
@media all and (min-width:50em) { @media all and (min-width:50em) {
@ -59,21 +59,21 @@
left: 0; left: 0;
width: 30%; width: 30%;
border-right: 1px solid #555; border-right: 1px solid #555;
display: block display: block;
} }
.editPageInnerContent { .editPageInnerContent {
float: right; float: right;
width: 68.5% width: 68.5%;
} }
} }
@media all and (min-width:112.5em) { @media all and (min-width:112.5em) {
.editPageSidebar { .editPageSidebar {
width: 25% width: 25%;
} }
.editPageInnerContent { .editPageInnerContent {
width: 73.5% width: 73.5%;
} }
} }

28
src/assets/css/site.css
View file

@ -2,7 +2,7 @@ body,
html { html {
margin: 0; margin: 0;
padding: 0; padding: 0;
height: 100% height: 100%;
} }
.backgroundContainer { .backgroundContainer {
@ -11,11 +11,11 @@ html {
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
contain: strict contain: strict;
} }
html { html {
line-height: 1.35 line-height: 1.35;
} }
.layout-mobile, .layout-mobile,
@ -25,7 +25,7 @@ html {
-khtml-user-select: none; -khtml-user-select: none;
-moz-user-select: none; -moz-user-select: none;
-ms-user-select: none; -ms-user-select: none;
user-select: none user-select: none;
} }
body { body {
@ -35,34 +35,34 @@ body {
} }
.mainAnimatedPage { .mainAnimatedPage {
contain: style size !important contain: style size !important;
} }
.pageContainer { .pageContainer {
overflow-x: visible !important overflow-x: visible !important;
} }
.bodyWithPopupOpen { .bodyWithPopupOpen {
overflow-y: hidden !important overflow-y: hidden !important;
} }
div[data-role=page] { div[data-role=page] {
outline: 0 outline: 0;
} }
.pageTitle { .pageTitle {
margin-top: 0; margin-top: 0;
font-family: inherit font-family: inherit;
} }
.fieldDescription { .fieldDescription {
padding-left: .15em; padding-left: .15em;
font-weight: 400; font-weight: 400;
white-space: normal !important white-space: normal !important;
} }
.fieldDescription+.fieldDescription { .fieldDescription+.fieldDescription {
margin-top: .3em margin-top: .3em;
} }
.content-primary, .content-primary,
@ -76,18 +76,18 @@ div[data-role=page] {
@media all and (min-width:50em) { @media all and (min-width:50em) {
.readOnlyContent, .readOnlyContent,
form { form {
max-width: 54em max-width: 54em;
} }
} }
.headerHelpButton { .headerHelpButton {
margin-left: 1.25em !important; margin-left: 1.25em !important;
padding-bottom: .4em !important; padding-bottom: .4em !important;
padding-top: .4em !important padding-top: .4em !important;
} }
.mediaInfoContent { .mediaInfoContent {
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
width: 85% width: 85%;
} }

60
src/assets/css/videoosd.css
View file

@ -11,7 +11,7 @@
.videoOsdBottom { .videoOsdBottom {
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0 right: 0;
} }
.osdHeader { .osdHeader {
@ -27,11 +27,11 @@
} }
.osdHeader-hidden { .osdHeader-hidden {
opacity: 0 opacity: 0;
} }
.osdHeader .headerButton:not(.headerBackButton):not(.headerCastButton) { .osdHeader .headerButton:not(.headerBackButton):not(.headerCastButton) {
display: none display: none;
} }
.chapterThumbContainer { .chapterThumbContainer {
@ -40,7 +40,7 @@
-webkit-box-flex: 1; -webkit-box-flex: 1;
-webkit-flex-grow: 1; -webkit-flex-grow: 1;
flex-grow: 1; flex-grow: 1;
position: relative position: relative;
} }
.chapterThumb { .chapterThumb {
@ -50,20 +50,20 @@
background-repeat: no-repeat; background-repeat: no-repeat;
border: 0; border: 0;
height: 20vh; height: 20vh;
min-width: 20vh min-width: 20vh;
} }
@media all and (orientation:portrait) { @media all and (orientation:portrait) {
.chapterThumb { .chapterThumb {
height: 30vw; height: 30vw;
min-width: 30vw min-width: 30vw;
} }
} }
@media all and (max-height:50em) and (orientation:landscape) { @media all and (max-height:50em) and (orientation:landscape) {
.chapterThumb { .chapterThumb {
height: 30vh; height: 30vh;
min-width: 30vh min-width: 30vh;
} }
} }
@ -74,17 +74,17 @@
right: 0; right: 0;
background: rgba(0, 0, 0, .7); background: rgba(0, 0, 0, .7);
padding: .25em .5em; padding: .25em .5em;
user-select: none user-select: none;
} }
.chapterThumbText { .chapterThumbText {
padding: .25em 0; padding: .25em 0;
margin: 0; margin: 0;
opacity: 1 opacity: 1;
} }
.chapterThumbText-dim { .chapterThumbText-dim {
opacity: .6 opacity: .6;
} }
.videoOsdBottom { .videoOsdBottom {
@ -104,17 +104,17 @@
transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out;
color: #fff; color: #fff;
user-select: none; user-select: none;
-webkit-touch-callout: none -webkit-touch-callout: none;
} }
.videoOsdBottom-hidden { .videoOsdBottom-hidden {
opacity: 0 opacity: 0;
} }
.osdControls { .osdControls {
-webkit-box-flex: 1; -webkit-box-flex: 1;
-webkit-flex-grow: 1; -webkit-flex-grow: 1;
flex-grow: 1 flex-grow: 1;
} }
.videoOsdBottom .buttons { .videoOsdBottom .buttons {
@ -126,14 +126,14 @@
flex-wrap: wrap; flex-wrap: wrap;
-webkit-box-align: center; -webkit-box-align: center;
-webkit-align-items: center; -webkit-align-items: center;
align-items: center align-items: center;
} }
.osdVolumeSliderContainer { .osdVolumeSliderContainer {
width: 9em; width: 9em;
-webkit-box-flex: 1; -webkit-box-flex: 1;
-webkit-flex-grow: 1; -webkit-flex-grow: 1;
flex-grow: 1 flex-grow: 1;
} }
.osdMediaInfo, .osdMediaInfo,
@ -149,7 +149,7 @@
margin: 0 .5em 0 auto; margin: 0 .5em 0 auto;
display: flex; display: flex;
-webkit-align-items: center; -webkit-align-items: center;
align-items: center align-items: center;
} }
.osdTimeText { .osdTimeText {
@ -157,13 +157,13 @@
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
-ms-user-select: none; -ms-user-select: none;
user-select: none user-select: none;
} }
.osdPoster { .osdPoster {
width: 10%; width: 10%;
position: relative; position: relative;
margin-right: .5em margin-right: .5em;
} }
.osdPoster img { .osdPoster img {
@ -178,22 +178,22 @@
-moz-user-select: none; -moz-user-select: none;
-webkit-user-drag: none; -webkit-user-drag: none;
-webkit-user-select: none; -webkit-user-select: none;
-ms-user-select: none -ms-user-select: none;
} }
.osdTitle, .osdTitle,
.osdTitleSmall { .osdTitleSmall {
margin: 0 1em 0 0 margin: 0 1em 0 0;
} }
.osdMediaInfo { .osdMediaInfo {
display: flex; display: flex;
-webkit-align-items: center; -webkit-align-items: center;
align-items: center align-items: center;
} }
.osdSecondaryMediaInfo { .osdSecondaryMediaInfo {
padding-left: .6em !important padding-left: .6em !important;
} }
.osdTextContainer { .osdTextContainer {
@ -208,13 +208,13 @@
-ms-user-select: none; -ms-user-select: none;
user-select: none; user-select: none;
margin-bottom: .7em; margin-bottom: .7em;
padding-left: .5em padding-left: .5em;
} }
.osdMainTextContainer { .osdMainTextContainer {
-webkit-box-align: baseline; -webkit-box-align: baseline;
-webkit-align-items: baseline; -webkit-align-items: baseline;
align-items: baseline align-items: baseline;
} }
.osdMediaStatus { .osdMediaStatus {
@ -248,7 +248,7 @@
.pageContainer { .pageContainer {
top: 0; top: 0;
position: fixed position: fixed;
} }
@media all and (max-width:30em) { @media all and (max-width:30em) {
@ -257,31 +257,31 @@
.btnRewind, .btnRewind,
.osdMediaInfo, .osdMediaInfo,
.osdPoster { .osdPoster {
display: none !important display: none !important;
} }
} }
@media all and (max-width:33.75em) { @media all and (max-width:33.75em) {
.videoOsdBottom .paper-icon-button-light { .videoOsdBottom .paper-icon-button-light {
margin: 0 margin: 0;
} }
} }
@media all and (max-width:43em) { @media all and (max-width:43em) {
.videoOsdBottom .volumeButtons, .videoOsdBottom .volumeButtons,
.osdMediaStatus span { .osdMediaStatus span {
display: none !important display: none !important;
} }
} }
@media all and (max-width:50em) { @media all and (max-width:50em) {
.videoOsdBottom .btnFastForward, .videoOsdBottom .btnRewind { .videoOsdBottom .btnFastForward, .videoOsdBottom .btnRewind {
display: none !important display: none !important;
} }
} }
@media all and (max-width:75em) { @media all and (max-width:75em) {
.videoOsdBottom .endsAtText { .videoOsdBottom .endsAtText {
display: none !important display: none !important;
} }
} }

4
src/components/directorybrowser/directorybrowser.css
View file

@ -1,8 +1,8 @@
#ulDirectoryPickerList a { #ulDirectoryPickerList a {
padding-top: .4em; padding-top: .4em;
padding-bottom: .4em padding-bottom: .4em;
} }
.lblDirectoryPickerPath { .lblDirectoryPickerPath {
white-space: nowrap white-space: nowrap;
} }

8
src/components/filterdialog/style.css
View file

@ -8,13 +8,13 @@
-webkit-border-radius: 0 !important; -webkit-border-radius: 0 !important;
border-radius: 0 !important; border-radius: 0 !important;
max-height: none !important; max-height: none !important;
max-width: none !important max-width: none !important;
} }
@media all and (min-height:600px) { @media all and (min-height:600px) {
.dynamicFilterDialog { .dynamicFilterDialog {
top: 10% !important; top: 10% !important;
bottom: 25% !important bottom: 25% !important;
} }
} }
@ -23,7 +23,7 @@
width: auto; width: auto;
left: 10vw !important; left: 10vw !important;
right: 10vw !important; right: 10vw !important;
margin-left: 0 !important margin-left: 0 !important;
} }
} }
@ -31,6 +31,6 @@
.dynamicFilterDialog { .dynamicFilterDialog {
width: 20.16em; width: 20.16em;
margin-left: -10.08em !important; margin-left: -10.08em !important;
left: 50% !important left: 50% !important;
} }
} }

4
src/components/homesections/homesections.css
View file

@ -14,12 +14,12 @@
margin-left: .5em; margin-left: .5em;
margin-right: .5em; margin-right: .5em;
-webkit-flex-shrink: 0; -webkit-flex-shrink: 0;
flex-shrink: 0 flex-shrink: 0;
} }
.homeLibraryText { .homeLibraryText {
white-space: nowrap; white-space: nowrap;
-o-text-overflow: ellipsis; -o-text-overflow: ellipsis;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden overflow: hidden;
} }

14
src/components/navdrawer/navdrawer.css
View file

@ -3,7 +3,7 @@
position: fixed; position: fixed;
top: 0; top: 0;
bottom: 0; bottom: 0;
contain: strict contain: strict;
} }
.touch-menu-la { .touch-menu-la {
@ -15,24 +15,24 @@
-webkit-transition: -webkit-transform ease-out 40ms, left ease-out 260ms; -webkit-transition: -webkit-transform ease-out 40ms, left ease-out 260ms;
-o-transition: transform ease-out 40ms, left ease-out 260ms; -o-transition: transform ease-out 40ms, left ease-out 260ms;
transition: transform ease-out 40ms, left ease-out 260ms; transition: transform ease-out 40ms, left ease-out 260ms;
z-index: 1099 z-index: 1099;
} }
.touch-menu-la.transition { .touch-menu-la.transition {
-webkit-transition: -webkit-transform ease-out 240ms, left ease-out 260ms; -webkit-transition: -webkit-transform ease-out 240ms, left ease-out 260ms;
-o-transition: transform ease-out 240ms, left ease-out 260ms; -o-transition: transform ease-out 240ms, left ease-out 260ms;
transition: transform ease-out 240ms, left ease-out 260ms transition: transform ease-out 240ms, left ease-out 260ms;
} }
.drawer-open { .drawer-open {
-webkit-box-shadow: 2px 0 12px rgba(0, 0, 0, .4); -webkit-box-shadow: 2px 0 12px rgba(0, 0, 0, .4);
box-shadow: 2px 0 12px rgba(0, 0, 0, .4) box-shadow: 2px 0 12px rgba(0, 0, 0, .4);
} }
.scrollContainer { .scrollContainer {
-webkit-box-flex: 1; -webkit-box-flex: 1;
-webkit-flex-grow: 1; -webkit-flex-grow: 1;
flex-grow: 1 flex-grow: 1;
} }
.tmla-mask { .tmla-mask {
@ -44,9 +44,9 @@
-o-transition: opacity ease-in-out .38s, visibility ease-in-out .38s; -o-transition: opacity ease-in-out .38s, visibility ease-in-out .38s;
transition: opacity ease-in-out .38s, visibility ease-in-out .38s; transition: opacity ease-in-out .38s, visibility ease-in-out .38s;
will-change: opacity; will-change: opacity;
background-color: rgba(0, 0, 0, .3) background-color: rgba(0, 0, 0, .3);
} }
.tmla-mask.backdrop { .tmla-mask.backdrop {
opacity: 1 opacity: 1;
} }

54
src/components/remotecontrol/remotecontrol.css
View file

@ -5,11 +5,11 @@
-webkit-box-orient: horizontal; -webkit-box-orient: horizontal;
-webkit-box-direction: normal; -webkit-box-direction: normal;
-webkit-flex-direction: row; -webkit-flex-direction: row;
flex-direction: row flex-direction: row;
} }
.navigationSection { .navigationSection {
text-align: center text-align: center;
} }
.btnArrowUp{ .btnArrowUp{
@ -33,11 +33,11 @@
} }
.nowPlayingPageTitle { .nowPlayingPageTitle {
margin: 0 0 .5em .5em margin: 0 0 .5em .5em;
} }
.nowPlayingPositionSliderContainer { .nowPlayingPositionSliderContainer {
margin: .7em 0 .7em 1em margin: .7em 0 .7em 1em;
} }
.nowPlayingInfoButtons { .nowPlayingInfoButtons {
@ -48,7 +48,7 @@
-webkit-align-items: center; -webkit-align-items: center;
align-items: center; align-items: center;
-webkit-flex-wrap: wrap; -webkit-flex-wrap: wrap;
flex-wrap: wrap flex-wrap: wrap;
} }
.nowPlayingInfoControls, .nowPlayingInfoControls,
@ -63,12 +63,12 @@
margin-right: .25em; margin-right: .25em;
position: relative; position: relative;
-webkit-flex-shrink: 0; -webkit-flex-shrink: 0;
flex-shrink: 0 flex-shrink: 0;
} }
@media all and (min-width:50em) { @media all and (min-width:50em) {
.nowPlayingPageImageContainer { .nowPlayingPageImageContainer {
width: 16% width: 16%;
} }
} }
@ -83,7 +83,7 @@
flex-direction: column; flex-direction: column;
-webkit-box-pack: center; -webkit-box-pack: center;
-webkit-justify-content: center; -webkit-justify-content: center;
justify-content: center justify-content: center;
} }
.nowPlayingPageImage { .nowPlayingPageImage {
@ -110,43 +110,43 @@
flex-direction: column !important; flex-direction: column !important;
-webkit-box-align: center; -webkit-box-align: center;
-webkit-align-items: center; -webkit-align-items: center;
align-items: center align-items: center;
} }
.nowPlayingPageTitle { .nowPlayingPageTitle {
text-align: center; text-align: center;
margin: .5em 0 .75em margin: .5em 0 .75em;
} }
.nowPlayingPositionSliderContainer { .nowPlayingPositionSliderContainer {
margin: .7em 1em margin: .7em 1em;
} }
.nowPlayingInfoButtons { .nowPlayingInfoButtons {
-webkit-box-pack: center; -webkit-box-pack: center;
-webkit-justify-content: center; -webkit-justify-content: center;
justify-content: center justify-content: center;
} }
.nowPlayingPageImageContainer { .nowPlayingPageImageContainer {
width: auto; width: auto;
margin-right: 0 margin-right: 0;
} }
.nowPlayingInfoControls { .nowPlayingInfoControls {
margin-top: 1em; margin-top: 1em;
max-width: 100% max-width: 100%;
} }
.nowPlayingPageImage { .nowPlayingPageImage {
width: auto; width: auto;
height: 36vh height: 36vh;
} }
} }
@media all and (orientation:portrait) and (max-width:40em) { @media all and (orientation:portrait) and (max-width:40em) {
.nowPlayingPageImage { .nowPlayingPageImage {
height: 30vh height: 30vh;
} }
} }
@ -155,7 +155,7 @@
-webkit-box-align: center; -webkit-box-align: center;
-webkit-align-items: center; -webkit-align-items: center;
align-items: center; align-items: center;
margin: 0 1em margin: 0 1em;
} }
.nowPlayingSecondaryButtons { .nowPlayingSecondaryButtons {
@ -169,7 +169,7 @@
flex-wrap: wrap; flex-wrap: wrap;
-webkit-box-pack: center; -webkit-box-pack: center;
-webkit-justify-content: center; -webkit-justify-content: center;
justify-content: center justify-content: center;
} }
@media all and (min-width:50em) { @media all and (min-width:50em) {
@ -179,25 +179,25 @@
flex-grow: 1; flex-grow: 1;
-webkit-box-pack: end; -webkit-box-pack: end;
-webkit-justify-content: flex-end; -webkit-justify-content: flex-end;
justify-content: flex-end justify-content: flex-end;
} }
} }
@media all and (min-width:80em) { @media all and (min-width:80em) {
.nowPlayingPageImageContainer { .nowPlayingPageImageContainer {
margin-right: .75em margin-right: .75em;
} }
} }
.nowPlayingNavButtonContainer { .nowPlayingNavButtonContainer {
width: 30em width: 30em;
} }
.smallBackdropPosterItem .cardOverlayInner>div { .smallBackdropPosterItem .cardOverlayInner>div {
white-space: nowrap; white-space: nowrap;
-o-text-overflow: ellipsis; -o-text-overflow: ellipsis;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden overflow: hidden;
} }
.playlistIndexIndicatorImage { .playlistIndexIndicatorImage {
@ -207,16 +207,16 @@
} }
.hideVideoButtons .videoButton { .hideVideoButtons .videoButton {
display: none display: none;
} }
.nowPlayingVolumeSliderContainer { .nowPlayingVolumeSliderContainer {
width: 9em width: 9em;
} }
@media all and (max-width:50em) { @media all and (max-width:50em) {
.nowPlayingInfoButtons .nowPlayingPageUserDataButtons { .nowPlayingInfoButtons .nowPlayingPageUserDataButtons {
display: none !important display: none !important;
} }
.navigationSection .collapseContent i{ .navigationSection .collapseContent i{
font-size: 4em; font-size: 4em;
@ -225,7 +225,7 @@
@media all and (max-width:47em) { @media all and (max-width:47em) {
.nowPlayingInfoButtons .repeatToggleButton { .nowPlayingInfoButtons .repeatToggleButton {
display: none !important display: none !important;
} }
} }
@ -233,6 +233,6 @@
.nowPlayingInfoButtons .btnNowPlayingFastForward, .nowPlayingInfoButtons .btnNowPlayingFastForward,
.nowPlayingInfoButtons .btnNowPlayingRewind, .nowPlayingInfoButtons .btnNowPlayingRewind,
.nowPlayingInfoButtons .playlist .listItemMediaInfo { .nowPlayingInfoButtons .playlist .listItemMediaInfo {
display: none !important display: none !important;
} }
} }

2
src/elements/emby-radio/emby-radio.css
View file

@ -90,7 +90,7 @@
} }
.mdl-radio__button:checked:focus + .mdl-radio__label + .mdl-radio__outer-circle + .mdl-radio__inner-circle { .mdl-radio__button:checked:focus + .mdl-radio__label + .mdl-radio__outer-circle + .mdl-radio__inner-circle {
box-shadow: 0 0 0 10px rgba(0, 164, 220, 0.26) box-shadow: 0 0 0 10px rgba(0, 164, 220, 0.26);
} }
.mdl-radio__label { .mdl-radio__label {

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

@ -1,22 +1,22 @@
.skinHeader, .skinHeader,
html { html {
color: #222; color: #222;
color: rgba(0, 0, 0, .87) color: rgba(0, 0, 0, .87);
} }
.wizardStartForm, .wizardStartForm,
.ui-corner-all, .ui-corner-all,
.ui-shadow { .ui-shadow {
background-color: #303030 background-color: #303030;
} }
.emby-collapsible-button { .emby-collapsible-button {
border-color: #ccc; border-color: #ccc;
border-color: rgba(0, 0, 0, .158) border-color: rgba(0, 0, 0, .158);
} }
.collapseContent { .collapseContent {
background-color: #eaeaea background-color: #eaeaea;
} }
.formDialogHeader:not(.formDialogHeader-clear), .formDialogHeader:not(.formDialogHeader-clear),
@ -26,38 +26,38 @@ html {
background: -webkit-gradient(linear, left top, right top, from(#BCBCBC), color-stop(#A7B4B7), color-stop(#BEB5A5), color-stop(#ADBEC2), to(#B9C7CB)); background: -webkit-gradient(linear, left top, right top, from(#BCBCBC), color-stop(#A7B4B7), color-stop(#BEB5A5), color-stop(#ADBEC2), to(#B9C7CB));
background: -webkit-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB); background: -webkit-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB);
background: -o-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB); background: -o-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB);
background: linear-gradient(to right, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB) background: linear-gradient(to right, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB);
} }
.skinHeader.semiTransparent { .skinHeader.semiTransparent {
-webkit-backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
backdrop-filter: none !important backdrop-filter: none !important;
} }
.pageTitleWithDefaultLogo { .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-dark.png) background-image: url(../../assets/img/banner-dark.png);
} }
html { html {
background: #d5e9f2 background: #d5e9f2;
} }
.backgroundContainer, .backgroundContainer,
.dialog { .dialog {
background: #D5E9F2; background: #D5E9F2;
-webkit-background-size: 100% 100%; -webkit-background-size: 100% 100%;
background-size: 100% 100% background-size: 100% 100%;
} }
.backgroundContainer.withBackdrop { .backgroundContainer.withBackdrop {
background: -webkit-gradient(linear, left top, left bottom, from(rgba(192, 212, 222, .94)), color-stop(rgba(235, 250, 254, .94)), color-stop(rgba(227, 220, 212, .94)), color-stop(rgba(206, 214, 216, .94)), to(rgba(192, 211, 218, .94))); background: -webkit-gradient(linear, left top, left bottom, from(rgba(192, 212, 222, .94)), color-stop(rgba(235, 250, 254, .94)), color-stop(rgba(227, 220, 212, .94)), color-stop(rgba(206, 214, 216, .94)), to(rgba(192, 211, 218, .94)));
background: -webkit-linear-gradient(top, rgba(192, 212, 222, .94), rgba(235, 250, 254, .94), rgba(227, 220, 212, .94), rgba(206, 214, 216, .94), rgba(192, 211, 218, .94)); background: -webkit-linear-gradient(top, rgba(192, 212, 222, .94), rgba(235, 250, 254, .94), rgba(227, 220, 212, .94), rgba(206, 214, 216, .94), rgba(192, 211, 218, .94));
background: -o-linear-gradient(top, rgba(192, 212, 222, .94), rgba(235, 250, 254, .94), rgba(227, 220, 212, .94), rgba(206, 214, 216, .94), rgba(192, 211, 218, .94)); background: -o-linear-gradient(top, rgba(192, 212, 222, .94), rgba(235, 250, 254, .94), rgba(227, 220, 212, .94), rgba(206, 214, 216, .94), rgba(192, 211, 218, .94));
background: linear-gradient(to bottom, rgba(192, 212, 222, .94), rgba(235, 250, 254, .94), rgba(227, 220, 212, .94), rgba(206, 214, 216, .94), rgba(192, 211, 218, .94)) background: linear-gradient(to bottom, rgba(192, 212, 222, .94), rgba(235, 250, 254, .94), rgba(227, 220, 212, .94), rgba(206, 214, 216, .94), rgba(192, 211, 218, .94));
} }
.actionSheet { .actionSheet {
background: #f0f0f0 background: #f0f0f0;
} }
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
@ -73,30 +73,30 @@ html {
.raised { .raised {
background: #fff; background: #fff;
background: rgba(0, 0, 0, .14); background: rgba(0, 0, 0, .14);
color: inherit color: inherit;
} }
.fab:focus, .fab:focus,
.raised:focus { .raised:focus {
background: rgba(0, 0, 0, .24) background: rgba(0, 0, 0, .24);
} }
.button-submit { .button-submit {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.button-submit:focus { .button-submit:focus {
background: #0cb0e8 background: #0cb0e8;
} }
.button-delete { .button-delete {
background: rgb(247, 0, 0); background: rgb(247, 0, 0);
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.checkboxLabel { .checkboxLabel {
color: inherit color: inherit;
} }
.checkboxListLabel, .checkboxListLabel,
@ -105,49 +105,49 @@ html {
.paperListLabel, .paperListLabel,
.textareaLabelUnfocused { .textareaLabelUnfocused {
color: #555; color: #555;
color: rgba(0, 0, 0, .7) color: rgba(0, 0, 0, .7);
} }
.button-link, .button-link,
.inputLabelFocused, .inputLabelFocused,
.selectLabelFocused, .selectLabelFocused,
.textareaLabelFocused { .textareaLabelFocused {
color: green color: green;
} }
.checkboxOutline { .checkboxOutline {
border-color: currentColor border-color: currentColor;
} }
.paperList, .paperList,
.visualCardBox { .visualCardBox {
background-color: #fff; background-color: #fff;
background-color: rgba(0, 0, 0, .1) background-color: rgba(0, 0, 0, .1);
} }
.defaultCardBackground1 { .defaultCardBackground1 {
background-color: #009688 background-color: #009688;
} }
.defaultCardBackground2 { .defaultCardBackground2 {
background-color: #d32f2f background-color: #d32f2f;
} }
.defaultCardBackground3 { .defaultCardBackground3 {
background-color: #0288d1 background-color: #0288d1;
} }
.defaultCardBackground4 { .defaultCardBackground4 {
background-color: #388e3c background-color: #388e3c;
} }
.defaultCardBackground5 { .defaultCardBackground5 {
background-color: #f57f17 background-color: #f57f17;
} }
.formDialogFooter:not(.formDialogFooter-clear) { .formDialogFooter:not(.formDialogFooter-clear) {
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
border-top: 1px solid rgba(0, 0, 0, .08) border-top: 1px solid rgba(0, 0, 0, .08);
} }
.cardText-secondary, .cardText-secondary,
@ -158,31 +158,31 @@ html {
.programSecondaryTitle, .programSecondaryTitle,
.secondaryText { .secondaryText {
color: #888; color: #888;
color: rgba(0, 0, 0, .5) color: rgba(0, 0, 0, .5);
} }
.actionsheetDivider { .actionsheetDivider {
background: #ddd; background: #ddd;
background: rgba(0, 0, 0, .14) background: rgba(0, 0, 0, .14);
} }
.cardFooter-vibrant .cardText-secondary { .cardFooter-vibrant .cardText-secondary {
color: inherit; color: inherit;
opacity: .5 opacity: .5;
} }
.formDialogHeader a, .formDialogHeader a,
.toast { .toast {
color: #fff color: #fff;
} }
.actionSheetMenuItem:hover { .actionSheetMenuItem:hover {
background-color: #ddd background-color: #ddd;
} }
.toast { .toast {
background: #303030; background: #303030;
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.appfooter, .appfooter,
@ -192,63 +192,63 @@ html {
background: -webkit-gradient(linear, left top, right top, from(#BCBCBC), color-stop(#A7B4B7), color-stop(#BEB5A5), color-stop(#ADBEC2), to(#B9C7CB)); background: -webkit-gradient(linear, left top, right top, from(#BCBCBC), color-stop(#A7B4B7), color-stop(#BEB5A5), color-stop(#ADBEC2), to(#B9C7CB));
background: -webkit-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB); background: -webkit-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB);
background: -o-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB); background: -o-linear-gradient(left, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB);
background: linear-gradient(to right, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB) background: linear-gradient(to right, #BCBCBC, #A7B4B7, #BEB5A5, #ADBEC2, #B9C7CB);
} }
.nowPlayingBarSecondaryText { .nowPlayingBarSecondaryText {
color: #999 color: #999;
} }
.itemSelectionPanel { .itemSelectionPanel {
border: 1px solid #00a4dc border: 1px solid #00a4dc;
} }
.selectionCommandsPanel { .selectionCommandsPanel {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.upNextDialog-countdownText { .upNextDialog-countdownText {
color: #00a4dc color: #00a4dc;
} }
.alphaPickerButton { .alphaPickerButton {
color: #555; color: #555;
color: rgba(0, 0, 0, .7); color: rgba(0, 0, 0, .7);
background-color: transparent background-color: transparent;
} }
.alphaPickerButton-selected, .alphaPickerButton-selected,
.alphaPickerButton-tv:focus { .alphaPickerButton-tv:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff !important color: #fff !important;
} }
.detailTableBodyRow-shaded:nth-child(even) { .detailTableBodyRow-shaded:nth-child(even) {
background: #f8f8f8; background: #f8f8f8;
background: rgba(0, 0, 0, .1) background: rgba(0, 0, 0, .1);
} }
.listItem-border { .listItem-border {
border-color: rgba(0, 0, 0, .1) !important border-color: rgba(0, 0, 0, .1) !important;
} }
.listItem:focus { .listItem:focus {
background: rgba(0, 0, 0, .2) background: rgba(0, 0, 0, .2);
} }
.progressring-spiner { .progressring-spiner {
border-color: #00a4dc border-color: #00a4dc;
} }
.mediaInfoText { .mediaInfoText {
color: #333; color: #333;
background: #fff background: #fff;
} }
.mediaInfoTimerIcon, .mediaInfoTimerIcon,
.starIcon { .starIcon {
color: #cb272a color: #cb272a;
} }
.emby-input, .emby-input,
@ -257,23 +257,23 @@ html {
background: rgba(255, 255, 255, .9); background: rgba(255, 255, 255, .9);
border: .07em solid rgba(0, 0, 0, .158); border: .07em solid rgba(0, 0, 0, .158);
-webkit-border-radius: .15em; -webkit-border-radius: .15em;
border-radius: .15em border-radius: .15em;
} }
.emby-input:focus, .emby-input:focus,
.emby-textarea:focus { .emby-textarea:focus {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-select-withcolor { .emby-select-withcolor {
color: inherit; color: inherit;
background: rgba(255, 255, 255, .9); background: rgba(255, 255, 255, .9);
border: .07em solid rgba(0, 0, 0, .158) border: .07em solid rgba(0, 0, 0, .158);
} }
.emby-checkbox:checked+span+.checkboxOutline, .emby-checkbox:checked+span+.checkboxOutline,
.emby-select-withcolor:focus { .emby-select-withcolor:focus {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-checkbox:focus+span+.checkboxOutline { .emby-checkbox:focus+span+.checkboxOutline {
@ -282,7 +282,7 @@ html {
.emby-checkbox:checked+span+.checkboxOutline, .emby-checkbox:checked+span+.checkboxOutline,
.itemProgressBarForeground { .itemProgressBarForeground {
background-color: #00a4dc background-color: #00a4dc;
} }
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline { .emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
@ -291,44 +291,44 @@ html {
.emby-select-withcolor>option { .emby-select-withcolor>option {
color: #000; color: #000;
background: #fff background: #fff;
} }
.emby-select-tv-withcolor:focus { .emby-select-tv-withcolor:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff color: #fff;
} }
.itemProgressBarForeground-recording { .itemProgressBarForeground-recording {
background-color: #cb272a background-color: #cb272a;
} }
.countIndicator, .countIndicator,
.fullSyncIndicator, .fullSyncIndicator,
.playedIndicator { .playedIndicator {
background: #00a4dc background: #00a4dc;
} }
.fullSyncIndicator { .fullSyncIndicator {
color: #fff color: #fff;
} }
.mainDrawer { .mainDrawer {
background: #fff background: #fff;
} }
.navMenuOption:hover { .navMenuOption:hover {
background: #f2f2f2 background: #f2f2f2;
} }
.navMenuOption-selected { .navMenuOption-selected {
background: #00a4dc !important; background: #00a4dc !important;
color: #fff color: #fff;
} }
.emby-button.show-focus:focus { .emby-button.show-focus:focus {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.emby-tab-button { .emby-tab-button {
@ -351,57 +351,57 @@ html {
.guide-channelHeaderCell, .guide-channelHeaderCell,
.programCell { .programCell {
border-color: #555; border-color: #555;
border-color: rgba(0, 0, 0, .1) border-color: rgba(0, 0, 0, .1);
} }
.programCell-sports { .programCell-sports {
background: #3949ab !important background: #3949ab !important;
} }
.programCell-movie { .programCell-movie {
background: #5e35b1 !important background: #5e35b1 !important;
} }
.programCell-kids { .programCell-kids {
background: #039be5 !important background: #039be5 !important;
} }
.programCell-news { .programCell-news {
background: #43a047 !important background: #43a047 !important;
} }
.programCell-active { .programCell-active {
background: rgba(0, 0, 0, .1) !important background: rgba(0, 0, 0, .1) !important;
} }
.guide-channelHeaderCell:focus, .guide-channelHeaderCell:focus,
.programCell:focus { .programCell:focus {
background-color: #00a4dc !important; background-color: #00a4dc !important;
color: #fff !important color: #fff !important;
} }
.guide-programTextIcon { .guide-programTextIcon {
color: #1e1e1e; color: #1e1e1e;
background: #555 background: #555;
} }
.guide-headerTimeslots { .guide-headerTimeslots {
color: inherit color: inherit;
} }
.guide-date-tab-button { .guide-date-tab-button {
color: #555; color: #555;
color: rgba(0, 0, 0, .54) color: rgba(0, 0, 0, .54);
} }
.guide-date-tab-button.emby-tab-button-active, .guide-date-tab-button.emby-tab-button-active,
.guide-date-tab-button:focus { .guide-date-tab-button:focus {
color: #00a4dc color: #00a4dc;
} }
.guide-date-tab-button.show-focus:focus { .guide-date-tab-button.show-focus:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff color: #fff;
} }
.infoBanner { .infoBanner {
@ -409,31 +409,31 @@ html {
background: #fff3a5; background: #fff3a5;
padding: 1em; padding: 1em;
-webkit-border-radius: .25em; -webkit-border-radius: .25em;
border-radius: .25em border-radius: .25em;
} }
.ratingbutton-icon-withrating { .ratingbutton-icon-withrating {
color: #c33 color: #c33;
} }
.downloadbutton-icon-complete, .downloadbutton-icon-complete,
.downloadbutton-icon-on { .downloadbutton-icon-on {
color: #4285f4 color: #4285f4;
} }
.playstatebutton-icon-played { .playstatebutton-icon-played {
color: #c33 color: #c33;
} }
.repeatButton-active { .repeatButton-active {
color: #4285f4 color: #4285f4;
} }
.card:focus .cardBox.visualCardBox, .card:focus .cardBox.visualCardBox,
.card:focus .cardBox:not(.visualCardBox) .cardScalable { .card:focus .cardBox:not(.visualCardBox) .cardScalable {
border-color: #00a4dc !important border-color: #00a4dc !important;
} }
.metadataSidebarIcon { .metadataSidebarIcon {
color: #00a4dc color: #00a4dc;
} }

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

@ -1,18 +1,18 @@
.skinHeader, .skinHeader,
html { html {
color: #ddd; color: #ddd;
color: rgba(255, 255, 255, .8) color: rgba(255, 255, 255, .8);
} }
.wizardStartForm, .wizardStartForm,
.ui-corner-all, .ui-corner-all,
.ui-shadow { .ui-shadow {
background-color: #303030 background-color: #303030;
} }
.emby-collapsible-button { .emby-collapsible-button {
border-color: #383838; border-color: #383838;
border-color: rgba(255, 255, 255, .135) border-color: rgba(255, 255, 255, .135);
} }
.skinHeader-withBackground { .skinHeader-withBackground {
@ -20,7 +20,7 @@ html {
background: -webkit-gradient(linear, left top, right top, from(#291A31), color-stop(#033664), color-stop(#011432), color-stop(#141A3A), to(#291A31)); background: -webkit-gradient(linear, left top, right top, from(#291A31), color-stop(#033664), color-stop(#011432), color-stop(#141A3A), to(#291A31));
background: -webkit-linear-gradient(left, #291A31, #033664, #011432, #141A3A, #291A31); background: -webkit-linear-gradient(left, #291A31, #033664, #011432, #141A3A, #291A31);
background: -o-linear-gradient(left, #291A31, #033664, #011432, #141A3A, #291A31); background: -o-linear-gradient(left, #291A31, #033664, #011432, #141A3A, #291A31);
background: linear-gradient(to right, #291A31, #033664, #011432, #141A3A, #291A31) background: linear-gradient(to right, #291A31, #033664, #011432, #141A3A, #291A31);
} }
.skinHeader.semiTransparent { .skinHeader.semiTransparent {
@ -34,27 +34,27 @@ html {
} }
.pageTitleWithDefaultLogo { .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png) background-image: url(../../assets/img/banner-light.png);
} }
.dialog, .dialog,
html { html {
background-color: #033361 background-color: #033361;
} }
.backgroundContainer { .backgroundContainer {
background: url(bg.jpg) center top no-repeat #033361; background: url(bg.jpg) center top no-repeat #033361;
-webkit-background-size: cover; -webkit-background-size: cover;
background-size: cover background-size: cover;
} }
.backgroundContainer.withBackdrop { .backgroundContainer.withBackdrop {
opacity: .86 opacity: .86;
} }
@media (orientation:portrait) { @media (orientation:portrait) {
.backgroundContainer { .backgroundContainer {
background-position: 30% top background-position: 30% top;
} }
} }
@ -70,31 +70,31 @@ html {
.fab, .fab,
.raised { .raised {
background: rgba(0, 0, 0, .5); background: rgba(0, 0, 0, .5);
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.fab:focus, .fab:focus,
.raised:focus { .raised:focus {
background: rgba(0, 0, 0, .7) background: rgba(0, 0, 0, .7);
} }
.button-submit { .button-submit {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.button-submit:focus { .button-submit:focus {
background: #0cb0e8; background: #0cb0e8;
color: #fff color: #fff;
} }
.button-delete { .button-delete {
background: rgb(247, 0, 0); background: rgb(247, 0, 0);
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.checkboxLabel { .checkboxLabel {
color: inherit color: inherit;
} }
.checkboxListLabel, .checkboxListLabel,
@ -103,17 +103,17 @@ html {
.paperListLabel, .paperListLabel,
.textareaLabelUnfocused { .textareaLabelUnfocused {
color: #bbb; color: #bbb;
color: rgba(255, 255, 255, .7) color: rgba(255, 255, 255, .7);
} }
.inputLabelFocused, .inputLabelFocused,
.selectLabelFocused, .selectLabelFocused,
.textareaLabelFocused { .textareaLabelFocused {
color: #00a4dc color: #00a4dc;
} }
.checkboxOutline { .checkboxOutline {
border-color: currentColor border-color: currentColor;
} }
.collapseContent, .collapseContent,
@ -121,27 +121,27 @@ html {
.formDialogHeader:not(.formDialogHeader-clear), .formDialogHeader:not(.formDialogHeader-clear),
.paperList, .paperList,
.visualCardBox { .visualCardBox {
background-color: rgba(0, 0, 0, .5) background-color: rgba(0, 0, 0, .5);
} }
.defaultCardBackground1 { .defaultCardBackground1 {
background-color: #d2b019 background-color: #d2b019;
} }
.defaultCardBackground2 { .defaultCardBackground2 {
background-color: #338abb background-color: #338abb;
} }
.defaultCardBackground3 { .defaultCardBackground3 {
background-color: #6b689d background-color: #6b689d;
} }
.defaultCardBackground4 { .defaultCardBackground4 {
background-color: #dd452b background-color: #dd452b;
} }
.defaultCardBackground5 { .defaultCardBackground5 {
background-color: #5ccea9 background-color: #5ccea9;
} }
.cardText-secondary, .cardText-secondary,
@ -152,100 +152,100 @@ html {
.programSecondaryTitle, .programSecondaryTitle,
.secondaryText { .secondaryText {
color: #999; color: #999;
color: rgba(255, 255, 255, .5) color: rgba(255, 255, 255, .5);
} }
.actionsheetDivider { .actionsheetDivider {
background: #444; background: #444;
background: rgba(255, 255, 255, .14) background: rgba(255, 255, 255, .14);
} }
.cardFooter-vibrant .cardText-secondary { .cardFooter-vibrant .cardText-secondary {
color: inherit; color: inherit;
opacity: .5 opacity: .5;
} }
.actionSheetMenuItem:hover { .actionSheetMenuItem:hover {
background-color: rgba(0, 0, 0, .5) background-color: rgba(0, 0, 0, .5);
} }
.toast { .toast {
background: #303030; background: #303030;
color: #fff; color: #fff;
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.appfooter { .appfooter {
background: #033664; background: #033664;
color: #ccc; color: #ccc;
color: rgba(255, 255, 255, .78) color: rgba(255, 255, 255, .78);
} }
@supports (backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px)) { @supports (backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px)) {
.appfooter-blurred { .appfooter-blurred {
background: rgba(1, 2, 50, .7); background: rgba(1, 2, 50, .7);
backdrop-filter: blur(20px) backdrop-filter: blur(20px);
} }
} }
.itemSelectionPanel { .itemSelectionPanel {
border: 1px solid #00a4dc border: 1px solid #00a4dc;
} }
.selectionCommandsPanel { .selectionCommandsPanel {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.upNextDialog-countdownText { .upNextDialog-countdownText {
color: #00a4dc color: #00a4dc;
} }
.alphaPickerButton { .alphaPickerButton {
color: #999; color: #999;
color: rgba(255, 255, 255, .5); color: rgba(255, 255, 255, .5);
background-color: transparent background-color: transparent;
} }
.alphaPickerButton-selected { .alphaPickerButton-selected {
color: #fff color: #fff;
} }
.alphaPickerButton-tv:focus { .alphaPickerButton-tv:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff !important color: #fff !important;
} }
.detailTableBodyRow-shaded:nth-child(even) { .detailTableBodyRow-shaded:nth-child(even) {
background: #1c1c1c; background: #1c1c1c;
background: rgba(30, 30, 30, .9) background: rgba(30, 30, 30, .9);
} }
.listItem-border { .listItem-border {
border-color: rgba(255, 255, 255, .1) !important border-color: rgba(255, 255, 255, .1) !important;
} }
.listItem:focus { .listItem:focus {
background: rgba(0, 0, 0, .3) background: rgba(0, 0, 0, .3);
} }
.progressring-spiner { .progressring-spiner {
border-color: #00a4dc border-color: #00a4dc;
} }
.button-flat-accent, .button-flat-accent,
.button-link { .button-link {
color: #00a4dc color: #00a4dc;
} }
.mediaInfoText { .mediaInfoText {
color: #ddd; color: #ddd;
background: rgba(170, 170, 190, .2) background: rgba(170, 170, 190, .2);
} }
.mediaInfoTimerIcon, .mediaInfoTimerIcon,
.starIcon { .starIcon {
color: #cb272a color: #cb272a;
} }
.emby-input, .emby-input,
@ -254,36 +254,36 @@ html {
background: rgba(0, 0, 0, .5); background: rgba(0, 0, 0, .5);
border: .07em solid transparent; border: .07em solid transparent;
-webkit-border-radius: .15em; -webkit-border-radius: .15em;
border-radius: .15em border-radius: .15em;
} }
.emby-input:focus, .emby-input:focus,
.emby-textarea:focus { .emby-textarea:focus {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-select-withcolor { .emby-select-withcolor {
color: inherit; color: inherit;
background: rgba(0, 0, 0, .5); background: rgba(0, 0, 0, .5);
border: .07em solid transparent border: .07em solid transparent;
} }
.emby-select-withcolor>option { .emby-select-withcolor>option {
color: inherit; color: inherit;
background: #222 background: #222;
} }
.emby-select-withcolor:focus { .emby-select-withcolor:focus {
border-color: #00a4dc !important border-color: #00a4dc !important;
} }
.emby-select-tv-withcolor:focus { .emby-select-tv-withcolor:focus {
background-color: #00a4dc !important; background-color: #00a4dc !important;
color: #fff !important color: #fff !important;
} }
.emby-checkbox:checked+span+.checkboxOutline { .emby-checkbox:checked+span+.checkboxOutline {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-checkbox:focus+span+.checkboxOutline { .emby-checkbox:focus+span+.checkboxOutline {
@ -292,7 +292,7 @@ html {
.emby-checkbox:checked+span+.checkboxOutline, .emby-checkbox:checked+span+.checkboxOutline,
.itemProgressBarForeground { .itemProgressBarForeground {
background-color: #00a4dc background-color: #00a4dc;
} }
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline { .emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
@ -300,39 +300,39 @@ html {
} }
.itemProgressBarForeground-recording { .itemProgressBarForeground-recording {
background-color: #cb272a background-color: #cb272a;
} }
.countIndicator, .countIndicator,
.fullSyncIndicator, .fullSyncIndicator,
.playedIndicator { .playedIndicator {
background: #00a4dc background: #00a4dc;
} }
.fullSyncIndicator { .fullSyncIndicator {
color: #fff color: #fff;
} }
.mainDrawer { .mainDrawer {
background-color: rgba(0, 0, 0, .5) background-color: rgba(0, 0, 0, .5);
} }
.drawer-open { .drawer-open {
background-color: #011432 background-color: #011432;
} }
.navMenuOption:hover { .navMenuOption:hover {
background: rgba(221, 221, 221, 0.068) background: rgba(221, 221, 221, 0.068);
} }
.navMenuOption-selected { .navMenuOption-selected {
background: #00a4dc !important; background: #00a4dc !important;
color: #fff color: #fff;
} }
.emby-button.show-focus:focus { .emby-button.show-focus:focus {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.emby-tab-button { .emby-tab-button {
@ -340,7 +340,7 @@ html {
} }
.emby-tab-button-active { .emby-tab-button-active {
color: #00a4dc color: #00a4dc;
} }
.emby-tab-button.show-focus:focus { .emby-tab-button.show-focus:focus {
@ -354,57 +354,57 @@ html {
.channelPrograms, .channelPrograms,
.guide-channelHeaderCell, .guide-channelHeaderCell,
.programCell { .programCell {
border-color: rgba(255, 255, 255, .05) border-color: rgba(255, 255, 255, .05);
} }
.programCell-sports { .programCell-sports {
background: #3949ab !important background: #3949ab !important;
} }
.programCell-movie { .programCell-movie {
background: #5e35b1 !important background: #5e35b1 !important;
} }
.programCell-kids { .programCell-kids {
background: #039be5 !important background: #039be5 !important;
} }
.programCell-news { .programCell-news {
background: #43a047 !important background: #43a047 !important;
} }
.programCell-active { .programCell-active {
background: rgba(0, 0, 0, .4) !important background: rgba(0, 0, 0, .4) !important;
} }
.guide-channelHeaderCell:focus, .guide-channelHeaderCell:focus,
.programCell:focus { .programCell:focus {
background-color: #00a4dc !important; background-color: #00a4dc !important;
color: #fff !important color: #fff !important;
} }
.guide-programTextIcon { .guide-programTextIcon {
color: #1e1e1e; color: #1e1e1e;
background: #555 background: #555;
} }
.guide-headerTimeslots { .guide-headerTimeslots {
color: inherit color: inherit;
} }
.guide-date-tab-button { .guide-date-tab-button {
color: #555; color: #555;
color: rgba(255, 255, 255, .3) color: rgba(255, 255, 255, .3);
} }
.guide-date-tab-button.emby-tab-button-active, .guide-date-tab-button.emby-tab-button-active,
.guide-date-tab-button:focus { .guide-date-tab-button:focus {
color: #00a4dc color: #00a4dc;
} }
.guide-date-tab-button.show-focus:focus { .guide-date-tab-button.show-focus:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff color: #fff;
} }
.infoBanner { .infoBanner {
@ -412,54 +412,56 @@ html {
background: #111; background: #111;
padding: 1em; padding: 1em;
-webkit-border-radius: .25em; -webkit-border-radius: .25em;
border-radius: .25em border-radius: .25em;
} }
.ratingbutton-icon-withrating { .ratingbutton-icon-withrating {
color: #c33 color: #c33;
} }
.downloadbutton-icon-complete, .downloadbutton-icon-complete,
.downloadbutton-icon-on { .downloadbutton-icon-on {
color: #4285f4 color: #4285f4;
} }
.playstatebutton-icon-played { .playstatebutton-icon-played {
color: #c33 color: #c33;
} }
.repeatButton-active { .repeatButton-active {
color: #4285f4 color: #4285f4;
} }
.card:focus .cardBox.visualCardBox, .card:focus .cardBox.visualCardBox,
.card:focus .cardBox:not(.visualCardBox) .cardScalable { .card:focus .cardBox:not(.visualCardBox) .cardScalable {
border-color: #00a4dc !important border-color: #00a4dc !important;
} }
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
} }
::-webkit-scrollbar-track-piece { ::-webkit-scrollbar-track-piece {
background-color: #3b3b3b background-color: #3b3b3b;
} }
.layout-desktop ::-webkit-scrollbar { .layout-desktop ::-webkit-scrollbar {
width: 1em; width: 1em;
height: 1em height: 1em;
} }
::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:horizontal,
::-webkit-scrollbar-thumb:vertical { ::-webkit-scrollbar-thumb:vertical {
border-radius: 2px;
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
background: center no-repeat #888 background: center no-repeat #888;
} }
.timeslotHeaders-desktop::-webkit-scrollbar { .timeslotHeaders-desktop::-webkit-scrollbar {
height: .7em height: .7em;
} }
.metadataSidebarIcon { .metadataSidebarIcon {
color: #00a4dc color: #00a4dc;
} }

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

@ -1,22 +1,22 @@
.skinHeader, .skinHeader,
html { html {
color: #ddd; color: #ddd;
color: rgba(255, 255, 255, .8) color: rgba(255, 255, 255, .8);
} }
.wizardStartForm, .wizardStartForm,
.ui-corner-all, .ui-corner-all,
.ui-shadow { .ui-shadow {
background-color: #101010 background-color: #101010;
} }
.emby-collapsible-button { .emby-collapsible-button {
border-color: #383838; border-color: #383838;
border-color: rgba(255, 255, 255, .135) border-color: rgba(255, 255, 255, .135);
} }
.skinHeader-withBackground { .skinHeader-withBackground {
background-color: #101010 background-color: #101010;
} }
.skinHeader.semiTransparent { .skinHeader.semiTransparent {
@ -26,17 +26,17 @@ html {
} }
.pageTitleWithDefaultLogo { .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png) background-image: url(../../assets/img/banner-light.png);
} }
.backgroundContainer, .backgroundContainer,
.dialog, .dialog,
html { html {
background-color: #101010 background-color: #101010;
} }
.backgroundContainer.withBackdrop { .backgroundContainer.withBackdrop {
background-color: rgba(0, 0, 0, .86) background-color: rgba(0, 0, 0, .86);
} }
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
@ -51,31 +51,31 @@ html {
.fab, .fab,
.raised { .raised {
background: #303030; background: #303030;
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.fab:focus, .fab:focus,
.raised:focus { .raised:focus {
background: #383838 background: #383838;
} }
.button-submit { .button-submit {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.button-submit:focus { .button-submit:focus {
background: #0cb0e8; background: #0cb0e8;
color: #fff color: #fff;
} }
.button-delete { .button-delete {
background: rgb(247, 0, 0); background: rgb(247, 0, 0);
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.checkboxLabel { .checkboxLabel {
color: inherit color: inherit;
} }
.checkboxListLabel, .checkboxListLabel,
@ -84,17 +84,17 @@ html {
.paperListLabel, .paperListLabel,
.textareaLabelUnfocused { .textareaLabelUnfocused {
color: #bbb; color: #bbb;
color: rgba(255, 255, 255, .7) color: rgba(255, 255, 255, .7);
} }
.inputLabelFocused, .inputLabelFocused,
.selectLabelFocused, .selectLabelFocused,
.textareaLabelFocused { .textareaLabelFocused {
color: #00a4dc color: #00a4dc;
} }
.checkboxOutline { .checkboxOutline {
border-color: currentColor border-color: currentColor;
} }
.collapseContent, .collapseContent,
@ -102,27 +102,27 @@ html {
.formDialogHeader:not(.formDialogHeader-clear), .formDialogHeader:not(.formDialogHeader-clear),
.paperList, .paperList,
.visualCardBox { .visualCardBox {
background-color: #242424 background-color: #242424;
} }
.defaultCardBackground1 { .defaultCardBackground1 {
background-color: #d2b019 background-color: #d2b019;
} }
.defaultCardBackground2 { .defaultCardBackground2 {
background-color: #338abb background-color: #338abb;
} }
.defaultCardBackground3 { .defaultCardBackground3 {
background-color: #6b689d background-color: #6b689d;
} }
.defaultCardBackground4 { .defaultCardBackground4 {
background-color: #dd452b background-color: #dd452b;
} }
.defaultCardBackground5 { .defaultCardBackground5 {
background-color: #5ccea9 background-color: #5ccea9;
} }
.cardText-secondary, .cardText-secondary,
@ -133,93 +133,93 @@ html {
.programSecondaryTitle, .programSecondaryTitle,
.secondaryText { .secondaryText {
color: #999; color: #999;
color: rgba(255, 255, 255, .5) color: rgba(255, 255, 255, .5);
} }
.actionsheetDivider { .actionsheetDivider {
background: #444; background: #444;
background: rgba(255, 255, 255, .14) background: rgba(255, 255, 255, .14);
} }
.cardFooter-vibrant .cardText-secondary { .cardFooter-vibrant .cardText-secondary {
color: inherit; color: inherit;
opacity: .5 opacity: .5;
} }
.actionSheetMenuItem:hover { .actionSheetMenuItem:hover {
background-color: #242424 background-color: #242424;
} }
.toast { .toast {
background: #303030; background: #303030;
color: #fff; color: #fff;
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.appfooter { .appfooter {
background: #101010; background: #101010;
color: #ccc; color: #ccc;
color: rgba(255, 255, 255, .78) color: rgba(255, 255, 255, .78);
} }
.itemSelectionPanel { .itemSelectionPanel {
border: 1px solid #00a4dc border: 1px solid #00a4dc;
} }
.selectionCommandsPanel { .selectionCommandsPanel {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.upNextDialog-countdownText { .upNextDialog-countdownText {
color: #00a4dc color: #00a4dc;
} }
.alphaPickerButton { .alphaPickerButton {
color: #999; color: #999;
color: rgba(255, 255, 255, .5); color: rgba(255, 255, 255, .5);
background-color: transparent background-color: transparent;
} }
.alphaPickerButton-selected { .alphaPickerButton-selected {
color: #fff color: #fff;
} }
.alphaPickerButton-tv:focus { .alphaPickerButton-tv:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff !important color: #fff !important;
} }
.detailTableBodyRow-shaded:nth-child(even) { .detailTableBodyRow-shaded:nth-child(even) {
background: #1c1c1c; background: #1c1c1c;
background: rgba(30, 30, 30, .9) background: rgba(30, 30, 30, .9);
} }
.listItem-border { .listItem-border {
border-color: rgba(34, 34, 34, .9) !important border-color: rgba(34, 34, 34, .9) !important;
} }
.listItem:focus { .listItem:focus {
background: #333 background: #333;
} }
.progressring-spiner { .progressring-spiner {
border-color: #00a4dc border-color: #00a4dc;
} }
.button-flat-accent, .button-flat-accent,
.button-link { .button-link {
color: #00a4dc color: #00a4dc;
} }
.mediaInfoText { .mediaInfoText {
color: #ddd; color: #ddd;
background: rgba(170, 170, 190, .2) background: rgba(170, 170, 190, .2);
} }
.mediaInfoTimerIcon, .mediaInfoTimerIcon,
.starIcon { .starIcon {
color: #cb272a color: #cb272a;
} }
.emby-input, .emby-input,
@ -228,36 +228,36 @@ html {
background: #292929; background: #292929;
border: .07em solid #292929; border: .07em solid #292929;
-webkit-border-radius: .15em; -webkit-border-radius: .15em;
border-radius: .15em border-radius: .15em;
} }
.emby-input:focus, .emby-input:focus,
.emby-textarea:focus { .emby-textarea:focus {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-select-withcolor { .emby-select-withcolor {
color: inherit; color: inherit;
background: #292929; background: #292929;
border: .07em solid #292929 border: .07em solid #292929;
} }
.emby-select-withcolor>option { .emby-select-withcolor>option {
color: inherit; color: inherit;
background: #222 background: #222;
} }
.emby-select-withcolor:focus { .emby-select-withcolor:focus {
border-color: #00a4dc !important border-color: #00a4dc !important;
} }
.emby-select-tv-withcolor:focus { .emby-select-tv-withcolor:focus {
background-color: #00a4dc !important; background-color: #00a4dc !important;
color: #fff !important color: #fff !important;
} }
.emby-checkbox:checked+span+.checkboxOutline { .emby-checkbox:checked+span+.checkboxOutline {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-checkbox:focus+span+.checkboxOutline { .emby-checkbox:focus+span+.checkboxOutline {
@ -266,7 +266,7 @@ html {
.emby-checkbox:checked+span+.checkboxOutline, .emby-checkbox:checked+span+.checkboxOutline,
.itemProgressBarForeground { .itemProgressBarForeground {
background-color: #00a4dc background-color: #00a4dc;
} }
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline { .emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
@ -274,35 +274,35 @@ html {
} }
.itemProgressBarForeground-recording { .itemProgressBarForeground-recording {
background-color: #cb272a background-color: #cb272a;
} }
.countIndicator, .countIndicator,
.fullSyncIndicator, .fullSyncIndicator,
.playedIndicator { .playedIndicator {
background: #00a4dc background: #00a4dc;
} }
.fullSyncIndicator { .fullSyncIndicator {
color: #fff color: #fff;
} }
.mainDrawer { .mainDrawer {
background-color: #101010 background-color: #101010;
} }
.navMenuOption:hover { .navMenuOption:hover {
background: #252528 background: #252528;
} }
.navMenuOption-selected { .navMenuOption-selected {
background: #00a4dc !important; background: #00a4dc !important;
color: #fff color: #fff;
} }
.emby-button.show-focus:focus { .emby-button.show-focus:focus {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.emby-tab-button { .emby-tab-button {
@ -324,57 +324,57 @@ html {
.channelPrograms, .channelPrograms,
.guide-channelHeaderCell, .guide-channelHeaderCell,
.programCell { .programCell {
border-color: rgba(255, 255, 255, .05) border-color: rgba(255, 255, 255, .05);
} }
.programCell-sports { .programCell-sports {
background: #3949ab !important background: #3949ab !important;
} }
.programCell-movie { .programCell-movie {
background: #5e35b1 !important background: #5e35b1 !important;
} }
.programCell-kids { .programCell-kids {
background: #039be5 !important background: #039be5 !important;
} }
.programCell-news { .programCell-news {
background: #43a047 !important background: #43a047 !important;
} }
.programCell-active { .programCell-active {
background: #1e1e1e !important background: #1e1e1e !important;
} }
.guide-channelHeaderCell:focus, .guide-channelHeaderCell:focus,
.programCell:focus { .programCell:focus {
background-color: #00a4dc !important; background-color: #00a4dc !important;
color: #fff !important color: #fff !important;
} }
.guide-programTextIcon { .guide-programTextIcon {
color: #1e1e1e; color: #1e1e1e;
background: #555 background: #555;
} }
.guide-headerTimeslots { .guide-headerTimeslots {
color: inherit color: inherit;
} }
.guide-date-tab-button { .guide-date-tab-button {
color: #555; color: #555;
color: rgba(255, 255, 255, .3) color: rgba(255, 255, 255, .3);
} }
.guide-date-tab-button.emby-tab-button-active, .guide-date-tab-button.emby-tab-button-active,
.guide-date-tab-button:focus { .guide-date-tab-button:focus {
color: #00a4dc color: #00a4dc;
} }
.guide-date-tab-button.show-focus:focus { .guide-date-tab-button.show-focus:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff color: #fff;
} }
.infoBanner { .infoBanner {
@ -382,54 +382,56 @@ html {
background: #111; background: #111;
padding: 1em; padding: 1em;
-webkit-border-radius: .25em; -webkit-border-radius: .25em;
border-radius: .25em border-radius: .25em;
} }
.ratingbutton-icon-withrating { .ratingbutton-icon-withrating {
color: #c33 color: #c33;
} }
.downloadbutton-icon-complete, .downloadbutton-icon-complete,
.downloadbutton-icon-on { .downloadbutton-icon-on {
color: #4285f4 color: #4285f4;
} }
.playstatebutton-icon-played { .playstatebutton-icon-played {
color: #c33 color: #c33;
} }
.repeatButton-active { .repeatButton-active {
color: #4285f4 color: #4285f4;
} }
.card:focus .cardBox.visualCardBox, .card:focus .cardBox.visualCardBox,
.card:focus .cardBox:not(.visualCardBox) .cardScalable { .card:focus .cardBox:not(.visualCardBox) .cardScalable {
border-color: #00a4dc !important border-color: #00a4dc !important;
} }
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
} }
::-webkit-scrollbar-track-piece { ::-webkit-scrollbar-track-piece {
background-color: #3b3b3b background-color: #3b3b3b;
} }
.layout-desktop ::-webkit-scrollbar { .layout-desktop ::-webkit-scrollbar {
width: 1em; width: 1em;
height: 1em height: 1em;
} }
::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:horizontal,
::-webkit-scrollbar-thumb:vertical { ::-webkit-scrollbar-thumb:vertical {
border-radius: 2px;
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
background: center no-repeat #888 background: center no-repeat #888;
} }
.timeslotHeaders-desktop::-webkit-scrollbar { .timeslotHeaders-desktop::-webkit-scrollbar {
height: .7em height: .7em;
} }
.metadataSidebarIcon { .metadataSidebarIcon {
color: #00a4dc color: #00a4dc;
} }

432
src/themes/emby/theme.css Normal file
View file

@ -0,0 +1,432 @@
.skinHeader,
html {
color: #ddd;
color: rgba(255, 255, 255, .8);
}
.wizardStartForm,
.ui-corner-all,
.ui-shadow {
background-color: #1f1f1f;
}
.emby-collapsible-button {
border-color: #383838;
border-color: rgba(255, 255, 255, .135);
}
.skinHeader-withBackground {
background-color: #1f1f1f;
}
.skinHeader.semiTransparent {
backdrop-filter: none !important;
background-color: rgba(0, 0, 0, 0.4);
}
.pageTitleWithDefaultLogo {
background-image: url(../logowhite.png);
}
.backgroundContainer,
.dialog,
html {
background-color: #1a1a1a;
}
.backgroundContainer.withBackdrop {
background-color: rgba(0, 0, 0, .86);
}
.paper-icon-button-light:hover:not(:disabled) {
color: #52b54b;
background-color: rgba(82, 181, 75, .2);
}
.paper-icon-button-light.show-focus:focus {
color: #52b54b;
}
.fab,
.raised {
background: #303030;
color: rgba(255, 255, 255, .87);
}
.fab:focus,
.raised:focus {
background: #383838;
}
.button-submit {
background: #52b54b;
color: #fff;
}
.button-submit:focus {
background: #5ec157;
color: #fff;
}
.button-delete {
background: rgb(247, 0, 0);
color: rgba(255, 255, 255, .87);
}
.checkboxLabel {
color: inherit;
}
.checkboxListLabel,
.inputLabel,
.inputLabelUnfocused,
.paperListLabel,
.textareaLabelUnfocused {
color: #bbb;
color: rgba(255, 255, 255, .7);
}
.inputLabelFocused,
.selectLabelFocused,
.textareaLabelFocused {
color: #52b54b;
}
.checkboxOutline {
border-color: currentColor;
}
.collapseContent,
.formDialogFooter:not(.formDialogFooter-clear),
.formDialogHeader:not(.formDialogHeader-clear),
.paperList,
.visualCardBox {
background-color: #242424;
}
.defaultCardBackground1 {
background-color: #d2b019;
}
.defaultCardBackground2 {
background-color: #338abb;
}
.defaultCardBackground3 {
background-color: #6b689d;
}
.defaultCardBackground4 {
background-color: #dd452b;
}
.defaultCardBackground5 {
background-color: #5ccea9;
}
.cardText-secondary,
.fieldDescription,
.guide-programNameCaret,
.listItem .secondary,
.nowPlayingBarSecondaryText,
.programSecondaryTitle,
.secondaryText {
color: #999;
color: rgba(255, 255, 255, .5);
}
.actionsheetDivider {
background: #444;
background: rgba(255, 255, 255, .14);
}
.cardFooter-vibrant .cardText-secondary {
color: inherit;
opacity: .5;
}
.actionSheetMenuItem:hover {
background-color: #242424;
}
.toast {
background: #303030;
color: #fff;
color: rgba(255, 255, 255, .87);
}
.appfooter {
background: #101010;
color: #ccc;
color: rgba(255, 255, 255, .78);
}
.itemSelectionPanel {
border: 1px solid #52b54b;
}
.selectionCommandsPanel {
background: #52b54b;
color: #fff;
}
.upNextDialog-countdownText {
color: #52b54b;
}
.alphaPickerButton {
color: #999;
color: rgba(255, 255, 255, .5);
background-color: transparent;
}
.alphaPickerButton-selected {
color: #fff;
}
.alphaPickerButton-tv:focus {
background-color: #52b54b;
color: #fff !important;
}
.detailTableBodyRow-shaded:nth-child(even) {
background: #1c1c1c;
background: rgba(30, 30, 30, .9);
}
.listItem-border {
border-color: rgba(34, 34, 34, .9) !important;
}
.listItem:focus {
background: #333;
}
.progressring-spiner {
border-color: #52b54b;
}
.button-flat-accent,
.button-link {
color: #52b54b;
}
.mediaInfoText {
color: #ddd;
background: rgba(170, 170, 190, .2);
}
.mediaInfoTimerIcon,
.starIcon {
color: #cb272a;
}
.emby-input,
.emby-textarea {
color: inherit;
background: #292929;
border: .07em solid #292929;
border-radius: .15em;
}
.emby-input:focus,
.emby-textarea:focus {
border-color: #52b54b;
}
.emby-select-withcolor {
color: inherit;
background: #292929;
border: .07em solid #292929;
}
.emby-select-withcolor>option {
color: inherit;
background: #222;
}
.emby-select-withcolor:focus {
border-color: #52b54b !important;
}
.emby-select-tv-withcolor:focus {
background-color: #52b54b !important;
color: #fff !important;
}
.emby-checkbox:checked+span+.checkboxOutline {
border-color: #52b54b;
}
.emby-checkbox:focus+span+.checkboxOutline {
border-color: #fff;
}
.emby-checkbox:checked+span+.checkboxOutline,
.itemProgressBarForeground {
background-color: #52b54b;
}
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
border-color: #52b54b;
}
.itemProgressBarForeground-recording {
background-color: #cb272a;
}
.countIndicator,
.fullSyncIndicator,
.playedIndicator {
background: #52b54b;
}
.fullSyncIndicator {
color: #fff;
}
.mainDrawer {
background-color: #1c1c1c;
}
.navMenuOption:hover {
background: #252528;
}
.navMenuOption-selected {
background: #52b54b !important;
color: #fff;
}
.emby-button.show-focus:focus {
background: #52b54b;
color: #fff;
}
.emby-tab-button {
color: #999;
}
.emby-tab-button-active {
color: #52b54b;
}
.emby-tab-button.show-focus:focus {
color: #52b54b;
}
.emby-tab-button:hover {
color: #52b54b;
}
.channelPrograms,
.guide-channelHeaderCell,
.programCell {
border-color: rgba(255, 255, 255, .05);
}
.programCell-sports {
background: #3949ab !important;
}
.programCell-movie {
background: #5e35b1 !important;
}
.programCell-kids {
background: #039be5 !important;
}
.programCell-news {
background: #43a047 !important;
}
.programCell-active {
background: #1e1e1e !important;
}
.guide-channelHeaderCell:focus,
.programCell:focus {
background-color: #52b54b !important;
color: #fff !important;
}
.guide-programTextIcon {
color: #1e1e1e;
background: #555;
}
.guide-headerTimeslots {
color: inherit;
}
.guide-date-tab-button {
color: #555;
color: rgba(255, 255, 255, .3);
}
.guide-date-tab-button.emby-tab-button-active,
.guide-date-tab-button:focus {
color: #52b54b;
}
.guide-date-tab-button.show-focus:focus {
background-color: #52b54b;
color: #fff;
}
.infoBanner {
color: #ddd;
background: #111;
padding: 1em;
border-radius: .25em;
}
.ratingbutton-icon-withrating {
color: #c33;
}
.downloadbutton-icon-complete,
.downloadbutton-icon-on {
color: #4285f4;
}
.playstatebutton-icon-played {
color: #c33;
}
.repeatButton-active {
color: #4285f4;
}
.card:focus .cardBox.visualCardBox,
.card:focus .cardBox:not(.visualCardBox) .cardScalable {
border-color: #52b54b !important;
}
::-webkit-scrollbar-track {
box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
}
::-webkit-scrollbar-track-piece {
background-color: #3b3b3b;
}
.layout-desktop ::-webkit-scrollbar {
width: 1em;
height: 1em;
}
::-webkit-scrollbar-thumb:horizontal,
::-webkit-scrollbar-thumb:vertical {
border-radius: 2px;
background: center no-repeat #888;
}
.timeslotHeaders-desktop::-webkit-scrollbar {
height: .7em;
}
.metadataSidebarIcon {
color: #00a4dc;
}

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

@ -1,22 +1,22 @@
.skinHeader, .skinHeader,
html { html {
color: #222; color: #222;
color: rgba(0, 0, 0, .87) color: rgba(0, 0, 0, .87);
} }
.wizardStartForm, .wizardStartForm,
.ui-corner-all, .ui-corner-all,
.ui-shadow { .ui-shadow {
background-color: #303030 background-color: #303030;
} }
.emby-collapsible-button { .emby-collapsible-button {
border-color: #ccc; border-color: #ccc;
border-color: rgba(0, 0, 0, .158) border-color: rgba(0, 0, 0, .158);
} }
.collapseContent { .collapseContent {
background-color: #eaeaea background-color: #eaeaea;
} }
.skinHeader-withBackground { .skinHeader-withBackground {
@ -24,12 +24,12 @@ html {
color: #ccc; color: #ccc;
color: rgba(255, 255, 255, .87); color: rgba(255, 255, 255, .87);
-webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37); -webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37) box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
} }
.osdHeader { .osdHeader {
-webkit-box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important box-shadow: none !important;
} }
.skinHeader.semiTransparent { .skinHeader.semiTransparent {
@ -39,20 +39,20 @@ html {
} }
.pageTitleWithDefaultLogo { .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png) background-image: url(../../assets/img/banner-light.png);
} }
.backgroundContainer, .backgroundContainer,
html { html {
background-color: #f2f2f2 background-color: #f2f2f2;
} }
.backgroundContainer.withBackdrop { .backgroundContainer.withBackdrop {
background-color: rgba(255, 255, 255, .80) background-color: rgba(255, 255, 255, .80);
} }
.dialog { .dialog {
background-color: #f0f0f0 background-color: #f0f0f0;
} }
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
@ -67,30 +67,30 @@ html {
.fab, .fab,
.raised { .raised {
background: #d8d8d8; background: #d8d8d8;
color: inherit color: inherit;
} }
.fab:focus, .fab:focus,
.raised:focus { .raised:focus {
background: #ccc background: #ccc;
} }
.button-submit { .button-submit {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.button-submit:focus { .button-submit:focus {
background: #0cb0e8 background: #0cb0e8;
} }
.button-delete { .button-delete {
background: rgb(247, 0, 0); background: rgb(247, 0, 0);
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.checkboxLabel { .checkboxLabel {
color: inherit color: inherit;
} }
.checkboxListLabel, .checkboxListLabel,
@ -98,55 +98,55 @@ html {
.inputLabelUnfocused, .inputLabelUnfocused,
.paperListLabel, .paperListLabel,
.textareaLabelUnfocused { .textareaLabelUnfocused {
color: #555 color: #555;
} }
.button-link, .button-link,
.inputLabelFocused, .inputLabelFocused,
.selectLabelFocused, .selectLabelFocused,
.textareaLabelFocused { .textareaLabelFocused {
color: green color: green;
} }
.checkboxOutline { .checkboxOutline {
border-color: currentColor border-color: currentColor;
} }
.paperList, .paperList,
.visualCardBox { .visualCardBox {
background-color: #fff background-color: #fff;
} }
.defaultCardBackground1 { .defaultCardBackground1 {
background-color: #009688 background-color: #009688;
} }
.defaultCardBackground2 { .defaultCardBackground2 {
background-color: #d32f2f background-color: #d32f2f;
} }
.defaultCardBackground3 { .defaultCardBackground3 {
background-color: #0288d1 background-color: #0288d1;
} }
.defaultCardBackground4 { .defaultCardBackground4 {
background-color: #388e3c background-color: #388e3c;
} }
.defaultCardBackground5 { .defaultCardBackground5 {
background-color: #f57f17 background-color: #f57f17;
} }
.formDialogHeader:not(.formDialogHeader-clear) { .formDialogHeader:not(.formDialogHeader-clear) {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff color: #fff;
} }
.formDialogFooter:not(.formDialogFooter-clear) { .formDialogFooter:not(.formDialogFooter-clear) {
background-color: #f0f0f0; background-color: #f0f0f0;
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
border-top: 1px solid rgba(0, 0, 0, .08); border-top: 1px solid rgba(0, 0, 0, .08);
color: inherit color: inherit;
} }
.cardText-secondary, .cardText-secondary,
@ -156,92 +156,92 @@ html {
.nowPlayingBarSecondaryText, .nowPlayingBarSecondaryText,
.programSecondaryTitle, .programSecondaryTitle,
.secondaryText { .secondaryText {
color: #888 color: #888;
} }
.actionsheetDivider { .actionsheetDivider {
background: #ddd; background: #ddd;
background: rgba(0, 0, 0, .14) background: rgba(0, 0, 0, .14);
} }
.cardFooter-vibrant .cardText-secondary { .cardFooter-vibrant .cardText-secondary {
color: inherit; color: inherit;
opacity: .5 opacity: .5;
} }
.formDialogHeader a, .formDialogHeader a,
.toast { .toast {
color: #fff color: #fff;
} }
.actionSheetMenuItem:hover { .actionSheetMenuItem:hover {
background-color: #ddd background-color: #ddd;
} }
.toast { .toast {
background: #303030; background: #303030;
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.appfooter { .appfooter {
background: #282828; background: #282828;
color: #ccc; color: #ccc;
color: rgba(255, 255, 255, .78) color: rgba(255, 255, 255, .78);
} }
.nowPlayingBarSecondaryText { .nowPlayingBarSecondaryText {
color: #999 color: #999;
} }
.itemSelectionPanel { .itemSelectionPanel {
border: 1px solid #00a4dc border: 1px solid #00a4dc;
} }
.selectionCommandsPanel { .selectionCommandsPanel {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.upNextDialog-countdownText { .upNextDialog-countdownText {
color: #00a4dc color: #00a4dc;
} }
.alphaPickerButton { .alphaPickerButton {
color: #555; color: #555;
color: rgba(0, 0, 0, .7); color: rgba(0, 0, 0, .7);
background-color: transparent background-color: transparent;
} }
.alphaPickerButton-selected, .alphaPickerButton-selected,
.alphaPickerButton-tv:focus { .alphaPickerButton-tv:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff !important color: #fff !important;
} }
.detailTableBodyRow-shaded:nth-child(even) { .detailTableBodyRow-shaded:nth-child(even) {
background: #f8f8f8 background: #f8f8f8;
} }
.listItem-border { .listItem-border {
border-color: #f0f0f0 !important border-color: #f0f0f0 !important;
} }
.listItem:focus { .listItem:focus {
background: #ddd background: #ddd;
} }
.progressring-spiner { .progressring-spiner {
border-color: #00a4dc border-color: #00a4dc;
} }
.mediaInfoText { .mediaInfoText {
color: #333; color: #333;
background: #fff background: #fff;
} }
.mediaInfoTimerIcon, .mediaInfoTimerIcon,
.starIcon { .starIcon {
color: #cb272a color: #cb272a;
} }
.emby-input, .emby-input,
@ -250,23 +250,23 @@ html {
background: #fff; background: #fff;
border: .07em solid rgba(0, 0, 0, .158); border: .07em solid rgba(0, 0, 0, .158);
-webkit-border-radius: .15em; -webkit-border-radius: .15em;
border-radius: .15em border-radius: .15em;
} }
.emby-input:focus, .emby-input:focus,
.emby-textarea:focus { .emby-textarea:focus {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-select-withcolor { .emby-select-withcolor {
color: inherit; color: inherit;
background: #fff; background: #fff;
border: .07em solid rgba(0, 0, 0, .158) border: .07em solid rgba(0, 0, 0, .158);
} }
.emby-checkbox:checked+span+.checkboxOutline, .emby-checkbox:checked+span+.checkboxOutline,
.emby-select-withcolor:focus { .emby-select-withcolor:focus {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-checkbox:focus+span+.checkboxOutline { .emby-checkbox:focus+span+.checkboxOutline {
@ -275,7 +275,7 @@ html {
.emby-checkbox:checked+span+.checkboxOutline, .emby-checkbox:checked+span+.checkboxOutline,
.itemProgressBarForeground { .itemProgressBarForeground {
background-color: #00a4dc background-color: #00a4dc;
} }
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline { .emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
@ -284,44 +284,44 @@ html {
.emby-select-withcolor>option { .emby-select-withcolor>option {
color: #000; color: #000;
background: #fff background: #fff;
} }
.emby-select-tv-withcolor:focus { .emby-select-tv-withcolor:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff color: #fff;
} }
.itemProgressBarForeground-recording { .itemProgressBarForeground-recording {
background-color: #cb272a background-color: #cb272a;
} }
.countIndicator, .countIndicator,
.fullSyncIndicator, .fullSyncIndicator,
.playedIndicator { .playedIndicator {
background: #00a4dc background: #00a4dc;
} }
.fullSyncIndicator { .fullSyncIndicator {
color: #fff color: #fff;
} }
.mainDrawer { .mainDrawer {
background: #fff background: #fff;
} }
.navMenuOption:hover { .navMenuOption:hover {
background: #f2f2f2 background: #f2f2f2;
} }
.navMenuOption-selected { .navMenuOption-selected {
background: #00a4dc !important; background: #00a4dc !important;
color: #fff color: #fff;
} }
.emby-button.show-focus:focus { .emby-button.show-focus:focus {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.emby-tab-button { .emby-tab-button {
@ -343,57 +343,57 @@ html {
.channelPrograms, .channelPrograms,
.guide-channelHeaderCell, .guide-channelHeaderCell,
.programCell { .programCell {
border-color: rgba(0, 0, 0, .12) border-color: rgba(0, 0, 0, .12);
} }
.programCell-sports { .programCell-sports {
background: #3949ab !important background: #3949ab !important;
} }
.programCell-movie { .programCell-movie {
background: #5e35b1 !important background: #5e35b1 !important;
} }
.programCell-kids { .programCell-kids {
background: #039be5 !important background: #039be5 !important;
} }
.programCell-news { .programCell-news {
background: #43a047 !important background: #43a047 !important;
} }
.programCell-active { .programCell-active {
background: rgba(0, 0, 0, .1) !important background: rgba(0, 0, 0, .1) !important;
} }
.guide-channelHeaderCell:focus, .guide-channelHeaderCell:focus,
.programCell:focus { .programCell:focus {
background-color: #00a4dc !important; background-color: #00a4dc !important;
color: #fff !important color: #fff !important;
} }
.guide-programTextIcon { .guide-programTextIcon {
color: #1e1e1e; color: #1e1e1e;
background: #555 background: #555;
} }
.guide-headerTimeslots { .guide-headerTimeslots {
color: inherit color: inherit;
} }
.guide-date-tab-button { .guide-date-tab-button {
color: #555; color: #555;
color: rgba(0, 0, 0, .54) color: rgba(0, 0, 0, .54);
} }
.guide-date-tab-button.emby-tab-button-active, .guide-date-tab-button.emby-tab-button-active,
.guide-date-tab-button:focus { .guide-date-tab-button:focus {
color: #00a4dc color: #00a4dc;
} }
.guide-date-tab-button.show-focus:focus { .guide-date-tab-button.show-focus:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff color: #fff;
} }
.infoBanner { .infoBanner {
@ -401,31 +401,31 @@ html {
background: #fff3a5; background: #fff3a5;
padding: 1em; padding: 1em;
-webkit-border-radius: .25em; -webkit-border-radius: .25em;
border-radius: .25em border-radius: .25em;
} }
.ratingbutton-icon-withrating { .ratingbutton-icon-withrating {
color: #c33 color: #c33;
} }
.downloadbutton-icon-complete, .downloadbutton-icon-complete,
.downloadbutton-icon-on { .downloadbutton-icon-on {
color: #4285f4 color: #4285f4;
} }
.playstatebutton-icon-played { .playstatebutton-icon-played {
color: #c33 color: #c33;
} }
.repeatButton-active { .repeatButton-active {
color: #4285f4 color: #4285f4;
} }
.card:focus .cardBox.visualCardBox, .card:focus .cardBox.visualCardBox,
.card:focus .cardBox:not(.visualCardBox) .cardScalable { .card:focus .cardBox:not(.visualCardBox) .cardScalable {
border-color: #00a4dc !important border-color: #00a4dc !important;
} }
.metadataSidebarIcon { .metadataSidebarIcon {
color: #00a4dc color: #00a4dc;
} }

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

@ -1,18 +1,18 @@
.skinHeader, .skinHeader,
html { html {
color: #f8f8fe; color: #f8f8fe;
color: rgba(248, 248, 254, 0.973) color: rgba(248, 248, 254, 0.973);
} }
.wizardStartForm, .wizardStartForm,
.ui-corner-all, .ui-corner-all,
.ui-shadow { .ui-shadow {
background-color: #303030 background-color: #303030;
} }
.emby-collapsible-button { .emby-collapsible-button {
border-color: #383838; border-color: #383838;
border-color: rgba(255, 255, 255, .135) border-color: rgba(255, 255, 255, .135);
} }
.skinHeader-withBackground { .skinHeader-withBackground {
@ -29,32 +29,32 @@ html {
background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .6)), to(rgba(0, 0, 0, 0))); background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .6)), to(rgba(0, 0, 0, 0)));
background: -webkit-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); background: -webkit-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
background: -o-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); background: -o-linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
background: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)) background: linear-gradient(rgba(0, 0, 0, .6), rgba(0, 0, 0, 0));
background-color: rgba(0, 0, 0, .3); background-color: rgba(0, 0, 0, .3);
} }
.pageTitleWithDefaultLogo { .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png) background-image: url(../../assets/img/banner-light.png);
} }
.dialog, .dialog,
html { html {
background-color: #230c33 background-color: #230c33;
} }
.backgroundContainer { .backgroundContainer {
background: url(bg.jpg) center top no-repeat #030322; background: url(bg.jpg) center top no-repeat #030322;
-webkit-background-size: cover; -webkit-background-size: cover;
background-size: cover background-size: cover;
} }
.backgroundContainer.withBackdrop { .backgroundContainer.withBackdrop {
opacity: .86 opacity: .86;
} }
@media (orientation:portrait) { @media (orientation:portrait) {
.backgroundContainer { .backgroundContainer {
background-position: 30% top background-position: 30% top;
} }
} }
@ -91,12 +91,12 @@ progress::-webkit-progress-value {
.fab:focus, .fab:focus,
.raised:focus { .raised:focus {
background: #ff77f1 background: #ff77f1;
} }
div[data-role=controlgroup] a.ui-btn-active { div[data-role=controlgroup] a.ui-btn-active {
background: #55828b !important; background: #55828b !important;
color: #e1e5f2 !important color: #e1e5f2 !important;
} }
a[data-role=button] { a[data-role=button] {
@ -114,7 +114,7 @@ a[data-role=button] {
.button-alt, .button-alt,
.btnOption { .btnOption {
background: rgb(72, 195, 200); background: rgb(72, 195, 200);
color: rgb(225, 229, 242) color: rgb(225, 229, 242);
} }
#btnResetPassword, #btnResetPassword,
@ -128,7 +128,7 @@ a[data-role=button] {
.alphaPickerButton { .alphaPickerButton {
color: #999; color: #999;
color: rgba(255, 255, 255, .5); color: rgba(255, 255, 255, .5);
background-color: transparent background-color: transparent;
} }
#btnResetPassword:hover, #btnResetPassword:hover,
@ -150,31 +150,31 @@ a[data-role=button] {
.btnManual:hover, .btnManual:hover,
.block:hover { .block:hover {
background: rgb(12, 232, 214); background: rgb(12, 232, 214);
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.button-submit:focus { .button-submit:focus {
background: #ff77f1 background: #ff77f1;
} }
.button-delete { .button-delete {
background: rgb(247, 0, 0); background: rgb(247, 0, 0);
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.itemName { .itemName {
color: #f1f7ee color: #f1f7ee;
} }
.textareaLabel, .textareaLabel,
.sectionTitle, .sectionTitle,
.fieldDescription, .fieldDescription,
.checkboxLabel { .checkboxLabel {
color: #f1f7ee color: #f1f7ee;
} }
.checkboxLabel { .checkboxLabel {
color: inherit color: inherit;
} }
.selectLabel, .selectLabel,
@ -190,15 +190,15 @@ a[data-role=button] {
.inputLabelFocused, .inputLabelFocused,
.selectLabelFocused, .selectLabelFocused,
.textareaLabelFocused { .textareaLabelFocused {
color: #ff77f1 color: #ff77f1;
} }
.checkboxOutline { .checkboxOutline {
border-color: currentColor border-color: currentColor;
} }
.cardContent { .cardContent {
border-radius: 1.000em border-radius: 1.000em;
} }
.collapseContent, .collapseContent,
@ -207,7 +207,7 @@ a[data-role=button] {
.paperList, .paperList,
.visualCardBox { .visualCardBox {
background-color: rgba(0, 0, 0, .5); background-color: rgba(0, 0, 0, .5);
border-radius: 1.000em border-radius: 1.000em;
} }
.cardOverlayContainer { .cardOverlayContainer {
@ -219,23 +219,23 @@ a[data-role=button] {
} }
.defaultCardBackground1 { .defaultCardBackground1 {
background-color: #d2b019 background-color: #d2b019;
} }
.defaultCardBackground2 { .defaultCardBackground2 {
background-color: #338abb background-color: #338abb;
} }
.defaultCardBackground3 { .defaultCardBackground3 {
background-color: #6b689d background-color: #6b689d;
} }
.defaultCardBackground4 { .defaultCardBackground4 {
background-color: #dd452b background-color: #dd452b;
} }
.defaultCardBackground5 { .defaultCardBackground5 {
background-color: #5ccea9 background-color: #5ccea9;
} }
.cardText-secondary, .cardText-secondary,
@ -246,94 +246,94 @@ a[data-role=button] {
.programSecondaryTitle, .programSecondaryTitle,
.secondaryText { .secondaryText {
color: #999; color: #999;
color: rgba(255, 255, 255, .5) color: rgba(255, 255, 255, .5);
} }
.actionsheetDivider { .actionsheetDivider {
background: #444; background: #444;
background: rgba(255, 255, 255, .14) background: rgba(255, 255, 255, .14);
} }
.cardFooter-vibrant .cardText-secondary { .cardFooter-vibrant .cardText-secondary {
color: inherit; color: inherit;
opacity: .5 opacity: .5;
} }
.actionSheetMenuItem:hover { .actionSheetMenuItem:hover {
background-color: rgba(0, 0, 0, .5) background-color: rgba(0, 0, 0, .5);
} }
.toast { .toast {
background: #303030; background: #303030;
color: #f8f8fe; color: #f8f8fe;
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.appfooter { .appfooter {
background: #06256f; background: #06256f;
color: #ccc; color: #ccc;
color: rgba(255, 255, 255, .78) color: rgba(255, 255, 255, .78);
} }
@supports (backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px)) { @supports (backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px)) {
.appfooter-blurred { .appfooter-blurred {
background: rgba(6, 37, 111, .7); background: rgba(6, 37, 111, .7);
backdrop-filter: blur(20px) backdrop-filter: blur(20px);
} }
} }
.itemSelectionPanel { .itemSelectionPanel {
border: 1px solid #48c3c8 border: 1px solid #48c3c8;
} }
.selectionCommandsPanel { .selectionCommandsPanel {
background: #48c3c8; background: #48c3c8;
color: #f8f8fe color: #f8f8fe;
} }
.upNextDialog-countdownText { .upNextDialog-countdownText {
color: #48c3c8 color: #48c3c8;
} }
.alphaPickerButton-selected { .alphaPickerButton-selected {
color: #0ce8d6 color: #0ce8d6;
} }
.alphaPickerButton-tv:focus { .alphaPickerButton-tv:focus {
background: #ff77f1; background: #ff77f1;
color: #f8f8fe !important color: #f8f8fe !important;
} }
.detailTableBodyRow-shaded:nth-child(even) { .detailTableBodyRow-shaded:nth-child(even) {
background: #1c1c1c; background: #1c1c1c;
background: rgba(30, 30, 30, .9) background: rgba(30, 30, 30, .9);
} }
.listItem-border { .listItem-border {
border-color: rgba(255, 255, 255, .1) !important border-color: rgba(255, 255, 255, .1) !important;
} }
.listItem:focus { .listItem:focus {
background: rgba(0, 0, 0, .3) background: rgba(0, 0, 0, .3);
} }
.progressring-spiner { .progressring-spiner {
border-color: #48c3c8 border-color: #48c3c8;
} }
.button-flat-accent, .button-flat-accent,
.button-link { .button-link {
color: #48c3c8 color: #48c3c8;
} }
.mediaInfoText { .mediaInfoText {
color: #f8f8fe; color: #f8f8fe;
background: rgba(170, 170, 190, .2) background: rgba(170, 170, 190, .2);
} }
.mediaInfoTimerIcon, .mediaInfoTimerIcon,
.starIcon { .starIcon {
color: #f2b01e color: #f2b01e;
} }
.emby-input, .emby-input,
@ -342,32 +342,32 @@ a[data-role=button] {
background: rgba(0, 0, 0, .5); background: rgba(0, 0, 0, .5);
border: .07em solid transparent; border: .07em solid transparent;
-webkit-border-radius: .15em; -webkit-border-radius: .15em;
border-radius: .15em border-radius: .15em;
} }
.emby-input:focus, .emby-input:focus,
.emby-textarea:focus { .emby-textarea:focus {
border-color: #ff77f1 border-color: #ff77f1;
} }
.emby-select-withcolor { .emby-select-withcolor {
color: inherit; color: inherit;
background: rgba(0, 0, 0, .5); background: rgba(0, 0, 0, .5);
border: .07em solid transparent border: .07em solid transparent;
} }
.emby-select-withcolor>option { .emby-select-withcolor>option {
color: inherit; color: inherit;
background: #030322d7 background: #030322d7;
} }
.emby-select-withcolor:focus { .emby-select-withcolor:focus {
border-color: #ff77f1 !important border-color: #ff77f1 !important;
} }
.emby-select-tv-withcolor:focus { .emby-select-tv-withcolor:focus {
background-color: #ff77f1 !important; background-color: #ff77f1 !important;
color: #fff !important color: #fff !important;
} }
.emby-checkbox:checked+span+.checkboxOutline { .emby-checkbox:checked+span+.checkboxOutline {
@ -392,7 +392,7 @@ a[data-role=button] {
} }
.itemProgressBarForeground-recording { .itemProgressBarForeground-recording {
background-color: #cb272a background-color: #cb272a;
} }
.countIndicator, .countIndicator,
@ -402,30 +402,30 @@ a[data-role=button] {
} }
.fullSyncIndicator { .fullSyncIndicator {
color: #fff color: #fff;
} }
.mainDrawer { .mainDrawer {
color: #f8f8fe; color: #f8f8fe;
background: rgba(0, 0, 0, .5) background: rgba(0, 0, 0, .5);
} }
.drawer-open { .drawer-open {
background-color: #030322 background-color: #030322;
} }
.navMenuOption:hover { .navMenuOption:hover {
background: rgba(221, 221, 221, 0.068) background: rgba(221, 221, 221, 0.068);
} }
.navMenuOption-selected { .navMenuOption-selected {
background: #6f0765 !important; background: #6f0765 !important;
color: #f8f8fe color: #f8f8fe;
} }
.emby-button.show-focus:focus { .emby-button.show-focus:focus {
background: #8ae9c1; background: #8ae9c1;
color: #f8f8fe color: #f8f8fe;
} }
.emby-tab-button { .emby-tab-button {
@ -447,57 +447,57 @@ a[data-role=button] {
.channelPrograms, .channelPrograms,
.guide-channelHeaderCell, .guide-channelHeaderCell,
.programCell { .programCell {
border-color: rgba(255, 255, 255, .05) border-color: rgba(255, 255, 255, .05);
} }
.programCell-sports { .programCell-sports {
background: #3949ab !important background: #3949ab !important;
} }
.programCell-movie { .programCell-movie {
background: #5e35b1 !important background: #5e35b1 !important;
} }
.programCell-kids { .programCell-kids {
background: #039be5 !important background: #039be5 !important;
} }
.programCell-news { .programCell-news {
background: #43a047 !important background: #43a047 !important;
} }
.programCell-active { .programCell-active {
background: rgba(0, 0, 0, .4) !important background: rgba(0, 0, 0, .4) !important;
} }
.guide-channelHeaderCell:focus, .guide-channelHeaderCell:focus,
.programCell:focus { .programCell:focus {
background-color: #48c3c8 !important; background-color: #48c3c8 !important;
color: #fff !important color: #fff !important;
} }
.guide-programTextIcon { .guide-programTextIcon {
color: #1e1e1e; color: #1e1e1e;
background: #555 background: #555;
} }
.guide-headerTimeslots { .guide-headerTimeslots {
color: inherit color: inherit;
} }
.guide-date-tab-button { .guide-date-tab-button {
color: #555; color: #555;
color: rgba(255, 255, 255, .3) color: rgba(255, 255, 255, .3);
} }
.guide-date-tab-button.emby-tab-button-active, .guide-date-tab-button.emby-tab-button-active,
.guide-date-tab-button:focus { .guide-date-tab-button:focus {
color: #ff77f1 color: #ff77f1;
} }
.guide-date-tab-button.show-focus:focus { .guide-date-tab-button.show-focus:focus {
background-color: #48c3c8; background-color: #48c3c8;
color: #fff color: #fff;
} }
.infoBanner { .infoBanner {
@ -505,24 +505,24 @@ a[data-role=button] {
background: #dbe6ff; background: #dbe6ff;
padding: 1em; padding: 1em;
-webkit-border-radius: .25em; -webkit-border-radius: .25em;
border-radius: .25em border-radius: .25em;
} }
.ratingbutton-icon-withrating { .ratingbutton-icon-withrating {
color: #c33 color: #c33;
} }
.downloadbutton-icon-complete, .downloadbutton-icon-complete,
.downloadbutton-icon-on { .downloadbutton-icon-on {
color: #4285f4 color: #4285f4;
} }
.playstatebutton-icon-played { .playstatebutton-icon-played {
color: #c33 color: #c33;
} }
.repeatButton-active { .repeatButton-active {
color: #4285f4 color: #4285f4;
} }
.personCard .cardScalable { .personCard .cardScalable {
@ -532,36 +532,38 @@ a[data-role=button] {
.card:focus .cardBox.visualCardBox, .card:focus .cardBox.visualCardBox,
.card:focus .cardBox:not(.visualCardBox) .cardScalable { .card:focus .cardBox:not(.visualCardBox) .cardScalable {
border-color: #ff77f1 !important border-color: #ff77f1 !important;
} }
.layout-desktop, .layout-desktop,
.scrollY { .scrollY {
scrollbar-width: thin; scrollbar-width: thin;
scrollbar-color: #888 rgba(59, 59, 59, 0.5) scrollbar-color: #888 rgba(59, 59, 59, 0.5);
} }
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
} }
::-webkit-scrollbar-track-piece { ::-webkit-scrollbar-track-piece {
background-color: rgba(59, 59, 59, 0.5) background-color: rgba(59, 59, 59, 0.5);
} }
.layout-desktop ::-webkit-scrollbar { .layout-desktop ::-webkit-scrollbar {
width: .4em; width: .4em;
height: 1em height: 1em;
} }
::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:horizontal,
::-webkit-scrollbar-thumb:vertical { ::-webkit-scrollbar-thumb:vertical {
border-radius: 2px;
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
background: center no-repeat #888 background: center no-repeat #888;
} }
.timeslotHeaders-desktop::-webkit-scrollbar { .timeslotHeaders-desktop::-webkit-scrollbar {
height: .7em height: .7em;
} }
.mediaInfoOfficialRating { .mediaInfoOfficialRating {
@ -571,7 +573,7 @@ a[data-role=button] {
} }
.metadataSidebarIcon { .metadataSidebarIcon {
color: #dbe6ff color: #dbe6ff;
} }
.personCard .overflowPortraitCard { .personCard .overflowPortraitCard {

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

@ -1,23 +1,23 @@
html { html {
color: #eee; color: #eee;
color: rgba(255, 255, 255, .9); color: rgba(255, 255, 255, .9);
background-color: #0f3562 background-color: #0f3562;
} }
.wizardStartForm, .wizardStartForm,
.ui-corner-all, .ui-corner-all,
.ui-shadow { .ui-shadow {
background-color: #0c2450 background-color: #0c2450;
} }
.emby-collapsible-button { .emby-collapsible-button {
border-color: #383838; border-color: #383838;
border-color: rgba(255, 255, 255, .135) border-color: rgba(255, 255, 255, .135);
} }
.skinHeader { .skinHeader {
color: #ccc; color: #ccc;
color: rgba(255, 255, 255, .78) color: rgba(255, 255, 255, .78);
} }
.formDialogHeader:not(.formDialogHeader-clear), .formDialogHeader:not(.formDialogHeader-clear),
@ -40,7 +40,7 @@ html {
} }
.pageTitleWithDefaultLogo { .pageTitleWithDefaultLogo {
background-image: url(../../assets/img/banner-light.png) background-image: url(../../assets/img/banner-light.png);
} }
.backgroundContainer, .backgroundContainer,
@ -53,7 +53,7 @@ html {
} }
.backgroundContainer.withBackdrop { .backgroundContainer.withBackdrop {
background: rgba(17, 98, 164, .9) background: rgba(17, 98, 164, .9);
} }
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
@ -68,31 +68,31 @@ html {
.fab, .fab,
.raised { .raised {
background: #082845; background: #082845;
color: #fff color: #fff;
} }
.fab:focus, .fab:focus,
.raised:focus { .raised:focus {
background: #143451 background: #143451;
} }
.button-submit { .button-submit {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.button-submit:focus { .button-submit:focus {
background: #0cb0e8; background: #0cb0e8;
color: #fff color: #fff;
} }
.button-delete { .button-delete {
background: rgb(247, 0, 0); background: rgb(247, 0, 0);
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.checkboxLabel { .checkboxLabel {
color: inherit color: inherit;
} }
.checkboxListLabel, .checkboxListLabel,
@ -101,43 +101,43 @@ html {
.paperListLabel, .paperListLabel,
.textareaLabelUnfocused { .textareaLabelUnfocused {
color: #bbb; color: #bbb;
color: rgba(255, 255, 255, .7) color: rgba(255, 255, 255, .7);
} }
.inputLabelFocused, .inputLabelFocused,
.selectLabelFocused, .selectLabelFocused,
.textareaLabelFocused { .textareaLabelFocused {
color: #00a4dc color: #00a4dc;
} }
.checkboxOutline { .checkboxOutline {
border-color: currentColor border-color: currentColor;
} }
.collapseContent, .collapseContent,
.paperList, .paperList,
.visualCardBox { .visualCardBox {
background-color: #0f3562 background-color: #0f3562;
} }
.defaultCardBackground1 { .defaultCardBackground1 {
background-color: #d2b019 background-color: #d2b019;
} }
.defaultCardBackground2 { .defaultCardBackground2 {
background-color: #338abb background-color: #338abb;
} }
.defaultCardBackground3 { .defaultCardBackground3 {
background-color: #6b689d background-color: #6b689d;
} }
.defaultCardBackground4 { .defaultCardBackground4 {
background-color: #dd452b background-color: #dd452b;
} }
.defaultCardBackground5 { .defaultCardBackground5 {
background-color: #5ccea9 background-color: #5ccea9;
} }
.cardText-secondary, .cardText-secondary,
@ -148,23 +148,23 @@ html {
.programSecondaryTitle, .programSecondaryTitle,
.secondaryText { .secondaryText {
color: #999; color: #999;
color: rgba(255, 255, 255, .5) color: rgba(255, 255, 255, .5);
} }
.actionsheetDivider { .actionsheetDivider {
background: #ddd; background: #ddd;
background: rgba(255, 255, 255, .14) background: rgba(255, 255, 255, .14);
} }
.cardFooter-vibrant .cardText-secondary { .cardFooter-vibrant .cardText-secondary {
color: inherit; color: inherit;
opacity: .5 opacity: .5;
} }
.toast { .toast {
background: #081b3b; background: #081b3b;
color: #fff; color: #fff;
color: rgba(255, 255, 255, .87) color: rgba(255, 255, 255, .87);
} }
.appfooter, .appfooter,
@ -178,60 +178,60 @@ html {
} }
.itemSelectionPanel { .itemSelectionPanel {
border: 1px solid #00a4dc border: 1px solid #00a4dc;
} }
.selectionCommandsPanel { .selectionCommandsPanel {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.upNextDialog-countdownText { .upNextDialog-countdownText {
color: #00a4dc color: #00a4dc;
} }
.alphaPickerButton { .alphaPickerButton {
color: #999; color: #999;
color: rgba(255, 255, 255, .5); color: rgba(255, 255, 255, .5);
background-color: transparent background-color: transparent;
} }
.alphaPickerButton-selected, .alphaPickerButton-selected,
.alphaPickerButton-tv:focus { .alphaPickerButton-tv:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff !important color: #fff !important;
} }
.detailTableBodyRow-shaded:nth-child(even) { .detailTableBodyRow-shaded:nth-child(even) {
background: #1c1c1c; background: #1c1c1c;
background: rgba(0, 0, 0, .3) background: rgba(0, 0, 0, .3);
} }
.listItem-border { .listItem-border {
border-color: rgba(0, 0, 0, .3) !important border-color: rgba(0, 0, 0, .3) !important;
} }
.listItem:focus { .listItem:focus {
background: #333 background: #333;
} }
.progressring-spiner { .progressring-spiner {
border-color: #00a4dc border-color: #00a4dc;
} }
.button-flat-accent, .button-flat-accent,
.button-link { .button-link {
color: #00a4dc color: #00a4dc;
} }
.mediaInfoText { .mediaInfoText {
color: #ddd; color: #ddd;
background: rgba(170, 170, 190, .2) background: rgba(170, 170, 190, .2);
} }
.mediaInfoTimerIcon, .mediaInfoTimerIcon,
.starIcon { .starIcon {
color: #cb272a color: #cb272a;
} }
.emby-input, .emby-input,
@ -240,23 +240,23 @@ html {
background: rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .2);
border: .07em solid rgba(255, 255, 255, .135); border: .07em solid rgba(255, 255, 255, .135);
-webkit-border-radius: .15em; -webkit-border-radius: .15em;
border-radius: .15em border-radius: .15em;
} }
.emby-input:focus, .emby-input:focus,
.emby-textarea:focus { .emby-textarea:focus {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-select-withcolor { .emby-select-withcolor {
color: inherit; color: inherit;
background: rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .2);
border: .07em solid rgba(255, 255, 255, .135) border: .07em solid rgba(255, 255, 255, .135);
} }
.emby-checkbox:checked+span+.checkboxOutline, .emby-checkbox:checked+span+.checkboxOutline,
.emby-select-withcolor:focus { .emby-select-withcolor:focus {
border-color: #00a4dc border-color: #00a4dc;
} }
.emby-checkbox:focus+span+.checkboxOutline { .emby-checkbox:focus+span+.checkboxOutline {
@ -265,7 +265,7 @@ html {
.emby-checkbox:checked+span+.checkboxOutline, .emby-checkbox:checked+span+.checkboxOutline,
.itemProgressBarForeground { .itemProgressBarForeground {
background-color: #00a4dc background-color: #00a4dc;
} }
.emby-checkbox:focus:not(:checked)+span+.checkboxOutline { .emby-checkbox:focus:not(:checked)+span+.checkboxOutline {
@ -274,48 +274,48 @@ html {
.emby-select-withcolor>option { .emby-select-withcolor>option {
color: #000; color: #000;
background: #fff background: #fff;
} }
.emby-select-tv-withcolor:focus { .emby-select-tv-withcolor:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff color: #fff;
} }
.itemProgressBarForeground-recording { .itemProgressBarForeground-recording {
background-color: #cb272a background-color: #cb272a;
} }
.countIndicator, .countIndicator,
.fullSyncIndicator, .fullSyncIndicator,
.playedIndicator { .playedIndicator {
background: #00a4dc background: #00a4dc;
} }
.fullSyncIndicator { .fullSyncIndicator {
color: #fff color: #fff;
} }
.mainDrawer { .mainDrawer {
background-color: #0f3562; background-color: #0f3562;
color: #ccc; color: #ccc;
color: rgba(255, 255, 255, .7) color: rgba(255, 255, 255, .7);
} }
.actionSheetMenuItem:hover, .actionSheetMenuItem:hover,
.navMenuOption:hover { .navMenuOption:hover {
background: #252528; background: #252528;
background: rgba(0, 0, 0, .2) background: rgba(0, 0, 0, .2);
} }
.navMenuOption-selected { .navMenuOption-selected {
background: #00a4dc !important; background: #00a4dc !important;
color: #fff color: #fff;
} }
.emby-button.show-focus:focus { .emby-button.show-focus:focus {
background: #00a4dc; background: #00a4dc;
color: #fff color: #fff;
} }
.emby-tab-button { .emby-tab-button {
@ -323,7 +323,7 @@ html {
} }
.emby-tab-button-active { .emby-tab-button-active {
color: #fff color: #fff;
} }
.emby-tab-button.show-focus:focus { .emby-tab-button.show-focus:focus {
@ -338,57 +338,57 @@ html {
.guide-channelHeaderCell, .guide-channelHeaderCell,
.programCell { .programCell {
border-color: #999; border-color: #999;
border-color: rgba(255, 255, 255, .1) border-color: rgba(255, 255, 255, .1);
} }
.programCell-sports { .programCell-sports {
background: #3949ab !important background: #3949ab !important;
} }
.programCell-movie { .programCell-movie {
background: #5e35b1 !important background: #5e35b1 !important;
} }
.programCell-kids { .programCell-kids {
background: #039be5 !important background: #039be5 !important;
} }
.programCell-news { .programCell-news {
background: #43a047 !important background: #43a047 !important;
} }
.programCell-active { .programCell-active {
background: rgba(0, 0, 0, .3) !important background: rgba(0, 0, 0, .3) !important;
} }
.guide-channelHeaderCell:focus, .guide-channelHeaderCell:focus,
.programCell:focus { .programCell:focus {
background-color: #00a4dc !important; background-color: #00a4dc !important;
color: #fff !important color: #fff !important;
} }
.guide-programTextIcon { .guide-programTextIcon {
color: #1e1e1e; color: #1e1e1e;
background: #555 background: #555;
} }
.guide-headerTimeslots { .guide-headerTimeslots {
color: inherit color: inherit;
} }
.guide-date-tab-button { .guide-date-tab-button {
color: #555; color: #555;
color: rgba(255, 255, 255, .3) color: rgba(255, 255, 255, .3);
} }
.guide-date-tab-button.emby-tab-button-active, .guide-date-tab-button.emby-tab-button-active,
.guide-date-tab-button:focus { .guide-date-tab-button:focus {
color: #00a4dc color: #00a4dc;
} }
.guide-date-tab-button.show-focus:focus { .guide-date-tab-button.show-focus:focus {
background-color: #00a4dc; background-color: #00a4dc;
color: #fff color: #fff;
} }
.infoBanner { .infoBanner {
@ -396,52 +396,52 @@ html {
background: #fff3a5; background: #fff3a5;
padding: 1em; padding: 1em;
-webkit-border-radius: .25em; -webkit-border-radius: .25em;
border-radius: .25em border-radius: .25em;
} }
.ratingbutton-icon-withrating { .ratingbutton-icon-withrating {
color: #c33 color: #c33;
} }
.downloadbutton-icon-complete, .downloadbutton-icon-complete,
.downloadbutton-icon-on { .downloadbutton-icon-on {
color: #4285f4 color: #4285f4;
} }
.playstatebutton-icon-played { .playstatebutton-icon-played {
color: #c33 color: #c33;
} }
.repeatButton-active { .repeatButton-active {
color: #4285f4 color: #4285f4;
} }
.card:focus .cardBox.visualCardBox, .card:focus .cardBox.visualCardBox,
.card:focus .cardBox:not(.visualCardBox) .cardScalable { .card:focus .cardBox:not(.visualCardBox) .cardScalable {
border-color: #fff !important border-color: #fff !important;
} }
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3) -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
} }
::-webkit-scrollbar-track-piece { ::-webkit-scrollbar-track-piece {
background-color: #081b3b background-color: #081b3b;
} }
.layout-desktop ::-webkit-scrollbar { .layout-desktop ::-webkit-scrollbar {
width: 1em; width: 1em;
height: 1em height: 1em;
} }
::-webkit-scrollbar-thumb:horizontal, ::-webkit-scrollbar-thumb:horizontal,
::-webkit-scrollbar-thumb:vertical { ::-webkit-scrollbar-thumb:vertical {
border-radius: 2px; border-radius: 2px;
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
background: center no-repeat rgba(255, 255, 255, .7) background: center no-repeat rgba(255, 255, 255, .7);
} }
.metadataSidebarIcon { .metadataSidebarIcon {
color: #00a4dc color: #00a4dc;
} }