MaximilianGT500/scyfin
1
0
Fork 0
mirror of https://github.com/loof2736/scyfin.git synced 2025-11-03 16:08:53 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Updated dashboard styling for 10.9.x

Browse Source
This commit is contained in:
loof2736 2024-06-07 22:42:03 -04:00
parent 01ab6af1fe
commit 436fd9db15
2 changed files with 252 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

155
CSS/scyfin-theme-backdrop.css
View File

@ -1,20 +1,24 @@
/* Variables */ /* Variables */
:root { :root {
--main-accent-color: #00a4dc; --primary-accent-color: #00a4dc;
--secondary-accent-color: #00a4dc20; --secondary-accent-color: #00a4dc20;
--main-background-color: #101010; --primary-background-color: #101010;
--secondary-background-color: #181818; --secondary-background-color: #181818;
--main-background-transparent: rgba(35,35,35,0.5); --primary-background-transparent: rgba(35,35,35,0.5);
--secondary-background-transparent: rgba(0,0,0,0.6); --secondary-background-transparent: rgba(0,0,0,0.6);
--rounded-cards: 15px; --rounded-cards: 15px;
} }
/* Setting accent color variable */ /* Setting accent color variable */
.listItemIcon:not(.listItemIcon-transparent):not(.notification_important),
.emby-checkbox:checked + span + .checkboxOutline, .emby-checkbox:checked + span + .checkboxOutline,
.selectionCommandsPanel, .selectionCommandsPanel,
.countIndicator { .countIndicator,
background: var(--main-accent-color) !important; .MuiButton-root,
.MuiChip-root:not(.MuiChip-colorError) {
background: var(--primary-accent-color) !important;
}
.MuiAlert-root {
background: var(--secondary-accent-color) !important;
} }
.emby-checkbox:checked + span + .checkboxOutline, .emby-checkbox:checked + span + .checkboxOutline,
.emby-checkbox:focus:not(:checked) + span + .checkboxOutline, .emby-checkbox:focus:not(:checked) + span + .checkboxOutline,
@ -24,8 +28,9 @@
.mdl-spinner__layer-1, .mdl-spinner__layer-1,
.mdl-spinner__layer-2, .mdl-spinner__layer-2,
.mdl-spinner__layer-3, .mdl-spinner__layer-3,
.mdl-spinner__layer-4 { .mdl-spinner__layer-4,
border-color: var(--main-accent-color) !important; .progressring-spiner {
border-color: var(--primary-accent-color) !important;
} }
.button-link:not(.itemDetailPage .button-link), .button-link:not(.itemDetailPage .button-link),
.selectLabelFocused, .selectLabelFocused,
@ -33,12 +38,13 @@
.inputLabelFocused, .inputLabelFocused,
.emby-tab-button:hover, .emby-tab-button:hover,
.metadataSidebarIcon, .metadataSidebarIcon,
.upNextDialog-countdownText { .upNextDialog-countdownText,
color: var(--main-accent-color) !important; .MuiAlert-icon {
color: var(--primary-accent-color) !important;
} }
@media (hover: hover) and (pointer: fine) { @media (hover: hover) and (pointer: fine) {
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
color: var(--main-accent-color) !important; color: var(--primary-accent-color) !important;
background-color: var(--secondary-accent-color) !important; background-color: var(--secondary-accent-color) !important;
} }
} }
@ -136,7 +142,7 @@
} }
/* Rounded selection menu */ /* Rounded selection menu */
.itemSelectionPanel { .itemSelectionPanel {
border: 2px solid var(--main-accent-color) !important; border: 2px solid var(--primary-accent-color) !important;
} }
.itemSelectionPanel .checkboxOutline { .itemSelectionPanel .checkboxOutline {
margin: 7px !important; margin: 7px !important;
@ -164,7 +170,7 @@
} }
.itemProgressBar:not(.playbackProgress):not(.transcodingProgress):not(.backgroundProgress) { .itemProgressBar:not(.playbackProgress):not(.transcodingProgress):not(.backgroundProgress) {
height: 10px !important; height: 10px !important;
background: var(--main-background-transparent) !important; background: var(--primary-background-transparent) !important;
backdrop-filter: blur(2px) !important; backdrop-filter: blur(2px) !important;
} }
.innerCardFooterClear { .innerCardFooterClear {
@ -174,7 +180,7 @@
padding: 0 0 0 10px !important padding: 0 0 0 10px !important
} }
.itemProgressBarForeground:not(.playbackProgress .itemProgressBarForeground):not(.transcodingProgress .itemProgressBarForeground):not(.backgroundProgress .itemProgressBarForeground) { .itemProgressBarForeground:not(.playbackProgress .itemProgressBarForeground):not(.transcodingProgress .itemProgressBarForeground):not(.backgroundProgress .itemProgressBarForeground) {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
} }
.itemProgressBarForeground { .itemProgressBarForeground {
border-radius: 100px !important; border-radius: 100px !important;
@ -243,7 +249,7 @@
/* Custom button color */ /* Custom button color */
.navMenuOption-selected { .navMenuOption-selected {
background: var(--secondary-accent-color) !important; background: var(--secondary-accent-color) !important;
color: var(--main-accent-color) !important; color: var(--primary-accent-color) !important;
backdrop-filter: blur(50px) !important; backdrop-filter: blur(50px) !important;
} }
@ -263,7 +269,7 @@
/* Rounded header buttons */ /* Rounded header buttons */
.headerTabs, .headerTabs,
.headerRight { .headerRight {
background-color: var(--main-background-transparent) !important; background-color: var(--primary-background-transparent) !important;
border-radius: 50px !important; border-radius: 50px !important;
backdrop-filter: blur(50px) !important; backdrop-filter: blur(50px) !important;
} }
@ -320,7 +326,7 @@
} }
.toastVisible { .toastVisible {
border-radius: 30px !important; border-radius: 30px !important;
background-color: var(--main-background-transparent) !important; background-color: var(--primary-background-transparent) !important;
} }
.sliderBubble { .sliderBubble {
border-radius: var(--rounded-cards) !important; border-radius: var(--rounded-cards) !important;
@ -340,7 +346,7 @@
} }
.mdl-slider-background-lower { .mdl-slider-background-lower {
border-radius: 100px !important; border-radius: 100px !important;
background-color: var(--main-accent-color) !important; background-color: var(--primary-accent-color) !important;
} }
.mdl-slider::-moz-range-thumb, .mdl-slider::-moz-range-thumb,
.mdl-slider::-webkit-slider-thumb { .mdl-slider::-webkit-slider-thumb {
@ -361,7 +367,7 @@
transform: translateX(-3px) !important; transform: translateX(-3px) !important;
} }
.iconOsdProgressInner { .iconOsdProgressInner {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
} }
/* Up next card */ /* Up next card */
@ -409,6 +415,9 @@
.skipIntro .paper-icon-button-light:hover:not(:disabled) { .skipIntro .paper-icon-button-light:hover:not(:disabled) {
color: #FFF !important; color: #FFF !important;
} }
.sliderMarker {
display: none !important;
}
@ -429,7 +438,7 @@
border-radius: 100px !important; border-radius: 100px !important;
} }
.button-submit { .button-submit {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
} }
/* Modify username placement on profile page */ /* Modify username placement on profile page */
.layout-desktop #userProfilePage .readOnlyContent div:not([class]), div[class=""]{ .layout-desktop #userProfilePage .readOnlyContent div:not([class]), div[class=""]{
@ -473,13 +482,93 @@
} }
.layout-desktop div[data-role="controlgroup"] a.ui-btn-active { .layout-desktop div[data-role="controlgroup"] a.ui-btn-active {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
border-radius: 100px !important; border-radius: 100px !important;
} }
.layout-desktop .dashboardDocument .mainAnimatedPage {
left: 260px !important;
}
#libraryDisplayPage,
#metadataImagesConfigurationPage,
#metadataNfoPage {
margin-top: 40px !important;
}
#mediaLibraryPage {
margin-top: 10px !important;
}
/* Re-align active devices in dashboard */ /* Re-align active devices in dashboard */
.activeDevices.itemsContainer { .activeDevices.itemsContainer {
margin: 0px !important; margin: 0px !important;
} }
.playbackProgress > div {
background: var(--primary-accent-color) !important;
}
/* IntroSkipper settings */
.layout-desktop summary {
border-radius: 100px !important;
}
.layout-desktop fieldset.verticalSection-extrabottompadding,
.layout-tv fieldset.verticalSection-extrabottompadding {
padding: 10px 35px 20px 35px !important;
}
#intro_reqs,
#edl,
#silence,
#support {
padding-bottom: 10px !important;
}
/* Dashboard fixes for 10.9.x */
.layout-desktop #userProfilesPage {
left: 260px !important;
}
.MuiAlert-message {
color: #fff !important;
}
.MuiDataGrid-root {
border-radius: var(--rounded-cards) !important;
}
.infoBanner,
.MuiPopover-paper {
border-radius: var(--rounded-cards) !important;
}
.MuiToggleButton-root {
border-radius: var(--rounded-cards);
padding-inline: 15px !important;
}
.MuiAppBar-root {
padding: 10px !important;
}
.MuiList-subheader .MuiListItemButton-root {
border-radius: 100px !important;
margin: 2px 15px !important;
transition: .2s !important;
}
.MuiList-subheader .MuiListItemButton-root:not(.Mui-selected) {
color: #D1D1D1
}
.MuiList-subheader .MuiListItemButton-root:hover:not(.Mui-selected) {
transform: scale(1.05) !important;
background: rgba(44, 44, 44, 0.7) !important;
}
.Mui-selected {
color: var(--primary-accent-color) !important;
background: var(--secondary-accent-color) !important;
}
.MuiDrawer-paper {
border-right: none !important;
background: var(--secondary-background-color)
}
.MuiListItemIcon-root {
color: inherit !important;
}
.MuiPopover-paper {
background: #252525 !important;
color: #D1D1D1 !important;
}
.listItemIcon:not(.listItemIcon-transparent):not(.notification_important) {
background: var(--secondary-accent-color) !important;
color: var(--primary-accent-color) !important;
}
@ -498,13 +587,13 @@
background: var(--secondary-accent-color) !important; background: var(--secondary-accent-color) !important;
} }
.jstree-wholerow-hovered { .jstree-wholerow-hovered {
background: var(--main-background-transparent) !important; background: var(--primary-background-transparent) !important;
} }
.jstree-children { .jstree-children {
margin-left: -10px !important; margin-left: -10px !important;
} }
#editItemMetadataPage .btnHeaderSave { #editItemMetadataPage .btnHeaderSave {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
border-radius: 100px !important; border-radius: 100px !important;
height: 40px !important; height: 40px !important;
color: white !important; color: white !important;
@ -541,7 +630,7 @@
/* Add card around top-right buttons */ /* Add card around top-right buttons */
.layout-desktop .mainDetailButtons { .layout-desktop .mainDetailButtons {
background: var(--main-background-transparent) !important; background: var(--primary-background-transparent) !important;
border-radius: 100px !important; border-radius: 100px !important;
backdrop-filter: blur(10px) !important; backdrop-filter: blur(10px) !important;
} }
@ -552,7 +641,7 @@
/* Add card around groups section */ /* Add card around groups section */
.layout-desktop .detailsGroupItem { .layout-desktop .detailsGroupItem {
background: var(--main-background-transparent) !important; background: var(--primary-background-transparent) !important;
padding: 10px 20px !important; padding: 10px 20px !important;
border-radius: 100px !important; border-radius: 100px !important;
width: fit-content !important; width: fit-content !important;
@ -578,7 +667,7 @@
/* Add card around description */ /* Add card around description */
.layout-desktop .detailSectionContent { .layout-desktop .detailSectionContent {
background: var(--main-background-transparent) !important; background: var(--primary-background-transparent) !important;
border-radius: var(--rounded-cards) !important; border-radius: var(--rounded-cards) !important;
padding: 40px 20px 10px 20px !important; padding: 40px 20px 10px 20px !important;
margin-top: 50px !important; margin-top: 50px !important;
@ -592,7 +681,7 @@
/* Add card around track selection */ /* Add card around track selection */
.layout-desktop .trackSelections { .layout-desktop .trackSelections {
background: var(--main-background-transparent) !important; background: var(--primary-background-transparent) !important;
border-radius: var(--rounded-cards) !important; border-radius: var(--rounded-cards) !important;
padding: 10px 20px !important; padding: 10px 20px !important;
margin-top: 20px !important; margin-top: 20px !important;
@ -633,6 +722,12 @@
padding-left: 20.4vw !important; padding-left: 20.4vw !important;
min-height: 29vw !important; min-height: 29vw !important;
} }
.layout-desktop .detailPageSecondaryContainer:has(.moreFromSeasonSection:not(.hide)) .detailPagePrimaryContent {
min-height: 12vw !important;
}
.layout-desktop .detailPageSecondaryContainer:has(#childrenCollapsible:not(.hide) div[data-type="Audio"]) .detailPagePrimaryContent {
min-height: 20vw !important;
}
/* Move track selection box */ /* Move track selection box */
.detailSection { .detailSection {
@ -699,7 +794,7 @@
margin-right: -85px !important; margin-right: -85px !important;
padding-right: 20px !important; padding-right: 20px !important;
right: 110px !important; right: 110px !important;
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
border-radius: 100px !important; border-radius: 100px !important;
color: var(--secondary-background-color) !important; color: var(--secondary-background-color) !important;
} }
@ -716,7 +811,7 @@
background: var(--secondary-background-color) !important; background: var(--secondary-background-color) !important;
} }
/* Translucent buttons */ /* Translucent buttons */
.raised.emby-button:not(.button-submit) { .raised.emby-button:not(.button-submit):not(.btnForgotPassword) {
background: rgba(35, 35, 35, 0.5) !important; background: rgba(35, 35, 35, 0.5) !important;
backdrop-filter: blur(40px) !important; backdrop-filter: blur(40px) !important;
} }
@ -849,7 +944,7 @@
color: rgba(255, 255, 255, 0.5) !important; color: rgba(255, 255, 255, 0.5) !important;
z-index: 1 !important; z-index: 1 !important;
} }
.layout-desktop #loginPage .disclaimerContainer { .layout-desktop #loginPage .loginDisclaimerContainer {
top: 130px !important; top: 130px !important;
position: relative !important; position: relative !important;
left: -50px !important; left: -50px !important;

155
CSS/scyfin-theme.css
View File

@ -1,20 +1,24 @@
/* Variables */ /* Variables */
:root { :root {
--main-accent-color: #00a4dc; --primary-accent-color: #00a4dc;
--secondary-accent-color: #00a4dc20; --secondary-accent-color: #00a4dc20;
--main-background-color: #101010; --primary-background-color: #101010;
--secondary-background-color: #181818; --secondary-background-color: #181818;
--main-background-transparent: rgba(35,35,35,0.5); --primary-background-transparent: rgba(35,35,35,0.5);
--secondary-background-transparent: rgba(0,0,0,0.6); --secondary-background-transparent: rgba(0,0,0,0.6);
--rounded-cards: 15px; --rounded-cards: 15px;
} }
/* Setting accent color variable */ /* Setting accent color variable */
.listItemIcon:not(.listItemIcon-transparent):not(.notification_important),
.emby-checkbox:checked + span + .checkboxOutline, .emby-checkbox:checked + span + .checkboxOutline,
.selectionCommandsPanel, .selectionCommandsPanel,
.countIndicator { .countIndicator,
background: var(--main-accent-color) !important; .MuiButton-root,
.MuiChip-root:not(.MuiChip-colorError) {
background: var(--primary-accent-color) !important;
}
.MuiAlert-root {
background: var(--secondary-accent-color) !important;
} }
.emby-checkbox:checked + span + .checkboxOutline, .emby-checkbox:checked + span + .checkboxOutline,
.emby-checkbox:focus:not(:checked) + span + .checkboxOutline, .emby-checkbox:focus:not(:checked) + span + .checkboxOutline,
@ -24,8 +28,9 @@
.mdl-spinner__layer-1, .mdl-spinner__layer-1,
.mdl-spinner__layer-2, .mdl-spinner__layer-2,
.mdl-spinner__layer-3, .mdl-spinner__layer-3,
.mdl-spinner__layer-4 { .mdl-spinner__layer-4,
border-color: var(--main-accent-color) !important; .progressring-spiner {
border-color: var(--primary-accent-color) !important;
} }
.button-link:not(.itemDetailPage .button-link), .button-link:not(.itemDetailPage .button-link),
.selectLabelFocused, .selectLabelFocused,
@ -33,12 +38,13 @@
.inputLabelFocused, .inputLabelFocused,
.emby-tab-button:hover, .emby-tab-button:hover,
.metadataSidebarIcon, .metadataSidebarIcon,
.upNextDialog-countdownText { .upNextDialog-countdownText,
color: var(--main-accent-color) !important; .MuiAlert-icon {
color: var(--primary-accent-color) !important;
} }
@media (hover: hover) and (pointer: fine) { @media (hover: hover) and (pointer: fine) {
.paper-icon-button-light:hover:not(:disabled) { .paper-icon-button-light:hover:not(:disabled) {
color: var(--main-accent-color) !important; color: var(--primary-accent-color) !important;
background-color: var(--secondary-accent-color) !important; background-color: var(--secondary-accent-color) !important;
} }
} }
@ -136,7 +142,7 @@
} }
/* Rounded selection menu */ /* Rounded selection menu */
.itemSelectionPanel { .itemSelectionPanel {
border: 2px solid var(--main-accent-color) !important; border: 2px solid var(--primary-accent-color) !important;
} }
.itemSelectionPanel .checkboxOutline { .itemSelectionPanel .checkboxOutline {
margin: 7px !important; margin: 7px !important;
@ -164,7 +170,7 @@
} }
.itemProgressBar:not(.playbackProgress):not(.transcodingProgress):not(.backgroundProgress) { .itemProgressBar:not(.playbackProgress):not(.transcodingProgress):not(.backgroundProgress) {
height: 10px !important; height: 10px !important;
background: var(--main-background-transparent) !important; background: var(--primary-background-transparent) !important;
backdrop-filter: blur(2px) !important; backdrop-filter: blur(2px) !important;
} }
.innerCardFooterClear { .innerCardFooterClear {
@ -174,7 +180,7 @@
padding: 0 0 0 10px !important padding: 0 0 0 10px !important
} }
.itemProgressBarForeground:not(.playbackProgress .itemProgressBarForeground):not(.transcodingProgress .itemProgressBarForeground):not(.backgroundProgress .itemProgressBarForeground) { .itemProgressBarForeground:not(.playbackProgress .itemProgressBarForeground):not(.transcodingProgress .itemProgressBarForeground):not(.backgroundProgress .itemProgressBarForeground) {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
} }
.itemProgressBarForeground { .itemProgressBarForeground {
border-radius: 100px !important; border-radius: 100px !important;
@ -243,13 +249,17 @@
/* Custom button color */ /* Custom button color */
.navMenuOption-selected { .navMenuOption-selected {
background: var(--secondary-accent-color) !important; background: var(--secondary-accent-color) !important;
color: var(--main-accent-color) !important; color: var(--primary-accent-color) !important;
} }
/* Modified background color */ /* Modified background color */
html, html,
.backgroundContainer { .backgroundContainer:not(.withBackdrop),
background-color: var(--main-background-color) !important; .noBackdropTransparency .detailPageSecondaryContainer {
background-color: var(--primary-background-color) !important;
}
.backgroundContainer.withBackdrop {
background: var(--secondary-background-transparent) !important;
} }
@ -267,7 +277,7 @@ html,
/* Rounded header buttons */ /* Rounded header buttons */
.headerTabs, .headerTabs,
.headerRight { .headerRight {
background-color: var(--main-background-transparent) !important; background-color: var(--primary-background-transparent) !important;
border-radius: 50px !important; border-radius: 50px !important;
backdrop-filter: blur(50px) !important; backdrop-filter: blur(50px) !important;
} }
@ -324,7 +334,7 @@ html,
} }
.toastVisible { .toastVisible {
border-radius: 30px !important; border-radius: 30px !important;
background-color: var(--main-background-transparent) !important; background-color: var(--primary-background-transparent) !important;
} }
.sliderBubble { .sliderBubble {
border-radius: var(--rounded-cards) !important; border-radius: var(--rounded-cards) !important;
@ -344,7 +354,7 @@ html,
} }
.mdl-slider-background-lower { .mdl-slider-background-lower {
border-radius: 100px !important; border-radius: 100px !important;
background-color: var(--main-accent-color) !important; background-color: var(--primary-accent-color) !important;
} }
.mdl-slider::-moz-range-thumb, .mdl-slider::-moz-range-thumb,
.mdl-slider::-webkit-slider-thumb { .mdl-slider::-webkit-slider-thumb {
@ -365,7 +375,7 @@ html,
transform: translateX(-3px) !important; transform: translateX(-3px) !important;
} }
.iconOsdProgressInner { .iconOsdProgressInner {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
} }
/* Up next card */ /* Up next card */
@ -413,6 +423,9 @@ html,
.skipIntro .paper-icon-button-light:hover:not(:disabled) { .skipIntro .paper-icon-button-light:hover:not(:disabled) {
color: #FFF !important; color: #FFF !important;
} }
.sliderMarker {
display: none !important;
}
@ -433,7 +446,7 @@ html,
border-radius: 100px !important; border-radius: 100px !important;
} }
.button-submit { .button-submit {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
} }
/* Modify username placement on profile page */ /* Modify username placement on profile page */
.layout-desktop #userProfilePage .readOnlyContent div:not([class]), div[class=""]{ .layout-desktop #userProfilePage .readOnlyContent div:not([class]), div[class=""]{
@ -477,13 +490,93 @@ html,
} }
.layout-desktop div[data-role="controlgroup"] a.ui-btn-active { .layout-desktop div[data-role="controlgroup"] a.ui-btn-active {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
border-radius: 100px !important; border-radius: 100px !important;
} }
.layout-desktop .dashboardDocument .mainAnimatedPage {
left: 260px !important;
}
#libraryDisplayPage,
#metadataImagesConfigurationPage,
#metadataNfoPage {
margin-top: 40px !important;
}
#mediaLibraryPage {
margin-top: 10px !important;
}
/* Re-align active devices in dashboard */ /* Re-align active devices in dashboard */
.activeDevices.itemsContainer { .activeDevices.itemsContainer {
margin: 0px !important; margin: 0px !important;
} }
.playbackProgress > div {
background: var(--primary-accent-color) !important;
}
/* IntroSkipper settings */
.layout-desktop summary {
border-radius: 100px !important;
}
.layout-desktop fieldset.verticalSection-extrabottompadding,
.layout-tv fieldset.verticalSection-extrabottompadding {
padding: 10px 35px 20px 35px !important;
}
#intro_reqs,
#edl,
#silence,
#support {
padding-bottom: 10px !important;
}
/* Dashboard fixes for 10.9.x */
.layout-desktop #userProfilesPage {
left: 260px !important;
}
.MuiAlert-message {
color: #fff !important;
}
.MuiDataGrid-root {
border-radius: var(--rounded-cards) !important;
}
.infoBanner,
.MuiPopover-paper {
border-radius: var(--rounded-cards) !important;
}
.MuiToggleButton-root {
border-radius: var(--rounded-cards);
padding-inline: 15px !important;
}
.MuiAppBar-root {
padding: 10px !important;
}
.MuiList-subheader .MuiListItemButton-root {
border-radius: 100px !important;
margin: 2px 15px !important;
transition: .2s !important;
}
.MuiList-subheader .MuiListItemButton-root:not(.Mui-selected) {
color: #D1D1D1
}
.MuiList-subheader .MuiListItemButton-root:hover:not(.Mui-selected) {
transform: scale(1.05) !important;
background: rgba(44, 44, 44, 0.7) !important;
}
.Mui-selected {
color: var(--primary-accent-color) !important;
background: var(--secondary-accent-color) !important;
}
.MuiDrawer-paper {
border-right: none !important;
background: var(--secondary-background-color)
}
.MuiListItemIcon-root {
color: inherit !important;
}
.MuiPopover-paper {
background: #252525 !important;
color: #D1D1D1 !important;
}
.listItemIcon:not(.listItemIcon-transparent):not(.notification_important) {
background: var(--secondary-accent-color) !important;
color: var(--primary-accent-color) !important;
}
@ -502,13 +595,13 @@ html,
background: var(--secondary-accent-color) !important; background: var(--secondary-accent-color) !important;
} }
.jstree-wholerow-hovered { .jstree-wholerow-hovered {
background: var(--main-background-transparent) !important; background: var(--primary-background-transparent) !important;
} }
.jstree-children { .jstree-children {
margin-left: -10px !important; margin-left: -10px !important;
} }
#editItemMetadataPage .btnHeaderSave { #editItemMetadataPage .btnHeaderSave {
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
border-radius: 100px !important; border-radius: 100px !important;
height: 40px !important; height: 40px !important;
color: white !important; color: white !important;
@ -545,7 +638,7 @@ html,
/* Add card around top-right buttons */ /* Add card around top-right buttons */
.mainDetailButtons { .mainDetailButtons {
background: var(--main-background-transparent) !important; background: var(--primary-background-transparent) !important;
border-radius: 100px !important; border-radius: 100px !important;
backdrop-filter: blur(10px) !important; backdrop-filter: blur(10px) !important;
} }
@ -624,6 +717,12 @@ html,
padding-left: 20.4vw !important; padding-left: 20.4vw !important;
min-height: 29vw !important; min-height: 29vw !important;
} }
.layout-desktop .detailPageSecondaryContainer:has(.moreFromSeasonSection:not(.hide)) .detailPagePrimaryContent {
min-height: 12vw !important;
}
.layout-desktop .detailPageSecondaryContainer:has(#childrenCollapsible:not(.hide) div[data-type="Audio"]) .detailPagePrimaryContent {
min-height: 20vw !important;
}
/* Move track selection box */ /* Move track selection box */
.detailSection { .detailSection {
@ -683,7 +782,7 @@ html,
margin-right: -85px !important; margin-right: -85px !important;
padding-right: 20px !important; padding-right: 20px !important;
right: 110px !important; right: 110px !important;
background: var(--main-accent-color) !important; background: var(--primary-accent-color) !important;
border-radius: 100px !important; border-radius: 100px !important;
color: var(--secondary-background-color) !important; color: var(--secondary-background-color) !important;
} }
@ -817,7 +916,7 @@ html,
color: rgba(255, 255, 255, 0.5) !important; color: rgba(255, 255, 255, 0.5) !important;
z-index: 1 !important; z-index: 1 !important;
} }
.layout-desktop #loginPage .disclaimerContainer { .layout-desktop #loginPage .loginDisclaimerContainer {
top: 130px !important; top: 130px !important;
position: relative !important; position: relative !important;
left: -50px !important; left: -50px !important;