Latest Beta css changes

[tmb4016 86]

Not sure when this occurred but I am struggling to get some of my custom css working in the latest beta. 

I have a couple of sections that now do not seem to work relating to tiles and folder overlays... Any help appreciated.

Remove titles from various data types ...

[data-type="Genre"]  div.cardText {display: none;}
[data-type="MusicGenre"]  div.cardText {display: none;}
[data-type="Folder"]  div.cardText {display: none;}

These do not seem to work now - Also tried div.CardTextCentered and no joy.  div.cardText {display: none;} still works but has impact on other areas which I do not want to effect.

It seems to be the [data-type] options which are now not being addressed as things like ...

div.cardText.cardTextCentered.cardText-first {display: none;} do work at hiding - in this case the first row of text but obviously have a broader impact than the specific data-type entries.

Folder overlays

/*Remove Folder view Icons*/
[data-type="Photo"] .videoIndicator {display:none; }
[data-type="Video"] .videoIndicator {display:none; }
[data-type="Folder"] .videoIndicator {display:none; }

These used to remove the folder icon from top left of the image but currently not having any impact.

Thanks in advance.

 

 

Edited June 2, 2021 by tmb4016

[Happy2Play 8252]

2 hours ago, tmb4016 said:

Folder overlays

/*Remove Folder view Icons*/
[data-type="Photo"] .videoIndicator {display:none; }
[data-type="Video"] .videoIndicator {display:none; }
[data-type="Folder"] .videoIndicator {display:none; }

These used to remove the folder icon from top left of the image but currently not having any impact.

Replace with something like this

div.cardScalable button i.cardIndicator {display:none; }

 

2 hours ago, tmb4016 said:

Remove titles from various data types ...

[data-type="Genre"]  div.cardText {display: none;}
[data-type="MusicGenre"]  div.cardText {display: none;}
[data-type="Folder"]  div.cardText {display: none;}

Since data-type has been removed, I am not currently seeing a way to do this.

If we had unified tab index number we could but each content type has its own index numbers per tab and no way to target content type as all the page code is identical.  So one would have to add page ids to each html file from my understanding.

 

[tmb4016 86]

@Happy2Play - Ok thanks ...

The overlay one worked great thanks.

 

@Luke on the title display it would be good if we could get some consistency on the display of Title text in the UI without the CSS 

Movies View - Control via tick box of items to display as text

Folder View  - Unticking the Title display check box moves the title as an overlay inside the image.

Tags View - Unticking the Title display check box hides the title fully as expected and required. The desired behaviour?

Genre View - No option to untick the display of Titles present in the ui at all.

Thank again.

 

Edited June 2, 2021 by tmb4016

[tmb4016 86]

HI @Happy2Play,

Just noticed another one as well - not sure if you can help but on the Movies Suggestions page I used to hide the 'Because you watched' sections with 

/*-- Remove Because you watched ... --*/
#moviesPage div.suggestions {display: none; }

this does not seem to work now. Any hints ...

[Happy2Play 8252]

6 hours ago, tmb4016 said:

HI @Happy2Play,

Just noticed another one as well - not sure if you can help but on the Movies Suggestions page I used to hide the 'Because you watched' sections with 

/*-- Remove Because you watched ... --*/
#moviesPage div.suggestions {display: none; }

this does not seem to work now. Any hints ...

Since page ids were removed awhile ago you can no longer target #moviesPage, all you need to do is remove it.

[minininja 0]

The CSS I use to make posters smaller no longer work. Is there an alternative?

The old CSS that used to work before 4.6.1.0:

/*Smaller posters*/
@media (max-width: 95em) and (min-width: 52em)
{.portraitCard {
    width: 12.5%;}
}

 

[minininja 0]

38 minutes ago, minininja said:

The CSS I use to make posters smaller no longer work. Is there an alternative?

The old CSS that used to work before 4.6.1.0:

/*Smaller posters*/
@media (max-width: 95em) and (min-width: 52em)
{.portraitCard {
    width: 12.5%;}
}

Apparently '%' don't work anymore so I got this and seems to work:

/*Smaller posters*/
@media (max-width: 95em) and (min-width: 52em)
{.portraitCard {
    width: 10em;}
}

 

 

[Happy2Play 8252]

On 6/2/2021 at 1:35 AM, tmb4016 said:

Remove titles from various data types ...

[data-type="Genre"]  div.cardText {display: none;}
[data-type="MusicGenre"]  div.cardText {display: none;}
[data-type="Folder"]  div.cardText {display: none;}

With lots of work finding your data-index and parent-id you can target specific tab and library.

example for removing cardtext from genre on my Movies library.

div.tabContent[data-index="9"] div.itemsContainer[data-parentid="f137a2dd21bbc1b99aa5c0f6bf02a805"] div.cardTextCentered {display: none;}

 

Edited June 4, 2021 by Happy2Play

[tmb4016 86]

Hi @Happy2Play

Excellent news... That is much appreciated. Well above even your high standard of effort in these forums. 

Many thanks for you help.