Skip to content

Instantly share code, notes, and snippets.

@tippfehlr
Created January 1, 2024 14:20
Show Gist options
  • Save tippfehlr/2a0cbad8209150c75dc7f24f56e786f0 to your computer and use it in GitHub Desktop.
Save tippfehlr/2a0cbad8209150c75dc7f24f56e786f0 to your computer and use it in GitHub Desktop.
my custom css for Jellyfin

This is my custom css for Jellyfin. these are not my modifications, I copied them from reddit

Features:

  • more appropriately sized episode images
  • rounded corners and square play button
  • minimalistic play buttons
  • blue checkmark and like button

image image

/*Size episode preview images in a more compact way*/
.listItemImageButton-icon {padding: 0;}
.listItemImage.listItemImage-large.itemAction.lazy {height: 110px;}
.listItem-content {height: 115px;}
.secondary.listItem-overview.listItemBodyText {height: 61px; margin: 0;}
.listItemImageButton {margin: auto; font-size: 1.6em !important;}
/*Rounded corners and square hover buttons*/
.cardContent-button,
.cardContent-shadow,
.itemDetailImage,
.cardOverlayButton-hover,
.cardOverlayContainer,
.cardImageContainer,
.cardPadder,
.listItemImage,
.listItemImageButton,
.listItemButton,
.headerButton,
.paper-icon-button-light,
.innerCardFooter,
.blurhash-canvas,
.actionSheetMenuItem:hover,
.dialog
{border-radius: 6px !important;}
/*Minimalistic play buttons*/
.cardOverlayFab-primary {background-color: #00000000;}
.cardOverlayButtonIcon {background-color: #00000000 !important;}
.cardOverlayContainer {background-color: rgba(0, 0, 0, 0.7);}
/*Make the red checkmark and likes blue like everything else*/
.playstatebutton-icon-played, .ratingbutton-icon-withrating {color: #00a4dc;}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment