Jump to content

Transparent Grey Background to Episode Summary - not working


cochize1

Recommended Posts

I believe that either this code to adding grey background to episodes summary isn't working or it is colliding somehow with my existing code, I paste both below:

/* Add Transparent Grey Background to Episode Summary */
div.listItem-withContentWrapper div.listItem-content {background: rgba(0, 0, 0, 0.3);}

my code:


/*--przesun sekcje wyzej--*/
div.page {margin-top: -20px;}
div.headerTop-withSectionTabs {padding: .8em 0 0; }
div.headerMiddle.sectionTabs {margin: 0 20em; }
div.homeSectionsContainer .verticalSection,div.nextUpSection.verticalSection, div.recentlyPlayedSection.verticalSection, div.frequentlyPlayedSection.verticalSection, div.suggestions, div.suggestions .verticalSection {margin-top: -1.5em;}
div.withTabs .padded-top-page:not(.homeSectionsContainer) {padding-top: 6em!important;}
div.section0 .cardText {display: none;}

/*Make skinHeader transparent*/
div.skinHeader.skinHeader-withBackground {
    background: transparent;
    backdrop-filter: none;
}

/*usun nspis Moje Media*/
body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-column.withTabs.page > div.tabContent.flex.flex-grow.is-active > div > div.scrollSlider.flex-grow.padded-top-page.sections.scrollSliderY.homeSectionsContainer > div.verticalSection.section0 > div.sectionTitleContainer.sectionTitleContainer-cards 
{display: none; }

/*---rozmiar logo----*/
.noScrollY h3.pageTitleWithDefaultLogo {
    width: 8em;
    height: 2.5em;
}

/*----rozmiar siatki Users na Login Page----*/
[data-type="User"] div.cardBox.cardBox-touchzoom.cardBox-bottompadded {margin-bottom: 0em!important;}

[data-type="ForgotPassword"]
{
	display: none;
}

/*usun imiona logowania*/
body > div.mainAnimatedPages.skinBody > div > div > div.vertical-wrap.centered.itemsContainer.padded-top.padded-bottom.padded-left.padded-right > div > div > div.cardText.cardTextCentered.cardText-first > button {display: none; }
body > div.mainAnimatedPages.skinBody > div > div > div.vertical-wrap.centered.itemsContainer.padded-top.padded-bottom.padded-left.padded-right > div:nth-child(24) {display: none; }

/*usun zaloguj, anuluj i haslo*/
body > div.mainAnimatedPages.skinBody > div > div > form > button.raised.block.buttonCancel.emby-button {display: none; }
body > div.mainAnimatedPages.skinBody > div > div > form > div:nth-child(7) > button.raised.cancel.block.btnForgotPassword.emby-button  {display: none; }
body > div.mainAnimatedPages.skinBody > div > div > div.verticalSection.flex-shrink-zero.flex.flex-direction-column.padded-bottom > div > h1 {display: none }
body > div.mainAnimatedPages.skinBody > div > div > form > h1 {display: none }

/* ustawienia strony logowania */
body > div.skinHeader.focuscontainer-x > div > div.headerRight.focuscontainer-right > button.raised.button-submit.btnHeaderPremiere.headerButton.emby-button {display: none }
body > div.mainAnimatedPages.skinBody > div > div > div.verticalSection.flex-shrink-zero.flex.flex-direction-column.padded-bottom {display: none }
body > div.mainAnimatedPages.skinBody > div > div > div.vertical-wrap.centered.itemsContainer.padded-top.padded-bottom.padded-left.padded-right > div > div > div.cardText.cardTextCentered.cardText-first {display: none }
body > div.mainAnimatedPages.skinBody > div > div > div.vertical-wrap.centered.itemsContainer.padded-top.padded-bottom.padded-left.padded-right > div > div {margin: 0em;}
#homeTab > div > div.section0 > div > div.itemsContainer.padded-left.padded-right.vertical-wrap.focuscontainer-x > div > div {margin: 0.5em;}
#homeTab > div > div.section1 > div > div.padded-top-focusscale.padded-bottom-focusscale.emby-scroller.emby-scrollbuttons-scroller > div.itemsContainer.scrollSlider.focuscontainer-x.padded-left.padded-right.scrollX.hiddenScrollX > div > div{margin: 0.4em;}
body > div.mainAnimatedPages.skinBody > div > div > form > button.raised.block.paperSubmit.emby-button
{
	background-color: #52b54b!important;
}

[data-type="ManualLogin"]
{
	color: #52b54b!important;
}

/* szerokosc formularza logowania */
body > div.mainAnimatedPages.skinBody > div > div > form{
    max-width: 55em; }

/*podniesienie zdjec logowania*/

#loginPage > div.scrollSlider.flex.flex-grow.flex-direction-column.padded-top-page.padded-bottom-page > div.vertical-wrap.centered.itemsContainer.padded-top.padded-bottom.padded-left.padded-right
{
	position: relative!important;
	top: -15px;
}

/*----- Remove dark overlay on posters on hover ----*/
.cardOverlayContainer{background: none!important;}

/* ----- Poster enlarge on hover ----*/
#homeTab .cardBox{transition:all 0.2s;}
#homeTab .cardBox:hover {transform:scale(1.045);transition:all 0.2s;}
#moviesPage .cardBox{transition:all 0.2s;}
#moviesPage .cardBox:hover {transform:scale(1.045);transition:all 0.2s;}
#tvPage .cardBox{transition:all 0.2s;}
#tvPage .cardBox:hover {transform:scale(1.045);transition:all 0.2s;}
#itemDetailPage .cardBox{transition:all 0.2s;}
#itemDetailPage .cardBox:hover {transform:scale(1.045);transition:all 0.2s;}
[data-type="ManualLogin"] .cardBox{transition:all 0.2s;}
[data-type="ManualLogin"] .cardBox:hover {transform:scale(1.125);transition:all 0.2s;}

/* przyciemnienie plakatow */
.cardBox{
opacity: .75;}
.cardBox:hover{
opacity: 1;}

/* ---- Removes play button overlay on posters ----*/
.cardOverlayFab-primary {
   display:none;
}


/*Scrollbar Opacity*/
html ::-webkit-scrollbar-track-piece {
    background-color: rgba(0,0,0,.1);
}

/*Scrollbar width*/
html ::-webkit-scrollbar {
    width: .1em;
}

::selection, ::-moz-selection {
  color: green;
  background-color: rgba(0,0,0,.1);
}


/*Make count Indicator more square*/
div.countIndicator, i.cardPlayedIndicator
{
    transform: square;
    border-radius: 20%;
	background-color: #52B54B;
	border-style: double;
	border-color: #52B54B;
    border-width: 1px;
	height: 18px;
    width: 23px;
	}

/*----usuniecie Emby Server version----*/
body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-column.scrollFrameY.flex-grow.emby-scroller.page.scrollY > div > div > p {display: none; }

/*Wyrzucenie rodzaju video*/
div.selectContainer.selectContainer-inline.selectVideoContainer.trackSelectionFieldContainer.flex-shrink-zero{
    display: none!important;
}

/* ----- hide media information ----*/
div.verticalSection.audioVideoMediaInfo
{
    display: none!important;
}

/*Left and Right Scroll Button Opacity*/
div.scrollbuttoncontainer {
	background: rgba(255,255,255,.4); 
	}

/* granice miedzy Moje Media */
body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-column.withTabs.page > div.tabContent.flex.flex-grow.is-active > div > div.scrollSlider.flex-grow.padded-top-page.sections.scrollSliderY.homeSectionsContainer > div.verticalSection.section0 > div.padded-top-focusscale.padded-bottom-focusscale.emby-scroller.emby-scrollbuttons-scroller > div.itemsContainer.scrollSlider.focuscontainer-x.padded-left.padded-right.itemsContainer-finepointerwrap.scrollX.hiddenScrollX.scrollSliderX.emby-scrollbuttons-scrollSlider > div > div
{margin: 0.5em;}

/* rozmiar plakatów */
body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-column.withTabs.page > div.tabContent.flex.flex-grow.is-active > div > div.scrollSlider.flex-grow.padded-top-page.sections.scrollSliderY.homeSectionsContainer > div.section1 > div > div.padded-top-focusscale.padded-bottom-focusscale.emby-scroller.emby-scrollbuttons-scroller > div.itemsContainer.scrollSlider.focuscontainer-x.padded-left.padded-right.scrollX.hiddenScrollX.scrollSliderX.emby-scrollbuttons-scrollSlider > div
{
    width: 10em!important;
    height: auto;
}

/*-----rozmiar Kontynuuj i Do obejrzenia------*/
body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-column.withTabs.page > div.tabContent.flex.flex-grow.is-active > div > div.scrollSlider.flex-grow.padded-top-page.sections.scrollSliderY.homeSectionsContainer > div.verticalSection.section2.focusable > div.padded-top-focusscale.padded-bottom-focusscale.emby-scroller.emby-scrollbuttons-scroller > div.itemsContainer.scrollSlider.focuscontainer-x.padded-left.padded-right.scrollX.hiddenScrollX.scrollSliderX.emby-scrollbuttons-scrollSlider > div
{    width: 16em!important;
    height: auto;
}

body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-column.withTabs.page > div.tabContent.flex.flex-grow.is-active > div > div.scrollSlider.flex-grow.padded-top-page.sections.scrollSliderY.homeSectionsContainer > div.verticalSection.section3.focusable > div > div.itemsContainer.scrollSlider.focuscontainer-x.padded-left.padded-right.scrollX.hiddenScrollX.scrollSliderX.emby-scrollbuttons-scrollSlider > div
{    width: 16em!important;
    height: auto;
}

/*Hide Menu Add to Playlist option*/
button[data-id="addtoplaylist"] {display: none; }
button[data-id="addtocollection"] {display: none; }
button[data-id="playallfromhere"] {display: none; }

/* Make Star Rating Gold */
.starIcon { color: #D4AF37 !important;}

/* Make Progress Bar Slightly Larger and Transparent */
.itemProgressBar {height: 8px !important; opacity: 0.75;}
.detailImageProgressContainer {bottom: 0;}

/*----dialog box mniejsze i na srodku-----*/
@media all and (max-height:45em),(max-width:50em){.actionSheet{width:fit-content!important;}}

/* ----- Section Title Font Adjustments ----*/
.sectionTitle h1, h2 {
     color: white; !important;
    font-size: 1.1em; opacity: 0.7;
}

body, h1, h2, h3, h4 {
  font-family: 'Proxima Nova',-apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif!important
}


/*Remove Card background Shadow and Box Outline*/
button.cardContent-shadow {background-color: transparent; box-shadow:  none; }

/* Make Backdrop Much Brighter*/
div.backgroundContainer.withBackdrop {background: rgba(0,0,0,.80)!important;}

/* ---- Modify Blank Actors Appearance ---*/
#castContent .cardImageIcon {color: grey;}
#castContent .defaultCardBackground1,
#castContent .defaultCardBackground2,
#castContent .defaultCardBackground3,
#castContent .defaultCardBackground4,
#castContent .defaultCardBackground5
 {background-color: transparent;}

/*---drawer transparent----*/
.mainDrawer{
opacity: .75;}

/*zmiana koloru przyciskow u giry strony*/
body > div.skinHeader.focuscontainer-x.skinHeader-withBackground.headroom > div > div.headerLeft.headerPartFixedWidth > button.headerMenuButton.headerButton.paper-icon-button-light.hiddenWhenBottomNavVisible
{
	color: #52b54b!important;
}
body > div.skinHeader.focuscontainer-x.skinHeader-withBackground.headroom.semiTransparent > div > div.headerLeft > button.headerMenuButton.headerButton.paper-icon-button-light.hiddenWhenBottomNavVisible
{
	color: #52b54b!important;
}
body > div.skinHeader.focuscontainer-x.skinHeader-withBackground.headroom > div > div.headerLeft > button.headerMenuButton.headerButton.paper-icon-button-light.hiddenWhenBottomNavVisible
{
	color: white; !important;
    opacity: 0.7;
}
body > div.skinHeader.focuscontainer-x.skinHeader-withBackground > div > div.headerRight.focuscontainer-right > button.headerSearchButton.headerButton.paper-icon-button-light.hiddenWhenBottomNavVisible
{
	color: #52b54b!important;
}

/*---usun 3 kropki----*/
body > div.mainAnimatedPages.skinBody > div.itemView.view.flex.flex-direction-column.scrollFrameY.flex-grow.emby-scroller.page.scrollY.overflowYScroll > div > div.topDetailsContainer.flex.flex-direction-row-reverse > div.flex-grow.topDetailsMain.flex.flex-direction-column > div.verticalSection.detailMainContainer.flex.flex-direction-row.align-items-flex-start.padded-left.padded-right.padded-bottom > div.flex-grow > div.detailButtons.mainDetailButtons.flex.align-items-flex-start.flex-wrap-wrap.focuscontainer-x.detailButtons-largefont > button.btnMoreCommands.detailButton.emby-button
{
   display:none;
}

/*--usun ilosc pozycji w serialach itp ----*/
div.listTotalRecordCount
{
   display:none;
}

/*---usuniecie przyciskow DLNA, Settings i Emby Server klawiatura---*/
button.headerSettingsButton {display: none;}
button.headerCastButton {display: none;}
body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-column.scrollFrameY.flex-grow.emby-scroller.page.scrollY > div > div > div > h3:nth-child(9)
{display: none;}
body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-column.scrollFrameY.flex-grow.emby-scroller.page.scrollY > div > div > div > a:nth-child(10)
{display: none;}

/*----zmiana kolorow przyciskow Play itd.-----*/
button.btnPlay i {color: #52b54b;}
button.btnResume i {color: #D4AF37;}
button.btnPlayTrailer i {color: #3396FF;}
button.btnShuffle i {color: #E0B0E8;}

/*---zmiana kolorow przyciskow subtitles, audio itd----*/
select.emby-select-withcolor.emby-select
{background-color: #52B54B; opacity: .73;}

/*---dodaje Gatunek---*/
div.detailMainContainer div.genres:before {content:"Gatunek: ";}

/*---usuwa More i Select z overlay---*/
label.cardOverlayButton[title="Wielokrotny wybór"] {display: none !important;}
button.cardOverlayButton[title="Więcej"] {display: none;}

/*---zmiana pozycji Sezony z Do Obejrzenia----*/
div.itemMainScrollSlider {display: flex; flex-direction: column;}
div.verticalSection.itemNextUpSection { order: 2;}
div.verticalSection.childrenSection { order: 1;}
div.verticalSection.peopleSection {order: 3;}
div.verticalSection.similarSection {order: 4;} 
div.verticalSection.tagsSection{order: 9;}
div.verticalSection.linksSection{order: 9;}
div.verticalSection.audioVideoMediaInfo{order: 9;}

body > div.mainAnimatedPages.skinBody > div:nth-child(3) > div > div.topDetailsContainer.flex.flex-direction-row-reverse > div.flex-grow.topDetailsMain.flex.flex-direction-column > div.verticalSection.detailMainContainer.flex.flex-direction-row.align-items-flex-start.padded-left.padded-right.padded-bottom > div.flex-grow > form > div.selectContainer.selectContainer-inline.selectAudioContainer.trackSelectionFieldContainer.flex-shrink-zero
{display: none;}
body > div.mainAnimatedPages.skinBody > div:nth-child(2) > div > div.topDetailsContainer.flex.flex-direction-row-reverse > div.flex-grow.topDetailsMain.flex.flex-direction-column > div.verticalSection.detailMainContainer.flex.flex-direction-row.align-items-flex-start.padded-left.padded-right.padded-bottom > div.flex-grow > form > div.selectContainer.selectContainer-inline.selectAudioContainer.trackSelectionFieldContainer.flex-shrink-zero
{display: none;}
body > div.mainAnimatedPages.skinBody > div:nth-child(1) > div > div.topDetailsContainer.flex.flex-direction-row-reverse > div.flex-grow.topDetailsMain.flex.flex-direction-column > div.verticalSection.detailMainContainer.flex.flex-direction-row.align-items-flex-start.padded-left.padded-right.padded-bottom > div.flex-grow > form > div.selectContainer.selectContainer-inline.selectAudioContainer.trackSelectionFieldContainer.flex-shrink-zero
{display: none;}

body > div.mainAnimatedPages.skinBody > div:nth-child(1) > div.tabContent.flex.flex-grow.is-active > div.scrollFrameY.flex.flex-grow.focuscontainer-down.virtualScrollerScrollContainer.emby-scroller.scrollY.overflowYScroll > div > div.flex.align-items-center.focuscontainer-x.itemsViewSettingsContainer.padded-bottom.focusable > button.btnPlay.raised.raised-mini.listTextButton-autohide.emby-button
{display: none;}
body > div.mainAnimatedPages.skinBody > div:nth-child(2) > div.tabContent.flex.flex-grow.is-active > div.scrollFrameY.flex.flex-grow.focuscontainer-down.virtualScrollerScrollContainer.emby-scroller.scrollY.overflowYScroll > div > div.flex.align-items-center.focuscontainer-x.itemsViewSettingsContainer.padded-bottom.focusable > button.btnPlay.raised.raised-mini.listTextButton-autohide.emby-button
{display: none;}
body > div.mainAnimatedPages.skinBody > div:nth-child(3) > div.tabContent.flex.flex-grow.is-active > div.scrollFrameY.flex.flex-grow.focuscontainer-down.virtualScrollerScrollContainer.emby-scroller.scrollY.overflowYScroll > div > div.flex.align-items-center.focuscontainer-x.itemsViewSettingsContainer.padded-bottom.focusable > button.btnPlay.raised.raised-mini.listTextButton-autohide.emby-button
{display: none;}
body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-row.page > div.viewScroller.scrollFrameY.flex.flex-grow.focuscontainer-down.virtualScrollerScrollContainer.emby-scroller.scrollY.overflowYScroll > div > div.flex.align-items-center.justify-content-center.focuscontainer-x.itemsViewSettingsContainer.padded-top.padded-bottom > button.btnPlay.raised.raised-mini.listTextButton-autohide.emby-button
{display: none;}

body > div.mainAnimatedPages.skinBody > div:nth-child(2) > div.tabContent.flex.flex-grow.is-active > div.scrollFrameY.flex.flex-grow.focuscontainer-down.virtualScrollerScrollContainer.emby-scroller.scrollY.overflowYScroll > div > div.flex.align-items-center.focuscontainer-x.itemsViewSettingsContainer.padded-bottom.focusable > button.btnViewSettings.paper-icon-button-light
{display: none;}
body > div.mainAnimatedPages.skinBody > div:nth-child(3) > div.tabContent.flex.flex-grow.is-active > div.scrollFrameY.flex.flex-grow.focuscontainer-down.virtualScrollerScrollContainer.emby-scroller.scrollY.overflowYScroll > div > div.flex.align-items-center.focuscontainer-x.itemsViewSettingsContainer.padded-bottom.focusable > button.btnViewSettings.paper-icon-button-light
{display: none;}
body > div.mainAnimatedPages.skinBody > div.view.flex.flex-direction-row.page > div.viewScroller.scrollFrameY.flex.flex-grow.focuscontainer-down.virtualScrollerScrollContainer.emby-scroller.scrollY.overflowYScroll > div > div.flex.align-items-center.justify-content-center.focuscontainer-x.itemsViewSettingsContainer.padded-top.padded-bottom > button.btnViewSettings.paper-icon-button-light
{display: none;}

body > div.skinHeader.focuscontainer-x.headroom.skinHeader-withBackground.adjustHeaderForEmbeddedScroll > div > div.headerMiddle.sectionTabs > div > div > button:nth-child(4)
{display: none;}
body > div.skinHeader.focuscontainer-x.headroom.skinHeader-withBackground.adjustHeaderForEmbeddedScroll > div > div.headerMiddle.sectionTabs > div > div > button:nth-child(7)
{display: none;}
body > div.skinHeader.focuscontainer-x.headroom.skinHeader-withBackground.adjustHeaderForEmbeddedScroll > div > div.headerMiddle.sectionTabs > div > div > button:nth-child(8)
{display: none;}

/*--usuwa info o Emby Premiere z ustawień---*/
div.fieldDescription.featurePremiereInfo
{display: none;}
div.fieldDescription.displayModePremiere
{display: none;}
div.checkboxContainer.checkboxContainer-withDescription.fldDisplayMissingEpisodes
{display: none;}
body > div.mainAnimatedPages.skinBody.skinBody-withFullDrawer > div:nth-child(3) > div > form > div.selectContainer.fldDisplayMode > div:nth-child(3)
{display: none;}
body > div.mainAnimatedPages.skinBody.skinBody-withFullDrawer > div:nth-child(1) > div > form > div.selectContainer.fldDisplayMode > div:nth-child(3)
{display: none;}
body > div.mainAnimatedPages.skinBody.skinBody-withFullDrawer > div:nth-child(2) > div > form > div.selectContainer.fldDisplayMode > div:nth-child(3)
{display: none;}

/*Drawer Emby Web navHeader*/
h3.emby-collapsible-title[title="Emby Web"] {
    visibility: hidden;
    position: relative;
}
h3.emby-collapsible-title[title="Emby Web"]:after {
	content:'Nawigacja';
    visibility: visible;
    position: absolute;
}

/*Replace Emby Web Header on User Settings*/
div.dynamicRoutes h3:nth-child(7), div.dynamicRoutes h3:nth-child(9) {
    visibility: hidden;
    position: relative;
}
div.dynamicRoutes h3:nth-child(7):after, div.dynamicRoutes h3:nth-child(9):after {
    content:'Nawigacja';
    visibility: visible;
    position: absolute;
}

/*usuniecie kreski w context menu*/
div.actionsheetDivider
{display: none;}

/*stala szerokosc 6 okienek my media*/
@media (min-width:90em){.smallBackdropCard{width:16.6666666666667%;}

 

Link to post
Share on other sites
Happy2Play

It appears to be working fine for me.

All your code minus "Add Transparent Grey Background to Episode Summary"

off.thumb.jpg.8663ddbaf56cc245d030cee497dea533.jpg

All your code with "Add Transparent Grey Background to Episode Summary"

on.thumb.jpg.eb92221e8fa5ade8cd08c1deda6d7c90.jpg

4.5.2.0

Link to post
Share on other sites
Happy2Play
8 minutes ago, cochize1 said:

It worked only when I placed the code at the beggining of my existing code

Not sure as I had no issue dropping at any point in your code above.

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...