Mirrors/spicetify-themes
1
0
Fork 0
mirror of https://github.com/morpheusthewhite/spicetify-themes.git synced 2024-11-22 02:42:54 +01:00
Code Issues Projects Releases Activity

fix(Blossom): add ylx compatibility (#957)

Browse Source
This commit is contained in:
harbassan 2023-06-26 16:35:12 +12:00 committed by GitHub
parent 10468f5d1f
commit 9006bd9108
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 93 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
Blossom/color.ini
View File

@ -8,4 +8,5 @@ button = 4d5c78
button-active = 6d80a3
button-disabled = 282e33
sidebar = 1e2226
main = 1e2226
main = 1e2226
card = 282e33

124
Blossom/user.css
View File

@ -1,7 +1,7 @@
/* Blossom Theme */
#main {
overflow: hidden;
overflow: hidden;
background-color: var(--spice-background);
}
@ -83,7 +83,7 @@
}
.main-entityHeader-shadow {
box-shadow: 0 0px 50px rgba(0, 0, 0, 0.200);
box-shadow: 0 0px 50px rgba(0, 0, 0, 0.2);
}
/* TRACKLIST */
@ -104,7 +104,6 @@
/* Playback bar and controls */
.main-nowPlayingBar-nowPlayingBar {
background-color: unset !important;
background: unset !important;
background-image: linear-gradient(0deg, var(--spice-player), 80%, transparent);
transition: all 0.5s;
}
@ -133,33 +132,39 @@
.main-navBar-navBarLinkActive,
.main-navBar-navBarLinkActive:focus,
.logo {
background-color: var(--spice-player) !important;
background-color: var(--spice-player) !important;
}
/* move the progress bar to the top */
.main-nowPlayingBar-nowPlayingBar {
position: relative;
padding-inline-end: 16px !important;
}
.playback-bar {
width: calc(100% + 82px);
left: -41px;
bottom: 74px;
top: -10px;
position: absolute;
cursor: pointer;
transition: all 0.5s;
}
.playback-bar:hover {
width: 100%;
left: 0;
}
.Root__top-container {
row-gap: 0;
padding-left: 0;
padding-right: 0;
padding-bottom: 0;
}
.progress-bar {
--fg-color: var(--spice-button-active);
--fg-color: var(--spice-button-active);
}
.os-theme-spotify.os-host-transition
> .os-scrollbar-vertical
> .os-scrollbar-track
> .os-scrollbar-handle {
border-radius: 4px;
background-color: var(--spice-text);
opacity: 30%;
.os-theme-spotify.os-host-transition > .os-scrollbar-vertical > .os-scrollbar-track > .os-scrollbar-handle {
border-radius: 4px;
background-color: var(--spice-text);
opacity: 30%;
}
.player-controls__buttons {
@ -174,7 +179,7 @@
.player-controls__buttons {
align-items: center;
}
}
/* LEFT BAR STUFF */
@ -184,6 +189,60 @@
visibility: hidden;
}
/* remove playlist item hover effect */
li > div > div::after {
background-color: transparent !important;
}
li > div::after {
background-color: transparent !important;
}
/* give background to active playlist */
.BoxComponent-group-tinted-listRow-isInteractive-hasLeadingOrMedia-paddingBlockStart_8px-paddingBlockEnd_8px-minBlockSize_56px-padding_8px,
.BoxComponent-group-tinted-listRow-isInteractive-hasFocus-hasLeadingOrMedia-paddingBlockStart_8px-paddingBlockEnd_8px-minBlockSize_56px-padding_8px {
background-color: var(--spice-player);
transition: all 1s;
}
/* expanded sidebar buttons */
.search-searchCategory-carouselButton {
background-color: transparent;
}
.search-searchCategory-carouselButton:hover {
background-color: var(--spice-player);
}
.main-yourLibraryX-iconOnly:hover {
background-color: var(--spice-player);
color: var(--spice-text);
}
.main-yourLibraryX-filterArea > div > div:first-child button {
background-color: var(--spice-player) !important;
}
.main-yourLibraryX-filterArea > div > div:first-child button > span {
background-color: var(--spice-player) !important;
color: var(--spice-text) !important;
}
.main-yourLibraryX-libraryFilter .x-sortBox-sortDropdown,
.main-yourLibraryX-libraryFilter .x-filterBox-expandButton,
.main-yourLibraryX-libraryFilter .x-filterBox-searchIconContainer,
.main-yourLibraryX-libraryFilter .x-filterBox-filterInput,
.main-yourLibraryX-libraryFilter .x-filterBox-clearButton {
color: var(--spice-text);
}
/* give active nav tab a background */
.main-navBar-mainNav li:has(> .active) {
background-color: var(--spice-player);
border-radius: 0 4px 4px 0;
position: relative;
transform: translate(-12px, 0);
transition: all 1s;
}
/* remove built in scrolllist shadow */
.main-yourLibraryX-isScrolled {
box-shadow: none !important;
}
.main-rootlist-rootlist {
background-color: var(--spice-player);
top: 10px;
@ -224,7 +283,7 @@
background-color: var(--spice-player) !important;
transition: all 0.5s;
}
.main-navBar-navBarLinkActive{
.main-navBar-navBarLinkActive {
background: var(--spice-player) !important;
margin-left: -22px;
margin-right: -10px;
@ -238,33 +297,33 @@
.main-card-card {
opacity: 100%;
background-color: unset !important;
background: linear-gradient(180deg, var(--spice-player), 65.0%, transparent);
background: linear-gradient(180deg, var(--spice-player), 65%, transparent);
transition: all 1s;
}
.main-card-card:hover {
background-color: unset !important;
background: var(--spice-player)!important;
background: var(--spice-player) !important;
}
.collection-collectionEntityHeroCard-likedSongs {
background-color: unset !important;
background: linear-gradient(180deg, var(--spice-player), 65.0%, transparent);
background: linear-gradient(180deg, var(--spice-player), 65%, transparent);
transition: all 1s;
}
.collection-collectionEntityHeroCard-likedSongs:hover {
background-color: unset !important;
background: var(--spice-player)!important;
background: var(--spice-player) !important;
}
/* Shortcuts */
.view-homeShortcutsGrid-shortcut {
background-color: unset !important;
background: linear-gradient(180deg, var(--spice-player), 65.0%, transparent);
background: linear-gradient(180deg, var(--spice-player), 65%, transparent);
transition: all 1s;
}
.view-homeShortcutsGrid-shortcut:hover {
background-color: unset !important;
background: var(--spice-player)!important;
background: var(--spice-player) !important;
}
/* Cursor things */
@ -273,7 +332,7 @@
.main-skipForwardButton-button,
.main-skipBackButton-button,
.main-shuffleButton-button {
cursor: pointer !important;
cursor: pointer !important;
}
/* Search */
@ -290,8 +349,7 @@ input {
/* ANIMATIONS */
.view-homeShortcutsGrid-shortcut
.main-heroCard-card,
.view-homeShortcutsGrid-shortcut .main-heroCard-card,
.main-buttonIcon-buttonIcon,
.main-trackList-column,
.main-rootlist-rootlistItem,
@ -316,31 +374,31 @@ input {
@keyframes up-fade-anim {
from {
opacity:0%;
opacity: 0%;
transform: translateY(10px);
}
to {
opacity:100;
opacity: 100;
transform: translateY(0px);
}
}
@keyframes left-fade-anim {
from {
opacity:0%;
opacity: 0%;
transform: translateX(10px);
}
to {
opacity:100;
opacity: 100;
transform: translateX(0px);
}
}
@keyframes right-fade-anim {
from {
opacity:0%;
opacity: 0%;
transform: translateX(-10px);
}
to {
opacity:100;
opacity: 100;
transform: translateX(0px);
}
}
@ -348,4 +406,4 @@ input {
.queue-tabBar-active {
background-color: var(--spice-player) !important;
transition: all 0.5s;
}
}