/* Add-on: Media Bar plugin support v25.08.08 for the ElegantFin Theme for Jellyfin by lscambo13 */ /* this styles the media bar plugin - start */ .button-container { align-items: center; } .favorite-button { background: none; color: var(--textColor); } .detail-button:hover, .favorite-button:hover { background: var(--dimTextColor); color: black; } .play-button::before, .detail-button::before, .favorite-button::before, .favorite-button.favorited::before { font-weight: 400; } .play-button { font-family: 'Inter'; font-size: 1em; font-weight: 500; } .backdrop, .backdrop-container, .backdrop-overlay { mask-image: linear-gradient(180deg, rgba(0, 0, 0, .85), 70%, rgba(0, 0, 0, 0)); -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .85), 70%, rgba(0, 0, 0, 0)); background-color: transparent; } .backdrop { transform-origin: center left; } /* this is my own take */ .rating-value { flex-wrap: wrap; justify-content: center; } .age-rating { font-size: 0.8em; } #slides-container { width: calc(100vw - (2 * var(--sidePadding))); height: 60%; top: 8em; border: var(--defaultBorder); border-radius: var(--largerRadius); transition: all .125s, border 0s; user-select: none; } .layout-tv #slides-container { top: 0em; } .layout-mobile #slides-container { top: 10em; } .logo-container { top: 10vh; } .backdrop, .backdrop-container, .backdrop-overlay { mask-image: none; -webkit-mask-image: none; } .backdrop-overlay { background: linear-gradient(0deg, rgba(0, 0, 0, .85), 40%, transparent); } @media only screen and (max-width: 767px) and (orientation: portrait) { .button-container { top: calc(50% + 20vh); transform: translateX(-50%) scale(0.8); } .info-container { /* top: calc(50% + 6vh); */ } .tomato-rating { display: none; } .dots-container { top: calc(50% + 19vh); } .backdrop { transform-origin: center; } } /* this styles the media bar plugin - end */