Jellyfin Forum
Help - Printable Version

+- Jellyfin Forum (https://forum.jellyfin.org)
+-- Forum: Support (https://forum.jellyfin.org/f-support)
+--- Forum: Themes & Styles (https://forum.jellyfin.org/f-themes-styles)
+--- Thread: Help (/t-help--6459)



Help - calle - 2024-06-11

Hello
I'm brand new to the forum and I'm just starting to get to grips with Jellyfin.
I have seen in the forum that you can change / pimp the surface individually and I would like to learn how to do that.

Can you briefly tell me where I have to copy what?

Thank you
calle


RE: Help - Ted Hinklater - 2024-06-11

(2024-06-11, 08:15 AM)calle Wrote: Hello
I'm brand new to the forum and I'm just starting to get to grips with Jellyfin.
I have seen in the forum that you can change / pimp the surface individually and I would like to learn how to do that.

Can you briefly tell me where I have to copy what?

Thank you
calle

Hello! I like to use Notepad++ to write the code, it shows you each line number which is helpful when there are hundreds of lines. I also like to use Firefox because it has the Style Editor.

For this specific example:  If you want to capitalize and make red the titles in only the Gallery and only on desktop (not mobile or TV), press Ctrl+Shift+C in the Gallery and click on a title.

[Image: BegEk8S.png]

You can see the div we want is called "cardText cardTextCentered cardText-first" so we can add this to the Custom CSS box (found in Dashboard > General)

Code:
.cardText.cardTextCentered.cardText-first {
    text-transform: uppercase;
    color: red;
}


That changed all the titles to red, on every page, not just the in gallery and not just on desktop like the plan; we need to be more specific, so we add the id found here

[Image: a4XM0yf.png]

and specify that this should only affect Desktop users, so our code becomes...

Code:
.layout-desktop #moviesTab .cardText.cardTextCentered.cardText-first {
    text-transform: uppercase;
    color: red;
}

[Image: DKAGpBz.png]

There is more than that but this is the very basic idea of how it works.