Skip to content

ThemeSong Helpers by OsirisX3R0

Write a review Install Get Stylus

Details

AuthorOsirisX3R0

LicenseNo License

Categorymusic.youtube.com

Created

Updated

Code size2.8 kB

Code checksum21fd1fbe

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Adds a couple of things to the styling from the Youtube Music extension ThemeSong, specifically to the full screen view

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name         Youtube Music (osirisx3r0)
@version      20230807.14.35
@namespace    ?
==/UserStyle== */

@-moz-document domain("music.youtube.com") {
/* Because Open Sans just looks so good */
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@500&display=swap");
* {
    font-family: "Open Sans" !important;
}

/* List styling */
#contents.ytmusic-shelf-renderer>*.ytmusic-shelf-renderer:not(:last-child),
#contents.ytmusic-playlist-shelf-renderer>*.ytmusic-playlist-shelf-renderer:not(:last-child) {
    border-bottom-width: 0;
    border-radius: 8px;
}

ytmusic-responsive-list-item-renderer:nth-child(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

/* Fixed width for full screen song info, so it doesn't resize and stays consistent */
#songDivContainer {
    width: 725px;
}

/* Fullscreen controls positioning */
ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) > [slot=player-bar] {
    background: transparent !important;
    opacity: 1;
    width: 725px;
    position: absolute;
    bottom: calc((100% - 700px) / 2);
    left: auto;
    right: calc((100% - 1450px) / 2);
}

/* Removing some controls */
ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) > [slot=player-bar] .thumbnail-image-wrapper.ytmusic-player-bar,
ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) > [slot=player-bar] .content-info-wrapper.ytmusic-player-bar,
ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) > [slot=player-bar] .menu.ytmusic-player-bar,
ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) > [slot=player-bar] #ts-panel-container {
    display: none;
}

/* Icon sizing */
ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) ytmusic-player-bar[player-fullscreened_] .left-controls.ytmusic-player-bar tp-yt-paper-icon-button.ytmusic-player-bar {
    width: 40px;
    height: 40px;
}

ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) ytmusic-player-bar[player-fullscreened_] .left-controls.ytmusic-player-bar .play-pause-button.ytmusic-player-bar{
    width: 58px;
    height: 58px;
}

ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) ytmusic-player-bar[player-fullscreened_] .volume-slider.ytmusic-player-bar {
    width: 75px;
}

ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) .time-info.ytmusic-player-bar {
    font-size: 11px;
}

ytmusic-app-layout[player-fullscreened]:not(:has(> ytmusic-player-page[video-mode_])) ytmusic-player-bar[player-fullscreened_] .right-controls.ytmusic-player-bar tp-yt-paper-icon-button.ytmusic-player-bar  {
    width: 40px;
    height: 40px;
}
}

Reviews

No reviews yet.