diff --git a/finimalism3-0 b/finimalism3-0 deleted file mode 100644 index 70bff5c..0000000 --- a/finimalism3-0 +++ /dev/null @@ -1,1690 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Encode+Sans+Condensed&family=PT+Sans&display=swap'); - -.headerTop { - padding: 1.1em; -} - -body { - font-family: 'Encode Sans Condensed', sans-serif; - font-size: 12pt; /* Default font size for the body */ -} - -div.itemMiscInfo.itemMiscInfo-primary { - font-size: 14pt; -} - -p.overview.detail-clamp-text { - font-size: 13pt; /* Font size for the description */ -} - -/* Font for the Movies, TV and Live TV buttons */ -span.homeLibraryText { - font-family: 'Encode Sans Condensed', sans-serif; - font-size: 14pt; -} - -/* Overlay Progress Bar */ -#itemDetailPage .itemProgressBar, -#indexPage .itemProgressBar { - height: 2000em; - background: #0000; -} - -.innerCardFooter.fullInnerCardFooter.innerCardFooterClear { - background: rgba(0, 0, 0, 0); - right: 0; - left: 0; - top: 0; - bottom: 0; - margin: 0; -} - -.itemProgressBarForeground { - background: linear-gradient(to right, rgba(163, 95, 198, 0.7) 0%, rgba(6, 161, 217, 0.2) 100%); -} - -/*Alternate itempage*/ - -.itemBackdrop { - height: 31vh !important; - display: inherit; -} -.detailLogo { - display: none; -} -.layout-desktop .detailRibbon { - margin-top: 0; - padding-top: 0em; - padding-bottom: 0em; -} - -.layout-desktop .detailImageContainer .card { - top: 18vh; -} - -/* Title Banner Logo */ -#itemDetailPage .detailLogo { - position: static; - margin-left: 32.5%; - display: block; - -webkit-filter: drop-shadow(0 0 10px rgba(2, 2, 2, 0.75)); - /*! filter: drop-shadow(0 0 10px rgba(2, 2, 2, 0.75)); */ - flex-shrink: 0; - background-position: 0 50%; - margin-top: -18vh; - margin-bottom: 2vh; -} - -.layout-mobile .detailLogo { - display: none !important; -} - -#itemDetailPage .itemName.infoText.parentNameLast { - display: none; -} - -.hide+.detailPageWrapperContainer .itemName { - display: block !important; -} - -.itemName { - margin: .5em 0 !important; -} - -.layout-mobile #itemDetailPage .itemName.infoText.parentNameLast { - display: block; -} - -/*This file contains color and style changes for the dark theme type*/ -:root {--selection: 170, 95, 200;} - -.backgroundContainer.withBackdrop { - background-color: rgba(0, 0, 0, 0); -} - -/*Some themeing for the dashboard*/ - -#user_usage_report_table, -.detailTable { - background: rgba(0,0,0,.5); -} -.detailTableBodyRow-shaded { - background: #0000 !important; -} - -.infoBanner { - background: #101010; -} -.navMenuOptionText { - margin-top: 0; -} -.backgroundProgress > div { - background-color: #0000; -} - -.visualCardBox, .cardImageContainer { - box-shadow: none; -} - -.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__track { - background: rgba(120, 120, 120, 0.6); -} -.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__thumb { - background: white; -} - -.dashboardSection h3 { - margin-left: 0.5em; -} -.sessionCardFooter { - border: none; -} -.paperList, -.visualCardBox { - background-color: rgba(0, 0, 0, 0.5); -} -.listItem-border { - border-color: rgba(255, 255, 255, 0) !important; -} -fieldset { - border: 1px solid rgba(40, 40, 40, 0.8); - border-radius: 0.4em; -} - -/*Colors for title_2*/ -.layout-desktop .detailRibbon { - background: rgba(0,0,0,.2) !important; -} -.itemBackdrop::after { - background: rgba(0,0,0,.5) !important; -} - -/*Homepage modifications, transparent footerplayer and fixed sectiontitles*/ -.appfooter { - background: rgba(0,0,0,0.9); -} -.button-flat:hover { - background: rgba(0,0,0,0.4); -} - -/*Theme the library scan progress bar*/ -progress { - background: rgba(0, 0, 0, 0.5) !important; - border: 1px solid rgba(255, 255, 255, 0.22); -} -progress::-webkit-progress-bar { - background: rgba(0, 0, 0, 0.5) !important; - border: 0px solid rgba(255, 255, 255, 0.22); -} -progress::-moz-progress-bar { - background-color: rgba(255,255,255,0.75); -} -progress::-webkit-progress-value { - background-color: rgba(255,255,255,0.75); -} -#divRunningTasks span { - color: rgba(255,255,255,0.75) !important; -} -.taskProgressOuter { - background: rgba(0, 0, 0, 0.5) !important; - border: 1px solid rgba(255, 255, 255, 0.22); -} -.taskProgressInner { - background: rgba(255,255,255,0.75) !important; -} -#scheduledTasksPage span { - color: rgba(255,255,255,0.75) !important; -} - -/*Login background*/ -#loginPage { - background: url(https://i.imgur.com/9vL4iNf.png) !important; - background-size: cover !important; -} - -/*Make watched icon, footer on chapter thumbnails (and other things), and count indicator dark and transparent*/ -.innerCardFooter, -.countIndicator, -.playedIndicator { - background: linear-gradient(to right, rgba(163, 95, 198, 0.5) 0%, rgba(6, 161, 217, 0.5) 100%); - box-shadow: none; -} - -.countIndicator { - box-shadow: none; -} - -/*Modify subtitle settings page*/ -.subtitleappearance-preview { - background: linear-gradient(140deg,#444,#111) !important; -} - -/*Affects blurhash to remove the saturated colors to fit overall look*/ -.blurhash-canvas { - filter: opacity(60%) saturate(60%); -} - -/*Dash and general UI styling*/ -.navMenuOption-selected, .selectionCommandsPanel { - background: #101010 !important; -} -.mainDrawer { - background-color: rgba(0, 0, 0, 0.8); -} -.raised, -.fab, -a[data-role="button"] { - background: rgba(40, 40, 40, 0.8) !important; - transition: all 0.2s !important; -} -.raised:hover, -.fab:hover, -.navMenuOption:hover, -.actionSheetMenuItem:hover { - background: rgba(80, 80, 80, 0.8) !important; -} -.paper-icon-button-light:hover { - background-color: rgba(0, 0, 0, 0.4) !important; -} -.navMenuOption-selected, -.selectionCommandsPanel { - background: #101010 !important; -} - -.paper-icon-button-light:hover, -.raised.homeLibraryButton:hover, -.button-flat:hover, -.playstatebutton-icon-played, -.ratingbutton-icon-withrating, -.paper-icon-button-light:hover:not(:disabled), -.emby-tab-button:hover, -.selectLabelFocused, -.inputLabelFocused, -.textareaLabelFocused, -.buttonActive, -.button-link{ - color: rgba(120, 120, 120, 0.6) !important; -} -progress { - background: rgba(0, 0, 0, 0.5) !important; -} - -/*Theme syncplay*/ -.syncPlayIconCircle { - color: rgba(255,255,255,1) !important; - text-shadow: none !important; -} - -@-webkit-keyframes pulse { - 0% { - -webkit-transform:scale(.95); - transform:scale(.95); - color:rgba(0,0,0,.7); - background:rgba(0,0,0,.3); - box-shadow:0 0 0 0 rgba(0,0,0,.3) - } - 70% { - -webkit-transform:scale(1); - transform:scale(1); - color:rgba(0,0,0,.6); - background:rgba(0,0,0,0); - box-shadow:0 0 0 60px rgba(0,0,0,0) - } - to { - -webkit-transform:scale(.95); - transform:scale(.95); - color:rgba(0,0,0,.7); - background:rgba(0,0,0,.3); - box-shadow:0 0 0 0 rgba(0,0,0,0) - } -} -@keyframes pulse { - 0% { - -webkit-transform:scale(.95); - transform:scale(.95); - color:rgba(0,0,0,.7); - background:rgba(0,0,0,.3); - box-shadow:0 0 0 0 rgba(0,0,0,.3) - } - 70% { - -webkit-transform:scale(1); - transform:scale(1); - color:rgba(0,0,0,.6); - background:rgba(0,0,0,0); - box-shadow:0 0 0 60px rgba(0,0,0,0) - } - to { - -webkit-transform:scale(.95); - transform:scale(.95); - color:rgba(0,0,0,.7); - background:rgba(0,0,0,.3); - box-shadow:0 0 0 0 rgba(0,0,0,0) - } -} -@-webkit-keyframes infinite-pulse { - 0% { - -webkit-transform:scale(.95); - transform:scale(.95); - color:rgba(0,0,0,.7); - background:rgba(0,0,0,.3); - box-shadow:0 0 0 0 rgba(0,0,0,.3) - } - 70% { - -webkit-transform:scale(1); - transform:scale(1); - color:rgba(0,0,0,.6); - background:rgba(0,0,0,0); - box-shadow:0 0 0 60px rgba(0,0,0,0) - } - to { - -webkit-transform:scale(.95); - transform:scale(.95); - color:rgba(0,0,0,.7); - background:rgba(0,0,0,.3); - box-shadow:0 0 0 0 rgba(0,0,0,0) - } -} -@keyframes infinite-pulse { - 0% { - -webkit-transform:scale(.95); - transform:scale(.95); - color:rgba(0,0,0,.7); - background:rgba(0,0,0,.3); - box-shadow:0 0 0 0 rgba(0,0,0,.3) - } - 70% { - -webkit-transform:scale(1); - transform:scale(1); - color:rgba(0,0,0,.6); - background:rgba(0,0,0,0); - box-shadow:0 0 0 60px rgba(0,0,0,0) - } - to { - -webkit-transform:scale(.95); - transform:scale(.95); - color:rgba(0,0,0,.7); - background:rgba(0,0,0,.3); - box-shadow:0 0 0 0 rgba(0,0,0,0) - } -} - -/*Colors for loading spinner, placeholders, scroll bars*/ -.mdl-spinner__layer-1 {border-color: rgba(255, 255, 255, 1);} -.mdl-spinner__layer-2 {border-color: rgba(128, 128, 128, 1);} -.mdl-spinner__layer-3 {border-color: rgba(40, 40, 40, 1);} -.mdl-spinner__layer-4 {border-color: rgba(0, 0, 0, 1);} - -::-webkit-scrollbar-track-piece { - background-color: #0000; -} -::-webkit-scrollbar-corner { - background-color: #0000; -} -::-webkit-scrollbar-thumb { - background: rgba(120,120,120,0.6) !important; - border-radius: var(--rounding); -} - -* { - scrollbar-color: rgba(120,120,120,0.6) #0000 !important; -} - -.defaultCardBackground1 { - background-color: #0a0a0a; -} -.defaultCardBackground2 { - background-color: #141414; -} -.defaultCardBackground3 { - background-color: #212121; -} -.defaultCardBackground4 { - background-color: #333333; -} -.defaultCardBackground5 { - background-color: #666666; -} - -.raised:hover, -.fab:hover, -a[data-role="button"]:hover { - background: rgba(var(--accent),0.5) !important; -} - -.subtitleappearance-preview { - background: linear-gradient(140deg,rgb(var(--accent)),#111) !important; -} - -.navMenuOption-selected { - color: rgba(var(--accent)); -} -.mdl-slider-background-lower { - background-color: rgba(var(--accent)); -} - -.playbackProgress>div { - background-color: rgba(var(--accent),0.75); -} -progress::-moz-progress-bar { - background-color: rgba(var(--accent),0.75); -} -progress::-webkit-progress-value { - background-color: rgba(var(--accent),0.75); -} -.taskProgressInner { - background: rgba(var(--accent),0.75) !important; -} - -.transcodingProgress>div, -.itemProgressBarForeground { - background-color: rgba(var(--accent),0.35); -} - -.mdl-slider-background-lower { - background-color: rgb(var(--accent)); -} -.mdl-slider::-moz-range-thumb { - background: rgb(var(--accent)); -} -.mdl-slider::-ms-thumb { - background: rgb(var(--accent)); -} -.mdl-slider::-webkit-slider-thumb { - background: rgb(var(--accent)); -} -.iconOsdProgressInner { - background: rgb(var(--accent)); -} - -.paper-icon-button-light:hover, -.raised.homeLibraryButton:hover, -.button-flat:hover, -.playstatebutton-icon-played, -.ratingbutton-icon-withrating, -.paper-icon-button-light:hover:not(:disabled), -.emby-tab-button:hover, -.selectLabelFocused, -.inputLabelFocused, -.textareaLabelFocused, -.buttonActive, -.button-link { - color: rgba(var(--accent)) !important; -} - -#itemDetailPage .button-link {color: inherit !important;} - -.navMenuOption:hover, -.actionSheetMenuItem:hover { - background-color: rgba(var(--accent),0.5) !important; -} - -.upNextDialog-countdownText { - color: rgba(var(--accent)); -} - -.mdl-spinner__layer-1 { - border-color: rgba(var(--accent)); -} -.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__track { - background: rgba(var(--accent), 0.5); -} -.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__thumb { - background: rgba(var(--accent)); -} - -::-webkit-scrollbar-thumb { - background: rgba(var(--accent),0.8) !important; -} -* { - scrollbar-color: rgba(var(--accent),0.8) #0000 !important; -} - -/* Syncplay theming*/ -.syncPlayIconCircle { - color: rgba(var(--accent),1) !important; - text-shadow: none !important; -} - -/*Card indicators style normal*/ -.innerCardFooter { - margin: .5em; -} - -.countIndicator { - background: rgba(var(--indicator),0.8); - box-shadow: none; -} -.playedIndicator, .innerCardFooter { - background: rgba(0,0,0,0.4); - box-shadow: none; -} - -.mediaSourceIndicator { - background: rgba(0,0,0,0.4); - box-shadow: none; - border-radius: var(--rounding); -} - -/*Tweak entry fields, checkmarks, thin borders dark highlight*/ -.emby-input, -.emby-textarea { - padding: .4em .55em; -} -.emby-select { - padding: .35em 1.9em .35em .35em; -} -.selectArrow { - margin-top: 1.05em; -} -.checkboxOutline, -.emby-input, -.emby-textarea, -.emby-select-withcolor { - background: rgba(0, 0, 0, 0.2); - border: 0.01em solid rgba(255, 255, 255, 0.22); -} -.emby-input:focus, -.emby-textarea:focus, -.emby-select-withcolor:focus { - background: rgba(0, 0 , 0, 0.4) !important; -} - -.emby-textarea:focus, -.emby-select-withcolor:focus, -.emby-input:focus, -.itemSelectionPanel { - border: 0.01em solid rgba(var(--selection), 0.8) !important; -} -.emby-checkbox:checked + span + .checkboxOutline { - background-color: rgba(0, 0 , 0, 0.4) !important; - border: 0.01em solid rgba(var(--selection), 0.8) !important; -} - -/*Theme the library scan progress bar*/ -progress { - background: rgba(0, 0, 0, 0.5) !important; - border: 1px solid rgba(255, 255, 255, 0.22); -} -progress::-webkit-progress-bar { - background: rgba(0, 0, 0, 0.5) !important; - border: 0px solid rgba(255, 255, 255, 0.22); -} -progress::-moz-progress-bar { - background-color: rgba(255,255,255,0.75); -} -progress::-webkit-progress-value { - background-color: rgba(255,255,255,0.75); -} -#divRunningTasks span { - color: rgba(255,255,255,0.75) !important; -} -.taskProgressOuter { - background: rgba(0, 0, 0, 0.5) !important; - border: 1px solid rgba(255, 255, 255, 0.22); -} -.taskProgressInner { - background: rgba(255,255,255,0.75) !important; -} -#scheduledTasksPage span { - color: rgba(255,255,255,0.75) !important; -} - -/*Narrow the login form, size according to display size (bigger on mobile)*/ -#loginPage .readOnlyContent, -#loginPage form { - max-width: 22em; -} - -#loginPage .padded-left.padded-right.padded-bottom-page { - margin-top: 8em -} - -/*Hide "manual" and "forgot" buttons}*/ -#loginPage .raised.cancel.block.btnForgotPassword.emby-button { - display: none -} - -#loginPage .padded-left.padded-right.padded-bottom-page { - margin-left: auto; - margin-right: auto; - background: rgba(0, 0, 0, 0.35); - width: 24em; - border-radius: var(--rounding); -} -#loginPage .squareCard { - width: 33%; -} -#loginPage form { - padding-top: 4em; -} - -#loginPage .sectionTitle{ - margin-left: auto !important; - margin-right: auto !important; - margin-bottom: 1.2em !important; -} -#loginPage { - background: url(https://i.imgur.com/9vL4iNf.png) !important; - background-size: cover !important; -} - - -/*Size episode preview images in a more compact way*/ -.listItemImage.listItemImage-large.itemAction.lazy { - transition: filter 0.2s -} -.listItemImageButton-icon { - padding: 0; -} -.secondary.listItem-overview.listItemBodyText { - height: 61px; - margin: 0; -} -.listItemImageButton { - margin: auto; - font-size: 1.6em !important; -} -@media all and (min-width: 100em){ - .listItemImage.listItemImage-large.itemAction.lazy { - height: 110px; - } - .listItem-content { - height: 115px; - } - .secondary.listItem-overview.listItemBodyText { - height: 4em; - margin: 0; - } -} -@media all and (max-width: 100em){ - .listItemImage.listItemImage-large.itemAction.lazy {height: 80px;} - .listItem-content {height: 85px;} - .secondary.listItem-overview.listItemBodyText {height: 2.5em; margin: 0;} -} - -.missingIndicator, .unairedIndicator { - background: #ae3030eb; - padding: .3em .6em; - color: #fff; -} -.layout-mobile .listItemImageButton { - background: rgba(0, 0, 0, 0); -} - -/*Rounded corners on pretty much everything*/ - -.detailButton { - border-radius: 50%; -} - -progress { - border-radius: var(--rounding); -} -progress::-webkit-progress-bar { - border-radius: var(--rounding); -} -progress::-moz-progress-bar { - border-radius: var(--rounding); -} -progress::-webkit-progress-value { - border-radius: var(--rounding); -} -.taskProgressOuter, -.taskProgressInner { - border-radius: var(--rounding) !important; -} -.formDialogHeader { - border-top-left-radius: var(--rounding); - border-top-right-radius: var(--rounding); -} -.formDialogFooter { - border-bottom-left-radius: var(--rounding); - border-bottom-right-radius: var(--rounding); -} -.cardOverlayContainer { - border-radius: var(--rounding) !important; -} -.missingIndicator, -.unairedIndicator, -.detailTable, -.primaryImageWrapper > img, -.toast, -.paperList, -.cardContent, -.sessionNowPlayingInnerContent, -.listItem:hover, -.cardImage, -.fab, -.raised, -.multiSelectCheckboxOutline, -.itemSelectionPanel, -.cardContent-button, -.cardContent-shadow, -.itemDetailImage, -.cardImageContainer, -.cardPadder, -.listItemImage, -.listItemImageButton, -.listItemButton, -.innerCardFooter, -.blurhash-canvas, -.dialog, -.countIndicator, -.playedIndicator, -.listItemIcon, -.listItem-border, -.visualCardBox, -.checkboxOutline, -.emby-select-withcolor, -.chapterThumbTextContainer, -.chapterThumbContainer, -.chapterThumb, -.emby-input, -.emby-textarea, -.emby-select-withcolor, -.nowPlayingPageImage, -.upNextDialog-poster-img, -.upNextContainer, -.cardOverlayButtonIcon { - border-radius: var(--rounding) !important; -} -.osdPoster img { - border-radius: var(--rounding); border: none; -} -.mdl-slider::-moz-range-thumb { - border-radius: var(--rounding); -} -.mdl-slider::-ms-thumb { - border-radius: var(--rounding); -} -.mdl-slider::-webkit-slider-thumb { - border-radius: var(--rounding); -} - -div[data-role="controlgroup"] a[data-role="button"]:first-child { - border-bottom-left-radius: var(--rounding); - border-top-left-radius: var(--rounding); -} -div[data-role="controlgroup"] a[data-role="button"]:last-child { - border-bottom-right-radius: var(--rounding); - border-top-right-radius: var(--rounding); -} -#dashboardPage .cardContent, #dashboardPage .sessionNowPlayingInnerContent { - border-radius: var(--rounding) var(--rounding) 0 0 !important; -} -#divVirtualFolders .cardImageContainer, #divVirtualFolders .cardContent { - border-radius: var(--rounding) var(--rounding) 0 0 !important; -} -#userProfilesPage .cardImage, #userProfilesPage .cardContent { - border-radius: var(--rounding) var(--rounding) 0 0 !important; -} - -.emby-textarea { - font-family: monospace; - font-size: 10pt; -} - -.card.show-animation:focus>.cardBox { - -webkit-transform:scale(1.1); - transform:scale(1.1); -} - -/*Theme user setting tab buttons*/ -div[data-role="controlgroup"] a.ui-btn-active { - background: rgba(0, 0, 0, 0.5) !important; - color: orange !important; -} - -div[data-role="controlgroup"] a[data-role="button"] { - display: table-cell !important; - margin: 0 !important; -} - -/*Mobile tweaks*/ -.layout-mobile .detailPagePrimaryContainer { - background: transparent; - padding-top: 0.5em; - padding-bottom: 0.5em; - -} -.layout-mobile .adminDrawerLogo { - border-bottom: none; -} -.layout-mobile .itemBackdrop { - margin-top: 4rem; -} - -/*Stop covers from being scrolled on desktop*/ -.layout-desktop .detailImageContainer .card { - position: fixed !important; - top: 10% !important; -} -.layout-mobile .detailImageContainer .card { - position: absolute !important; -} -/*Top "task bar" enlarge text*/ -.headerTabs.sectionTabs { - text-size-adjust: 110%; - font-size: 110%; -} -.pageTitle { - margin-top: auto; - margin-bottom: auto; -} - -/*Theme process progress ring*/ -.progressring-spiner { - border-color: rgba(var(--accent)); - border-width: .35em; -} -.progressring { - margin: .4em; -} -.progressring-bg { - display: none; -} - -/*Theme link color*/ -#itemDetailPage .button-link {color: inherit !important;} - -/*Accommodate mobile and align buttons and indicators*/ -.cardIndicators, -.listItemIndicators { - right: 0.5em; - top: 0.5em; -} - -.mediaSourceIndicator { - left: 0.5em; - top: 0.5em; -} - -@media all and (min-width: 70em){ - .cardOverlayFab-primary { - background-color: #00000000; - } - .cardOverlayButtonIcon { - background-color: #00000000 !important; - } - .cardOverlayContainer { - background-color: rgba(0, 0, 0, 0); - } -} -/* Play button hovering (for low width windows) */ -@media all and (max-width: 70em){ - .cardOverlayFab-primary { - background-color: #00000000; - } - .cardOverlayButtonIcon { - background-color: #00000000 !important; - } - .cardOverlayContainer { - background-color: rgba(0, 0, 0, 0); - } - .cardOverlayButton { - padding: 0.25em; - } -} - -/*Media player*/ -.nowPlayingPageImage { - border: none; -} - -.upNextDialog-countdownText { - color: white; -} - -/*Shrink the mouseover chapter image when scrobbling, still media player*/ -.chapterThumb { - height: 14vh; - min-width: 14vh; - box-shadow: 0 0 1.9vh #000; -} -.chapterThumbText { - font-size: 1em; -} -.sliderBubble { - background: #0000; -} -.chapterThumbTextContainer { - right: auto; - bottom: 4px; - padding: .25em 0.7em; -} -.chapterThumbContainer { - box-shadow: 0 0 1.9vh #000; -} -.sliderBubble { - -webkit-transform: translate3d(-50%,-108%,0); - transform: translate3d(-50%,-108%,0); -} - -/*Narrow margins, theme main page*/ -.cardBox-bottompadded { - margin-bottom: 0.4em !important; -} -.itemsContainer > .card > .cardBox { - margin-right: 0.8em; -} -.raised.homeLibraryButton { - background: rgba(0, 0, 0, 0.3) !important; -} -.raised.homeLibraryButton:hover { - background: rgba(0, 0, 0, 0.5) !important; -} -.raised.homeLibraryButton:hover {transition: filter 0.2s} -.raised.homeLibraryButton {transition: filter 0.2s} -.homeLibraryButton { - min-width: 9em; - margin: 0.4em; -} -@media all and (max-width: 26em){ - .homeLibraryButton { - min-width: 35%; - width: auto !important; - } -} -.homeLibraryButton { - width: auto !important; -} -.listItem:hover { - transition: 0.2s; - background: rgba(0, 0, 0, 0.4); -} -.visualCardBox, .cardImageContainer { - box-shadow: none; -} -.backgroundProgress > div { - background: rgba(0, 0, 0, 0); -} -.itemProgressBar { - background: rgba(0, 0, 0, 0.25); -} -#divRunningTasks span { - color: rgba(255,255,255,0.75) !important; -} -.itemsContainer > .card > .cardBox { - margin-left: 0.6em !important; -} -.itemsContainer > .card > .cardBox { - margin-right: 0.8em; -} - -/*ANIMATIONS*/ -/*Hover background for section title buttons*/ -.button-flat:hover { - background: rgba(0, 164, 220, 0.2); - color: #00a4dc !important; -} -.dashboardSection h3 { - margin: .5em .0em .5em .5em; -} -.dashboardSection .sectionTitleTextButton > .material-icons.material-icons { - margin-top: .5em; - margin-bottom: .5em; - margin-right: .2em; -} - -/*Remove background on some icons*/ -.listItemIcon { - background: #0000 !important; -} - -/*Remove divider on list items*/ -.listItem-border { - border-color: rgba(255, 255, 255, 0) !important; -} - -/*Fix footers/headers displaying on small pop-ups*/ -.formDialogFooter-clear, -.formDialogHeader-clear, -.innerCardFooterClear { - background-color: transparent !important; -} - -.emby-button.show-focus:focus { - background: rgba(var(--accent),0.5) !important; -} -.paper-icon-button-light.show-focus:focus { - color: rgba(var(--accent)) !important; -} - -/*Title text buttons*/ -button-flat:hover { - color: rgba(var(--accent)) !important; -} - -.raised:hover, -.fab:hover, -a[data-role="button"]:hover { - background: rgba(var(--accent),0.5) !important; -} - -.subtitleappearance-preview { - background: linear-gradient(140deg,rgb(var(--accent)),#111) !important; -} - -.navMenuOption-selected { - color: rgba(var(--accent)); -} -.mdl-slider-background-lower { - background-color: rgba(var(--accent)); -} - -progress::-moz-progress-bar { - background-color: rgba(var(--accent),0.75); -} -progress::-webkit-progress-value { - background-color: rgba(var(--accent),0.75); -} -.taskProgressInner { - background: rgba(var(--accent),0.75) !important; -} - -#dashboardPage .playbackProgress > div { - background-color: rgba(var(--accent), 0.75) !important; -} -#dashboardPage .transcodingProgress > div { - background-color: rgba(var(--accent), 0.35) !important; -} - -.mdl-slider-background-lower { - background-color: rgb(var(--accent)); -} -.mdl-slider::-moz-range-thumb { - background: rgb(var(--accent)); -} -.mdl-slider::-ms-thumb { - background: rgb(var(--accent)); -} -.mdl-slider::-webkit-slider-thumb { - background: rgb(var(--accent)); -} -.iconOsdProgressInner { - background: rgb(var(--accent)); -} - -.paper-icon-button-light:hover, -.raised.homeLibraryButton:hover, -.button-flat:hover, -.playstatebutton-icon-played, -.ratingbutton-icon-withrating, -.paper-icon-button-light:hover:not(:disabled), -.emby-tab-button:hover, -.selectLabelFocused, -.inputLabelFocused, -.textareaLabelFocused, -.buttonActive, -.button-link { - color: rgba(var(--accent)) !important; -} - -#itemDetailPage .button-link {color: inherit !important;} - -.navMenuOption:hover, -.actionSheetMenuItem:hover { - background-color: rgba(var(--accent),0.5) !important; -} - -.emby-checkbox:checked + span + .checkboxOutline, -.emby-textarea:focus, -.emby-select-withcolor:focus, -.emby-input:focus, -.itemSelectionPanel { - border: 0.01em solid rgba(var(--accent),0.5) !important; -} - -.upNextDialog-countdownText { - color: rgba(var(--accent)); -} - -.mdl-spinner__layer-1 { - border-color: rgba(var(--accent)); -} -.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__track { - background: rgba(var(--accent), 0.5); -} -.mdl-switch__input:checked + .mdl-switch__label + .mdl-switch__trackContainer > .mdl-switch__thumb { - background: rgba(var(--accent)); -} - -::-webkit-scrollbar-thumb { - background: rgba(var(--accent),0.8) !important; -} -* { - scrollbar-color: rgba(var(--accent),0.8) #0000 !important; -} - -/* Syncplay theming*/ -.syncPlayIconCircle { - color: rgba(var(--accent),1) !important; - text-shadow: none !important; -} - -/*Enlarge button row on item page, even more on mobile*/ -.mainDetailButtons { - font-size: 120%; -} - -/*Add fixes, start of file*/ -@media all and (min-width: 100em){ - .button-flat { - margin: .2em !important; - padding: .85em !important; - } -} -@media all and (max-width: 100em){ - .mainDetailButtons { - font-size: 155%; - } - .detailButton { - max-width: 15vw !important; - } -} - -/*Media player*/ -.startTimeText, .endTimeText { - width: 3.4em; - display: block; - text-align: center; -} -.osdTitle { - margin-left: 0.5em; -} - -.videoOsdBottom { - padding-top: 1em; -} - -.skinHeader-withBackground.osdHeader { - height: 5em; -} - -/*Accommodate ultrawide aspect ratios*/ -@media (min-aspect-ratio: 1.98/1) { - .detailImageContainer .card { - width: 21vw !important ; - } - .detailPagePrimaryContainer { - padding-left: 28.45vw !important; - } - .detailPageContent { - padding-left: 28.45vw !important; - } -} -@media (min-aspect-ratio: 2.7/1) { - .detailImageContainer .card { - width: 16vw !important; - } - .detailPagePrimaryContainer { - padding-left: 23.45vw !important; - } - .detailPageContent { - padding-left: 23.45vw !important; - } -} - -/*Tweak entry field padding and alignment/sizes*/ -.emby-input, -.emby-textarea { - padding: .4em .55em; -} -.emby-select { - padding: .35em 1.9em .35em .35em; -} -.selectArrow { - margin-top: 1.05em; -} - -/*Fix weird shevron off centering*/ -.layout-mobile :not(.sectionTitleContainer-cards)>.sectionTitle-cards { - padding-top:0em; -} -.sectionTitle { - margin-left: .4em !important; - margin-top: .2em !important; - margin-bottom: .2em !important; -} -.sectionTitleTextButton > .material-icons { - margin: 0; -} -.layout-mobile .sectionTitleTextButton > .material-icons { - padding-top: .2em; -} - -/*Fix the UI shifting around*/ -.nowPlayingBarCurrentTime { - width: 6em; -} -.osdTextContainer { - margin: 0 !important; - margin-top: 0.2em !important; - padding-left: 0.5em !important; - padding-right: 0.5em !important; -} - -/*Fix top right user icon when using a profile image*/ -.headerUserButtonRound { - border-radius: 50px !important; -} - -/*Improve some menu alignments*/ -.navMenuOptionText { - margin-top: 0; -} -.formDialogHeaderTitle { - margin-left: 1em; -} -.formDialogContent { - margin-bottom: 6.2em; -} -.dialogContentInner { - padding: .5em 1em 1em; - padding-right: 1em; - padding-left: 1em; -} -.listItem-indexnumberleft { - margin: 1em; -} -.listItem { - padding-left: 1em; -} - -/*Shrink and square (or round) cast thumnails*/ -@media all and (min-width: 131.25em){ - #castContent .card.overflowPortraitCard { - width: 6.3vw !important; - font-size: 90% !important; - } -} -@media all and (min-width: 120em) and (max-width: 131.25em){ - #castContent .card.overflowPortraitCard { - width: 6.4vw !important; - font-size: 90% !important; - } -} -@media all and (min-width: 100em) and (max-width: 120em){ - #castContent .card.overflowPortraitCard { - width: 7.6vw !important; - font-size: 90% !important; - } -} -@media all and (min-width: 87.5em) and (max-width: 100em){ - #castContent .card.overflowPortraitCard { - width: 9.3vw !important; - font-size: 90% !important; - } -} -@media all and (min-width: 75em) and (max-width: 87.5em){ - #castContent .card.overflowPortraitCard { - width: 10.5vw !important; - font-size: 90% !important; - } -} -@media all and (min-width: 50em) and (max-width: 75em){ - #castContent .card.overflowPortraitCard { - width: 15vw !important; - font-size: 90% !important; - } -} -@media all and (min-width: 43.75em) and (max-width: 50em){ - #castContent .card.overflowPortraitCard { - width: 20.1vw !important; - font-size: 90% !important; - } -} -@media all and (min-width: 25em) and (max-width: 43.75em){ - #castContent .card.overflowPortraitCard { - width: 31.2vw !important; - font-size: 90% !important; - } -} -@media all and (max-width: 25em){ - #castContent .card.overflowPortraitCard { - width: 40vw !important; - font-size: 90% !important; - } -} - -.cardPadder { - background-color: #0000 !important; box-shadow: none !important; -} - -/*Correct image aspect ratio behaviour, set border-radius to zero for square tiles*/ - -@media all and (min-width: 131.25em){ - #castContent .cardScalable { - width: calc(6.3vw - 0.6em) !important; - height: calc(6.3vw - 0.6em) !important; - } -} -@media all and (min-width: 120em) and (max-width: 131.25em){ - #castContent .cardScalable { - width: calc(6.4vw - 0.6em) !important; - height: calc(6.4vw - 0.6em) !important; - } -} -@media all and (min-width: 100em) and (max-width: 120em){ - #castContent .cardScalable { - width: calc(7.6vw - 0.6em) !important; - height: calc(7.6vw - 0.6em) !important; - } -} -@media all and (min-width: 87.5em) and (max-width: 100em){ - #castContent .cardScalable { - width: calc(9.3vw - 0.6em) !important; - height: calc(9.3vw - 0.6em) !important; - } -} -@media all and (min-width: 75em) and (max-width: 87.5em){ - #castContent .cardScalable { - width: calc(10.5vw - 0.6em) !important; - height: calc(10.5vw - 0.6em) !important; - } -} -@media all and (min-width: 50em) and (max-width: 75em){ - #castContent .cardScalable { - width: calc(15vw - 0.6em) !important; - height: calc(15vw - 0.6em) !important; - } -} -@media all and (min-width: 43.75em) and (max-width: 50em){ - #castContent .cardScalable { - width: calc(20.1vw - 0.6em) !important; - height: calc(20.1vw - 0.6em) !important; - } -} -@media all and (min-width: 25em) and (max-width: 43.75em){ - #castContent .cardScalable { - width: calc(31.2vw - 0.6em) !important; - height: calc(31.2vw - 0.6em) !important; - } -} -@media all and (max-width: 25em){ - #castContent .cardScalable { - width: calc(40vw - 0.6em) !important; - height: calc(40vw - 0.6em) !important; - } -} - -.skinHeader-withBackground { - background-color: transparent; -} - -/*Pages the have single unit height taskbar*/ -@media all and (min-width: 100em){ - #indexPage, - #moviesPage, - #tvRecommendedPage, - #musicRecommendedPage { - margin-top: 68px; - padding-top: 0px !important; - overflow-y: scroll; - } -} - -/*Pages the have two unit height taskbar*/ -@media all and (max-width: 100em){ - #indexPage, - #moviesPage, - #tvRecommendedPage, - #musicRecommendedPage { - margin-top: 130px; - padding-top: 0.5em !important; - overflow-y: scroll; - } -} - -.force-scroll { - overflow-y: auto; - overflow-x: auto; -} - -/*Glow accent on hover*/ -.raised.homeLibraryButton { - box-shadow: 0px 0px 5px rgba(var(--accent), 0) !important; - border: solid 1px rgba(var(--accent),0) !important; -} -.cardOverlayContainer:hover, -.dialog, -.toast, -.raised.homeLibraryButton:hover { - box-shadow: 0px 0px 5px rgb(var(--accent)) !important; - border: solid 1px rgba(var(--accent),0) !important; -} -.cardOverlayContainer { - border: solid 1px rgba(var(--accent),0.0) !important; -} -.drawer-open { - box-shadow: 0px 0px 5px rgba(var(--accent), 1) !important; - border-right: solid 1px rgba(var(--accent), 1) !important; -} - -@supports (backdrop-filter: blur(15px)) { - .dialog, - .mainDrawer, - .toast, - .appfooter { - backdrop-filter: blur(15px); - background-color: rgba(0, 0, 0, 0.35); - } - .paper-icon-button-light:hover, - #itemDetailPage .itemProgressBar, - #dashboardPage .backgroundProgress > div { - backdrop-filter: blur(0px); - } - @media all and (max-width: 70em){ - .cardOverlayButtonIcon { - background-color: rgba(0, 0, 0, 0.35) !important; - } - .cardOverlayButtonIcon { - backdrop-filter: blur(4px); - } - } - .indicator { - backdrop-filter: blur(2px); - } -} - -:root {--accent: 6, 161, 217;} - -:root {--rounding: 12px;} - -.headerTop { - padding: 1.8em; -} - -/* Display the new sections */ -.homeLibraryButton { - display: inline-block; - margin-right: 10px; /* Adjust the margin as needed */ -} - -/* Optionally, you can hide the original "Home" and "Favourites" text */ -.emby-tab-button .emby-button-foreground { - display: none; -} - -.emby-itemscontainer { - margin: 0 auto; /* Set left and right margins to auto */ - text-align: center; /* Center the content inside the container */ -} - -/*hover zoom*/ -.homeLibraryButton:hover, -.homeLibraryButton:focus, -.card:hover, -.card:focus { - -webkit-filter: none !important; - box-shadow: 0 0 5px 0, 255, 222; - filter: none !important; - transform: scale(1.05); - transition: transform 1s ease; /* Add a 1-second transition with ease timing function */ -} - -/* Custom CSS to show only the channel name without the channel number */ -.channelsContainer .guide-channelHeaderCell::after { - content: attr(title); - display: block; - text-align: center; - font-size: 16px; - color: #ffffff; /* You can customize the color */ - margin-top: 10px; /* Adjust the spacing as needed */ -} - -.channelsContainer .guide-channelHeaderCell .guideChannelNumber { - display: none; /* Hide the channel number */ -} - -/*Style backdrop*/ -.backdropImage {filter: blur(2px) saturate(120%) contrast(130%) brightness(40%);} - - -/* Center the listItem content */ -.listItem { - text-align: center; -} - -/* Optionally, add some padding for better visual appearance */ -.listItem { - padding: 10px; -} - -/* Hide the listItemIcon */ -.listItemIcon { - display: none; -} - -/* Optionally, add some padding for better visual appearance */ -.listItem { - padding: 10px; -} - -/* Hide Genres and Writers */ -.detailsGroupItem.genresGroup, -.detailsGroupItem.writersGroup { - display: none; -} - -/* Hide Tags */ -.itemTags { - display: none; -} - -/* Extend max width of Video, Audio and Subtitles details */ - -.detailsGroupItem, .trackSelections .selectContainer { - display: -webkit-flex; - display: flex; - margin: 0 0 .5em !important; - max-width: 60em !important; - font-size: 13px; -} - -.trackSelections { - max-width: 60em !important; -} - -/* Hide Upcoming On TV section */ -#seriesScheduleSection { - display: none; -} - -/* Centre Library buttons such as Movies, TV Shows and Live TV */ - -.verticalSection.verticalSection-extrabottompadding { - display: flex; - align-items: center; - justify-content: center; /* Center horizontally */ -} - -.sectionTitle.sectionTitle-cards { - margin-right: 10px; /* Adjust the margin as needed */ -} - -.itemsContainer.padded-left { - flex: 1; - display: flex; /* Add this line */ - justify-content: center; /* Center the items within the container */ -} - -.sectionTitle.sectionTitle-cards { - margin-right: 10px; /* Adjust the margin as needed */ -} - -.itemsContainer.padded-left { - flex: 1; -} - -/* Top bar padding 1px */ -.flex.align-items-center.flex-grow.headerTop { - padding-bottom: 20px; - height: 3.2em; -} - -/* Hide specific Live TV buttons */ -a[href="#!/livetv.html?tab=0&serverId=67303d06cb7c4c16b5be3492dafb9cae"], -a[href="#!/livetv.html?tab=1&serverId=67303d06cb7c4c16b5be3492dafb9cae"], -a[href="#!/livetv.html?tab=2&serverId=67303d06cb7c4c16b5be3492dafb9cae"], -a[href="#!/livetv.html?tab=3&serverId=67303d06cb7c4c16b5be3492dafb9cae"], -a[href="#!/livetv.html?tab=4&serverId=67303d06cb7c4c16b5be3492dafb9cae"], -a[href="#!/livetv.html?tab=5&serverId=67303d06cb7c4c16b5be3492dafb9cae"] { - display: none; -} - -.headerTabs .emby-tab-button { - /* Set your desired width */ - width: 80px; /* Adjust this value as needed */ -} - -.verticalSection-extrabottompadding > .sectionTitle-cards:not(#similarCollapsible .sectionTitle-cards) { - display: none; -} - -/* Adjusted size for cards in the "Next Up" section */ -@media all and (min-width: 131.25em) { - .verticalSection.section2 .card.overflowBackdropCard { - width: 8vw !important; /* Adjust the width as needed */ - font-size: 90% !important; - } -} - -@media all and (min-width: 120em) and (max-width: 131.25em) { - .verticalSection.section2 .card.overflowBackdropCard { - width: 8.2vw !important; /* Adjust the width as needed */ - font-size: 90% !important; - } -} - -@media all and (min-width: 100em) and (max-width: 120em) { - .verticalSection.section2 .card.overflowBackdropCard { - width: 9.5vw !important; /* Adjust the width as needed */ - font-size: 90% !important; - } -} - -/* Add more media queries for other screen sizes as needed */ - -/* Mobile or smaller screens */ -@media all and (max-width: 25em) { - .verticalSection.section2 .card.overflowBackdropCard { - width: 14vw !important; /* Adjust the width as needed */ - font-size: 90% !important; - } -} - -/* Adjust the size of cards in the "Series" section */ -.verticalSection.detailVerticalSection .overflowPortraitCard { - width: 30vw !important; /* Set the desired width for larger screens */ - font-size: 90% !important; /* Adjust the font size if needed */ -} - -/* Larger screens */ -@media all and (min-width: 48em) and (max-width: 64em) { - .verticalSection.detailVerticalSection .overflowPortraitCard { - width: 15vw !important; /* Set a different width for larger screens */ - } -} - -/* Extra-large screens */ -@media all and (min-width: 64em) { - .verticalSection.detailVerticalSection .overflowPortraitCard { - width: 10vw !important; /* Set an even smaller width for extra-large screens */ - } -} - -/* Mobile or smaller screens */ -@media all and (max-width: 25em) { - .verticalSection.detailVerticalSection .overflowPortraitCard { - width: 80vw !important; /* Set a larger width for smaller screens */ - } -} - -/* Gradient for buttons on hover */ -.mainDrawer-scrollContainer.scrollContainer .navMenuOption:hover, -.mainDrawer-scrollContainer.scrollContainer .navMenuOption:hover emby-button, -button.is-emby-button:hover emby-button { - background: linear-gradient(to right, rgba(163, 95, 198, 1), rgba(6, 161, 217, 1)) !important; - transition: background 0.3s ease; /* Add transition for smooth effect */ -} - -/* Remove default hover background color */ -.mainDrawer-scrollContainer.scrollContainer .navMenuOption, -.mainDrawer-scrollContainer.scrollContainer .navMenuOption emby-button, -button.is-emby-button emby-button { - background-color: transparent !important; /* Set background color to transparent */ - transition: background 0.3s ease; /* Add transition for smooth effect */ -} - -/* Ensure the text color remains white when hovered */ -.mainDrawer-scrollContainer.scrollContainer .navMenuOption:hover .navMenuOptionText, -button.is-emby-button:hover emby-button .navMenuOptionText { - color: white !important; /* Set the text color */ -} - -/* Video Playback Progress Bar */ -.mdl-slider-background-lower, -.mdl-slider-background-upper { - background: linear-gradient(to right, rgba(163, 95, 198, 0.5) 0%, rgba(6, 161, 217, 0.5) 100%); -}