mirror of
https://github.com/morpheusthewhite/spicetify-themes.git
synced 2024-11-25 04:12:29 +01:00
193 lines
3.6 KiB
CSS
193 lines
3.6 KiB
CSS
* {
|
|
font-family: Montserrat;
|
|
}
|
|
|
|
/* Page titles */
|
|
h1 {
|
|
font-weight: 700 !important;
|
|
}
|
|
|
|
/* Song name in player */
|
|
.main-nowPlayingWidget-nowPlaying .main-trackInfo-name {
|
|
overflow: unset;
|
|
font-size: 20px !important;
|
|
}
|
|
|
|
/* Artist name in player */
|
|
.main-nowPlayingWidget-nowPlaying .main-trackInfo-artists {
|
|
overflow: unset;
|
|
padding-top: 5px;
|
|
font-size: 15px;
|
|
}
|
|
|
|
.main-type-finale {
|
|
line-height: 17px;
|
|
}
|
|
|
|
/* Icons */
|
|
.Svg-ulyrgf-0,
|
|
.main-trackList-rowPlayPauseIcon {
|
|
transform: scale(1.3);
|
|
}
|
|
|
|
.x-downloadButton-button svg {
|
|
height: 32px;
|
|
width: 32px;
|
|
}
|
|
|
|
/* Progress and remaining time */
|
|
.main-playbackBarRemainingTime-container,
|
|
.playback-bar__progress-time-elapsed,
|
|
.playback-bar__progress-time {
|
|
font-size: 15px;
|
|
margin-left: 5px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
/* Player play button */
|
|
.main-playPauseButton-button {
|
|
background-color: unset;
|
|
color: var(--spice-subtext);
|
|
}
|
|
|
|
.main-playPauseButton-button svg {
|
|
height: 28px;
|
|
width: 28px;
|
|
}
|
|
|
|
/* Progress bar */
|
|
.progress-bar {
|
|
--fg-color: var(--spice-button);
|
|
}
|
|
|
|
.progress-bar__bg,
|
|
.progress-bar__fg,
|
|
.progress-bar__fg_wrapper {
|
|
height: 5px;
|
|
}
|
|
|
|
.progress-bar-wrapper {
|
|
margin-left: 5px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
/* Extra controls */
|
|
.control-button::before {
|
|
font-size: 20px;
|
|
}
|
|
|
|
.ExtraControls svg {
|
|
height: 20px;
|
|
width: 20px;
|
|
}
|
|
|
|
/* Removing gradients */
|
|
.main-entityHeader-backgroundColor,
|
|
.main-actionBarBackground-background {
|
|
background-color: unset !important;
|
|
background-image: none;
|
|
}
|
|
|
|
/* Cover shadow */
|
|
.main-entityHeader-shadow {
|
|
-webkit-box-shadow: 0 4px 20px rgba(var(--spice-rgb-shadow), 0.5);
|
|
box-shadow: 0 4px 20px rgba(var(--spice-rgb-shadow), 0.5);
|
|
}
|
|
|
|
/* Top bar */
|
|
.main-topBar-background {
|
|
background-color: #3a3d42 !important;
|
|
}
|
|
|
|
/* Playing icon */
|
|
.main-trackList-playingIcon {
|
|
filter: saturate(0%);
|
|
}
|
|
|
|
/* Playlist like button */
|
|
.main-actionBar-ActionBarRow .main-addButton-button .Svg-ulyrgf-0 {
|
|
height: unset;
|
|
width: unset;
|
|
}
|
|
|
|
/* Order button */
|
|
.x-sortBox-sortDropdown {
|
|
margin-top: 3px;
|
|
}
|
|
|
|
/* Sidebar playlists menu */
|
|
.main-rootlist-rootlistDividerGradient {
|
|
background: unset;
|
|
}
|
|
|
|
.main-rootlist-rootlistDivider {
|
|
background-color: var(--spice-button);
|
|
}
|
|
|
|
/* Search box */
|
|
.x-searchInput-searchInputInput {
|
|
font-size: 18px;
|
|
}
|
|
|
|
/* Aritsts names */
|
|
.main-type-mesto {
|
|
font-size: 16px;
|
|
line-height: 20px;
|
|
}
|
|
|
|
/* Songs names */
|
|
.main-type-ballad {
|
|
font-size: 18px;
|
|
}
|
|
|
|
/* Cards descriptions */
|
|
.main-cardSubHeader-root {
|
|
overflow: hidden !important;
|
|
}
|
|
|
|
/* Ad title */
|
|
.desktoproutes-homepage-takeover-ad-hptoNativeOriginal-header {
|
|
font-weight: 700 !important;
|
|
}
|
|
|
|
/* Friends names */
|
|
.main-buddyFeed-username a {
|
|
color: var(--spice-text) !important;
|
|
font-size: 17px;
|
|
font-weight: 500;
|
|
}
|
|
|
|
/* Friends songs and artists */
|
|
.main-buddyFeed-artistAndTrackName a,
|
|
.main-buddyFeed-playbackContextLink span {
|
|
font-size: 13px;
|
|
}
|
|
|
|
/* Cover height */
|
|
.main-coverSlotExpanded-container {
|
|
height: var(--nav-bar-width) + 8px;
|
|
}
|
|
|
|
/* Scrollbars */
|
|
.os-scrollbar-handle {
|
|
background: var(--spice-button) !important;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
/* Making index column wider so that lighter background that
|
|
highlights selected song contains multi-digit song numbers */
|
|
/* It looks good up to 4 digits, I figured that no one has playlists with more music than that ;) */
|
|
.main-trackList-trackList.main-trackList-indexable .main-trackList-trackListRowGrid {
|
|
grid-template-columns: [index] 48px [first] 6fr [var1] 4fr [var2] 3fr [last] minmax(120px, 1fr) !important;
|
|
}
|
|
|
|
/* Text boxes in settings */
|
|
.main-dropDown-dropDown {
|
|
background-color: var(--spice-button-disabled);
|
|
}
|
|
|
|
/* Facebook button */
|
|
.x-settings-facebookButton {
|
|
background-color: unset !important;
|
|
}
|