diff --git a/favicon.ico b/favicon.ico index 4d7e2ff..b44331a 100644 Binary files a/favicon.ico and b/favicon.ico differ diff --git a/modules/appheader/appheader.css b/modules/appheader/appheader.css index 0de384a..11bfcc1 100644 --- a/modules/appheader/appheader.css +++ b/modules/appheader/appheader.css @@ -1 +1,311 @@ -:root{--headerlogo-background-position:left center}[dir=rtl]:root{--headerlogo-background-position:right center}.pageTitle{vertical-align:middle;margin:0;-webkit-align-items:center;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pageTitleWithLogo{background-position:left center;background-position:var(--headerlogo-background-position);background-size:contain;background-repeat:no-repeat;width:10.25em;height:1.25em}@media all and (orientation:portrait){.pageTitle:not(.pageTitleWithLogo){font-size:1.17em}}.pageTitleWithDefaultLogo{width:4.7em}.darkContentContainer .pageTitleWithDefaultLogo{background-image:url(../themes/logowhite.png)}.headerButton{-webkit-flex-shrink:0;flex-shrink:0}@supports selector(:hover) and (display:revert) and (column-gap:1em){.headerLeft,.headerRight{-webkit-column-gap:.55em;column-gap:.55em}.headerSectionItem{margin:0!important}.headerSelectedPlayer{-webkit-margin-end:-.5em!important;margin-inline-end:-.5em!important}}.pageTitle-marginstart{-webkit-margin-start:.5em!important;margin-inline-start:.5em!important}@media all and (display-mode:minimal-ui){.headerBackButton-showfullscreen{display:none!important}}.headerUserButtonImage{border-radius:1000px}.headroom-hidden.headroom-scrolling .headerSection{visibility:hidden}.skinHeader{container-type:inline-size;container-name:appheader}@supports (height:calc(3.125em + 2 * max(3em,4em))){.skinHeader{padding-top:max(1.2em,env(safe-area-inset-top,0))}}.skinHeader-withnowplaying{padding-top:0}@media all and (min-width:60em){.headerHomeButton-withdockeddrawer,.headerMenuButton-withdockeddrawer{display:none!important}.skinHeader-withfulldrawer .pageTitleWithDefaultLogo{display:none}.skinHeader-withdockeddrawer{-webkit-padding-start:1.4em;padding-inline-start:1.4em}}.appHeader-tv.semiTransparent{text-shadow:.14em .14em .28em rgba(0,0,0,.45)}.headerMiddle{overflow:hidden;-webkit-flex-grow:1;flex-grow:1;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;margin:0 auto}.headerMiddle-tv{margin-top:.4em}.headerMiddle-withSectionTabs{width:60%}.headerLeft{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;overflow:hidden;-webkit-padding-start:.8em;padding-inline-start:.8em;-webkit-flex-grow:1;flex-grow:1;max-width:60%}.headerRight{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:flex-end;justify-content:flex-end;white-space:nowrap;-webkit-padding-end:.85em;padding-inline-end:.85em;-webkit-flex-grow:0;flex-grow:0;-webkit-margin-start:auto;margin-inline-start:auto;max-width:40%}.headerLeft,.headerRight{min-height:3.127em;box-sizing:border-box;-webkit-flex-shrink:1;flex-shrink:1;-webkit-flex-basis:auto;flex-basis:auto}.headerTop-withSectionTabs .headerLeft,.headerTop-withSectionTabs .headerRight{width:20%}@media not all and (min-width:120em){.headerTop-withSectionTabs:not(.headerTop-tv-withSectionTabs){-webkit-flex-wrap:wrap;flex-wrap:wrap}.headerTop-withSectionTabs:not(.headerTop-tv-withSectionTabs) .headerLeft{width:70%;max-width:initial}.headerTop-withSectionTabs:not(.headerTop-tv-withSectionTabs) .headerRight{max-width:initial}.headerMiddle-withSectionTabs:not(.headerMiddle-tv){-webkit-flex-grow:initial!important;flex-grow:initial!important;-webkit-flex-basis:100%;flex-basis:100%;-webkit-order:3;order:3;margin-top:.75em;width:initial}}@media (pointer:fine){.adjustHeaderForEmbeddedScroll{right:1.08em;inset-inline-start:0;inset-inline-end:1.08em}}.sectionTabs{text-align:center}.headerClock{margin:0 .25em;display:inline-block;vertical-align:middle;font-weight:600;font-size:118%}.headerSelectedPlayer{font-weight:400;max-width:10em;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.headerHelpButton{color:#42a5f5!important}@media not all and (min-width:37.5em){.headerLeft{max-width:calc(100% - 20ch)}.headerRight{max-width:20ch}.headerSelectedPlayer{display:none}}.headerTop-tv-withSectionTabs-hideTitle .pageTitle:not(.pageTitleWithDefaultLogo){display:none!important}.headerTop-tv-withSectionTabs .headerHelpButton{display:none!important}@media not all and (min-width:50em){.headerSettingsButton{display:none!important}}.btnHeaderPremiere{-webkit-margin-end:1em;margin-inline-end:1em}@media not all and (min-width:48em){.btnHeaderPremiere{display:none!important}}.tabs-viewmenubar{font-size:112%;border-radius:100em;display:-webkit-flex;display:flex}@media not all and (min-height:40em),not all and (min-width:66em){.withHeaderTabs:not(.layout-tv):root{--extra-padding-top:1.1em}.tabs-viewmenubar-backgroundcontainer:not(.tabs-viewmenubar-backgroundcontainer-tv){background:0 0!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.tabs-viewmenubar-slider:not(.tabs-viewmenubar-slider-tv){-webkit-padding-start:1em;padding-inline-start:1em;-webkit-padding-end:1em;padding-inline-end:1em}}@media all and (min-width:120em){.tabs-viewmenubar{font-size:116%;max-width:90%}.headerTop-withSectionTabs .headerLeft{-webkit-flex-grow:0;flex-grow:0}}.headerTop-tv-withSectionTabs .headerLeft{-webkit-flex-grow:0;flex-grow:0}.tabs-viewmenubar-tv{max-width:90%;font-size:inherit}@media all and (min-width:130em){.tabs-viewmenubar{max-width:100%}}.tabs-viewmenubar-slider{padding:.25em}.main-tab-button{padding:.25em 1.76ch!important;border-radius:100em!important}.headerNowPlaying{-webkit-flex-basis:100%;flex-basis:100%;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;padding:0 2ch;padding-top:env(safe-area-inset-top,0);height:4em;box-sizing:border-box;margin-bottom:.8em}@supports (height:calc(3.125em + 2 * max(3em,4em))){.headerNowPlaying{height:calc(4em + env(safe-area-inset-top,0))}} \ No newline at end of file +:root { + --headerlogo-background-position: left center; +} +[dir="rtl"]:root { + --headerlogo-background-position: right center; +} +.pageTitle { + vertical-align: middle; + margin: 0; + -webkit-align-items: center; + align-items: center; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.pageTitleWithLogo { + background-position: left center; + background-position: var(--headerlogo-background-position); + background-size: contain; + background-repeat: no-repeat; + width: 10.25em; + height: 2em; + padding-left: 5em; +} +@media all and (orientation: portrait) { + .pageTitle:not(.pageTitleWithLogo) { + font-size: 1.17em; + } +} +.pageTitleWithDefaultLogo { + width: 4.7em; +} +.darkContentContainer .pageTitleWithDefaultLogo { + background-image: url(../themes/logowhite.png); +} +.headerButton { + -webkit-flex-shrink: 0; + flex-shrink: 0; +} +@supports selector(:hover) and (display: revert) and (column-gap: 1em) { + .headerLeft, + .headerRight { + -webkit-column-gap: 0.55em; + column-gap: 0.55em; + } + .headerSectionItem { + margin: 0 !important; + } + .headerSelectedPlayer { + -webkit-margin-end: -0.5em !important; + margin-inline-end: -0.5em !important; + } +} +.pageTitle-marginstart { + -webkit-margin-start: 0.5em !important; + margin-inline-start: 0.5em !important; +} +@media all and (display-mode: minimal-ui) { + .headerBackButton-showfullscreen { + display: none !important; + } +} +.headerUserButtonImage { + border-radius: 1000px; +} +.headroom-hidden.headroom-scrolling .headerSection { + visibility: hidden; +} +.skinHeader { + container-type: inline-size; + container-name: appheader; +} +@supports (height: calc(3.125em + 2 * max(3em, 4em))) { + .skinHeader { + padding-top: max(1.2em, env(safe-area-inset-top, 0)); + } +} +.skinHeader-withnowplaying { + padding-top: 0; +} +@media all and (min-width: 60em) { + .headerHomeButton-withdockeddrawer, + .headerMenuButton-withdockeddrawer { + display: none !important; + } + .skinHeader-withfulldrawer .pageTitleWithDefaultLogo { + display: none; + } + .skinHeader-withdockeddrawer { + -webkit-padding-start: 1.4em; + padding-inline-start: 1.4em; + } +} +.appHeader-tv.semiTransparent { + text-shadow: 0.14em 0.14em 0.28em rgba(0, 0, 0, 0.45); +} +.headerMiddle { + overflow: hidden; + -webkit-flex-grow: 1; + flex-grow: 1; + display: -webkit-flex; + display: flex; + -webkit-align-items: center; + align-items: center; + -webkit-justify-content: center; + justify-content: center; + margin: 0 auto; +} +.headerMiddle-tv { + margin-top: 0.4em; +} +.headerMiddle-withSectionTabs { + width: 60%; +} +.headerLeft { + display: -webkit-flex; + display: flex; + -webkit-align-items: center; + align-items: center; + overflow: hidden; + -webkit-padding-start: 0.8em; + padding-inline-start: 0.8em; + -webkit-flex-grow: 1; + flex-grow: 1; + max-width: 60%; +} +.headerRight { + display: -webkit-flex; + display: flex; + -webkit-align-items: center; + align-items: center; + -webkit-justify-content: flex-end; + justify-content: flex-end; + white-space: nowrap; + -webkit-padding-end: 0.85em; + padding-inline-end: 0.85em; + -webkit-flex-grow: 0; + flex-grow: 0; + -webkit-margin-start: auto; + margin-inline-start: auto; + max-width: 40%; +} +.headerLeft, +.headerRight { + min-height: 3.127em; + box-sizing: border-box; + -webkit-flex-shrink: 1; + flex-shrink: 1; + -webkit-flex-basis: auto; + flex-basis: auto; +} +.headerTop-withSectionTabs .headerLeft, +.headerTop-withSectionTabs .headerRight { + width: 20%; +} +@media not all and (min-width: 120em) { + .headerTop-withSectionTabs:not(.headerTop-tv-withSectionTabs) { + -webkit-flex-wrap: wrap; + flex-wrap: wrap; + } + .headerTop-withSectionTabs:not(.headerTop-tv-withSectionTabs) .headerLeft { + width: 70%; + max-width: initial; + } + .headerTop-withSectionTabs:not(.headerTop-tv-withSectionTabs) .headerRight { + max-width: initial; + } + .headerMiddle-withSectionTabs:not(.headerMiddle-tv) { + -webkit-flex-grow: initial !important; + flex-grow: initial !important; + -webkit-flex-basis: 100%; + flex-basis: 100%; + -webkit-order: 3; + order: 3; + margin-top: 0.75em; + width: initial; + } +} +@media (pointer: fine) { + .adjustHeaderForEmbeddedScroll { + right: 1.08em; + inset-inline-start: 0; + inset-inline-end: 1.08em; + } +} +.sectionTabs { + text-align: center; +} +.headerClock { + margin: 0 0.25em; + display: inline-block; + vertical-align: middle; + font-weight: 600; + font-size: 118%; +} +.headerSelectedPlayer { + font-weight: 400; + max-width: 10em; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; +} +.headerHelpButton { + color: #42a5f5 !important; +} +@media not all and (min-width: 37.5em) { + .headerLeft { + max-width: calc(100% - 20ch); + } + .headerRight { + max-width: 20ch; + } + .headerSelectedPlayer { + display: none; + } +} +.headerTop-tv-withSectionTabs-hideTitle + .pageTitle:not(.pageTitleWithDefaultLogo) { + display: none !important; +} +.headerTop-tv-withSectionTabs .headerHelpButton { + display: none !important; +} +@media not all and (min-width: 50em) { + .headerSettingsButton { + display: none !important; + } +} +.btnHeaderPremiere { + -webkit-margin-end: 1em; + margin-inline-end: 1em; +} +@media not all and (min-width: 48em) { + .btnHeaderPremiere { + display: none !important; + } +} +.tabs-viewmenubar { + font-size: 112%; + border-radius: 100em; + display: -webkit-flex; + display: flex; +} +@media not all and (min-height: 40em), not all and (min-width: 66em) { + .withHeaderTabs:not(.layout-tv):root { + --extra-padding-top: 1.1em; + } + .tabs-viewmenubar-backgroundcontainer:not( + .tabs-viewmenubar-backgroundcontainer-tv + ) { + background: 0 0 !important; + -webkit-backdrop-filter: none !important; + backdrop-filter: none !important; + } + .tabs-viewmenubar-slider:not(.tabs-viewmenubar-slider-tv) { + -webkit-padding-start: 1em; + padding-inline-start: 1em; + -webkit-padding-end: 1em; + padding-inline-end: 1em; + } +} +@media all and (min-width: 120em) { + .tabs-viewmenubar { + font-size: 116%; + max-width: 90%; + } + .headerTop-withSectionTabs .headerLeft { + -webkit-flex-grow: 0; + flex-grow: 0; + } +} +.headerTop-tv-withSectionTabs .headerLeft { + -webkit-flex-grow: 0; + flex-grow: 0; +} +.tabs-viewmenubar-tv { + max-width: 90%; + font-size: inherit; +} +@media all and (min-width: 130em) { + .tabs-viewmenubar { + max-width: 100%; + } +} +.tabs-viewmenubar-slider { + padding: 0.25em; +} +.main-tab-button { + padding: 0.25em 1.76ch !important; + border-radius: 100em !important; +} +.headerNowPlaying { + -webkit-flex-basis: 100%; + flex-basis: 100%; + display: -webkit-flex; + display: flex; + -webkit-align-items: center; + align-items: center; + -webkit-justify-content: center; + justify-content: center; + padding: 0 2ch; + padding-top: env(safe-area-inset-top, 0); + height: 4em; + box-sizing: border-box; + margin-bottom: 0.8em; +} +@supports (height: calc(3.125em + 2 * max(3em, 4em))) { + .headerNowPlaying { + height: calc(4em + env(safe-area-inset-top, 0)); + } +}