diff --git a/src/user.css b/src/user.css
index 262ec448..9324946e 100644
--- a/src/user.css
+++ b/src/user.css
@@ -76,8 +76,7 @@
--card-border-radius: 0.5rem;
--border-radius-rounded: 9999px;
--spice-light-border: rgba(var(--spice-rgb-text), 0.125);
- --default-border: var(--border-thickness) solid
- rgba(var(--spice-rgb-text), 0.125);
+ --default-border: var(--border-thickness) solid rgba(var(--spice-rgb-text), 0.125);
/* Now playing bar */
--margin-bottom-now-playing-bar: calc(var(--panel-gap, 0.2rem) / 2);
@@ -210,9 +209,7 @@ textarea,
letter-spacing: -0.025rem;
}
-.view-homeShortcutsGrid-shortcut
- .view-homeShortcutsGrid-main
- .view-homeShortcutsGrid-name {
+.view-homeShortcutsGrid-shortcut .view-homeShortcutsGrid-main .view-homeShortcutsGrid-name {
letter-spacing: 0.025rem;
padding-left: var(--padding-sm);
}
@@ -295,7 +292,7 @@ option {
/* Button styles */
.ap8U6ZVS8BqMxUdinBis,
/* ADD: card close button */
- .main-avatar-avatar,
+.main-avatar-avatar,
.main-playPauseButton-button,
.main-skipForwardButton-button,
.main-skipBackButton-button,
@@ -421,10 +418,8 @@ button.main-topBar-buddyFeed[aria-label="Lucid Settings"]:hover svg {
}
.main-entityHeader-imageContainerClickable:hover,
-.Button-buttonPrimary-useBrowserDefaultFocusStyle-data-is-icon-only:hover
- .ButtonInner-sc-14ud5tc-0,
-.Button-buttonPrimary-useBrowserDefaultFocusStyle-data-is-icon-only:hover
- .ButtonFocus-sc-2hq6ey-0,
+.Button-buttonPrimary-useBrowserDefaultFocusStyle-data-is-icon-only:hover .ButtonInner-sc-14ud5tc-0,
+.Button-buttonPrimary-useBrowserDefaultFocusStyle-data-is-icon-only:hover .ButtonFocus-sc-2hq6ey-0,
.Button-small-small-buttonTertiary-iconOnly-useBrowserDefaultFocusStyle:hover,
.main-globalNav-historyButtons button:hover,
.main-topBar-historyButtons button,
@@ -514,9 +509,9 @@ input,
/* Border */
.Vn9yz8P5MjIvDT8c0U6w,
/* ADD: Search card selector */
- .CfruGiDGW_FH4l65GMpb,
+.CfruGiDGW_FH4l65GMpb,
/* ADD: Card elements selector */
- .jW4eWdr_LUeOXwPpKhWG,
+.jW4eWdr_LUeOXwPpKhWG,
.Button-small-buttonSecondary-useBrowserDefaultFocusStyle:hover,
.Button-small-buttonSecondary-useBrowserDefaultFocusStyle,
.x-searchInput-searchInputInput,
@@ -544,7 +539,7 @@ input,
}
/* Card Border Radius */
-.main-card-imageContainer > div,
+.main-card-imageContainer>div,
.main-image-image,
.MxmW8QkHqHWtuhO589PV,
.x-entityImage-imageContainer,
@@ -572,8 +567,8 @@ input,
transition: width 0.3s ease;
}
-.main-yourLibraryX-entryPoints #spicetify-show-list > li:first-child,
-.main-yourLibraryX-entryPoints #spicetify-hidden-list > li:first-child {
+.main-yourLibraryX-entryPoints #spicetify-show-list>li:first-child,
+.main-yourLibraryX-entryPoints #spicetify-hidden-list>li:first-child {
margin-top: var(--padding-md, 0.5rem);
}
@@ -587,7 +582,7 @@ input,
#Desktop_PanelContainer_Id,
.IkRGajTjItEFQkRMeH6v,
/* Add classes for right sidebar container */
- .f2UE9n5nZcbgZrGYTU3r {
+.f2UE9n5nZcbgZrGYTU3r {
background: transparent !important;
}
@@ -608,12 +603,12 @@ input,
}
/* Top Bar Styles */
-.main-topBar-container > *,
+.main-topBar-container>*,
.main-topBar-topbarContent {
-webkit-app-region: drag !important;
}
-.global-nav .main-topBar-container > *,
+.global-nav .main-topBar-container>*,
.global-nav .main-topBar-topbarContent,
.main-topBar-topbarContentRight button,
.main-topBar-topbarContentRight *,
@@ -623,8 +618,7 @@ input,
.spotify__container--is-desktop.spotify__os--is-windows .Root__globalNav,
.spotify__container--is-desktop.spotify__os--is-windows .main-topBar-container {
- padding-inline: var(--top-bar-padding-start, 5vw)
- var(--top-bar-padding-end, 8vw);
+ padding-inline: var(--top-bar-padding-start, 5vw) var(--top-bar-padding-end, 8vw);
}
.spotify__container--is-desktop.spotify__os--is-macos .main-topBar-container {
@@ -632,12 +626,7 @@ input,
padding-inline-start: 80px !important;
}
-.spotify__container--is-desktop.spotify__os--is-macos
- .global-nav
- .main-topBar-container
- .spotify__container--is-desktop.spotify__os--is-windows
- .global-nav
- .main-topBar-container,
+.spotify__container--is-desktop.spotify__os--is-macos .global-nav .main-topBar-container .spotify__container--is-desktop.spotify__os--is-windows .global-nav .main-topBar-container,
.global-nav .main-topBar-container {
padding-inline: 0 !important;
}
@@ -679,9 +668,7 @@ input,
top: 40px !important;
}
-.global-nav
- .artist-artistDiscography-tracklist
- .main-trackList-trackListHeader {
+.global-nav .artist-artistDiscography-tracklist .main-trackList-trackListHeader {
top: 96px !important;
}
@@ -721,16 +708,14 @@ input,
.npv-background-color,
._2ajKWDiy6YvJu5wo8I1g,
/* ADD: Track list header active i.e, scrolled */
- .main-trackList-trackListHeaderStuck.main-trackList-trackListHeader,
+.main-trackList-trackListHeaderStuck.main-trackList-trackListHeader,
.artist-artistDiscography-topBar,
.search-searchCategory-SearchCategory,
.global-nav .main-topBar-background {
background: none !important;
background-color: transparent !important;
- -webkit-backdrop-filter: blur(var(--top-bar-bg-blur))
- saturate(var(--top-bar-saturation)) !important;
- backdrop-filter: blur(var(--top-bar-bg-blur))
- saturate(var(--top-bar-saturation)) !important;
+ -webkit-backdrop-filter: blur(var(--top-bar-bg-blur)) saturate(var(--top-bar-saturation)) !important;
+ backdrop-filter: blur(var(--top-bar-bg-blur)) saturate(var(--top-bar-saturation)) !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
@@ -792,8 +777,7 @@ input,
}
.marketplace-header {
- margin: 0 calc((var(--content-spacing) * -1) - 8px) 0
- calc((var(--content-spacing) * -1) - 8px);
+ margin: 0 calc((var(--content-spacing) * -1) - 8px) 0 calc((var(--content-spacing) * -1) - 8px);
padding: var(--padding-md) calc(var(--content-spacing) * 2);
}
@@ -833,10 +817,8 @@ input,
/* Filter chips */
.main-home-filterChipsSection {
background-color: var(--filter-chips-bg-color) !important;
- -webkit-backdrop-filter: blur(var(--filter-chips-bg-blur))
- saturate(var(--filter-chips-bg-saturation));
- backdrop-filter: blur(var(--filter-chips-bg-blur))
- saturate(var(--filter-chips-bg-saturation));
+ -webkit-backdrop-filter: blur(var(--filter-chips-bg-blur)) saturate(var(--filter-chips-bg-saturation));
+ backdrop-filter: blur(var(--filter-chips-bg-blur)) saturate(var(--filter-chips-bg-saturation));
}
.main-home-filterChipsSection:after {
@@ -860,18 +842,12 @@ input,
.main-nowPlayingBar-container {
padding: var(--padding-y, 0.25rem) var(--padding-x, 0.5rem);
- background-color: var(
- --background-color,
- rgba(var(--spice-rgb-player, var(--spice-rgb-card)), 0.5)
- );
+ background-color: var(--background-color,
+ rgba(var(--spice-rgb-player, var(--spice-rgb-card)), 0.5));
border: var(--default-border);
border-radius: var(--border-radius, var(--card-border-radius, 0.25rem));
- -webkit-backdrop-filter: opacity(var(--backdrop-opacity, 1))
- blur(var(--backdrop-blur, 1rem)) saturate(var(--saturation, 1.1))
- brightness(var(--brightness, 1)) contrast(var(--contrast, 1.2));
- backdrop-filter: opacity(var(--backdrop-opacity, 1))
- blur(var(--backdrop-blur, 1rem)) saturate(var(--saturation, 1.1))
- brightness(var(--brightness, 1)) contrast(var(--contrast, 1.2));
+ -webkit-backdrop-filter: opacity(var(--backdrop-opacity, 1)) blur(var(--backdrop-blur, 1rem)) saturate(var(--saturation, 1.1)) brightness(var(--brightness, 1)) contrast(var(--contrast, 1.2));
+ backdrop-filter: opacity(var(--backdrop-opacity, 1)) blur(var(--backdrop-blur, 1rem)) saturate(var(--saturation, 1.1)) brightness(var(--brightness, 1)) contrast(var(--contrast, 1.2));
}
.playbar-compact .main-nowPlayingBar-center {
@@ -889,8 +865,8 @@ input,
}
/* Make play and pause button of same size */
-.playbar-compact .player-controls__buttons > button[aria-label*="Pause"],
-.playbar-compact .player-controls__buttons > button[aria-label*="Play"] {
+.playbar-compact .player-controls__buttons>button[aria-label*="Pause"],
+.playbar-compact .player-controls__buttons>button[aria-label*="Play"] {
--encore-control-size-smaller: 24px !important;
}
@@ -906,8 +882,7 @@ input,
margin-left: auto;
}
-.playbar-compact
- .main-coverSlotCollapsed-container.main-coverSlotCollapsed-navAltContainer {
+.playbar-compact .main-coverSlotCollapsed-container.main-coverSlotCollapsed-navAltContainer {
margin-inline-end: 0;
}
@@ -960,8 +935,10 @@ div[data-testid="hpto-parent-container"] {
.lyrics-lyrics-contentWrapper,
.main-view-container__scroll-node,
.nw2W4ZMdICuBo08Tzxg9,
-.main-devicePicker-section /* ADD: Right sidebar scroll node */
-{
+.main-devicePicker-section
+
+/* ADD: Right sidebar scroll node */
+ {
padding-bottom: calc(var(--now-playing-bar-height) + var(--gap-lg));
}
@@ -993,26 +970,22 @@ div[data-testid="hpto-parent-container"] {
overflow: hidden;
}
-.JnpOnFaQfrRIA2fYe88A /* ADD: classes for artist popup */
-{
+.JnpOnFaQfrRIA2fYe88A
+
+/* ADD: classes for artist popup */
+ {
max-height: 70vh !important;
}
.guUl5dHbF5HJRvwjBxzR,
-.guUl5dHbF5HJRvwjBxzR > .main-image-image,
+.guUl5dHbF5HJRvwjBxzR>.main-image-image,
.FOgY6uo_Bj_VTV5hwaix {
- width: 100%;
- height: 100%;
- aspect-ratio: 16 / 7.15;
- object-fit: cover;
border-radius: 0.5rem;
}
.GenericModal__overlay {
- background-color: rgba(
- var(--spice-rgb-shadow),
- var(--generic-modal-bg-opacity)
- );
+ background-color: rgba(var(--spice-rgb-shadow),
+ var(--generic-modal-bg-opacity));
}
dialog {
@@ -1111,8 +1084,7 @@ dialog {
border-radius: var(--card-border-radius);
}
-.global-nav
- .artist-artistDiscography-headerContainer.artist-artistDiscography-firstAlbum {
+.global-nav .artist-artistDiscography-headerContainer.artist-artistDiscography-firstAlbum {
margin-top: 64px;
padding: 64px;
}
@@ -1146,11 +1118,11 @@ dialog {
.jW4eWdr_LUeOXwPpKhWG,
.EmeHQXR87mUskYK6xEde,
/* ADD: Artist main card Selector */
- .CfruGiDGW_FH4l65GMpb,
+.CfruGiDGW_FH4l65GMpb,
/* ADD: Card elements selector */
- .mXNT9H2GU7lDW4cGx0q1,
+.mXNT9H2GU7lDW4cGx0q1,
/* ADD: search top card */
- .cover-art,
+.cover-art,
.main-card-card,
.tippy-arrow,
.tippy-box,
@@ -1160,8 +1132,7 @@ dialog {
.artist-artistDiscography-headerContainer,
.x-settings-equalizerSection,
.BoxComponent-group-listRow-naked-isInteractive-minBlockSize_56px,
-.Box-group-naked-listRow-isInteractive-hasLeadingOrMedia-minBlockSize_56px
- .main-nowPlayingView-section,
+.Box-group-naked-listRow-isInteractive-hasLeadingOrMedia-minBlockSize_56px .main-nowPlayingView-section,
.main-nowPlayingView-section {
background-color: var(--card-color) !important;
}
@@ -1170,10 +1141,8 @@ dialog {
background-color: var(--spice-main);
}
-.main-devicePicker-troubleshootingList
- > div[aria-describedby="device-picker-troubleshooting-list"]
- a,
-.main-devicePicker-troubleshootingList > div:last-child a {
+.main-devicePicker-troubleshootingList>div[aria-describedby="device-picker-troubleshooting-list"] a,
+.main-devicePicker-troubleshootingList>div:last-child a {
margin-top: var(--margin-md, 0.5rem);
}
@@ -1226,8 +1195,10 @@ dialog {
/* Search Section */
.IGCDq9qa08JVVY3mcy7Y,
-.CqCtb3wr4SK8AiZwxeH0 /* ADD: Search card selector */
-{
+.CqCtb3wr4SK8AiZwxeH0
+
+/* ADD: Search card selector */
+ {
padding: 0 !important;
}
@@ -1236,34 +1207,26 @@ dialog {
}
.search-searchCategory-catergoryGrid:before {
- background: -webkit-gradient(
- linear,
- left top,
- right top,
- from(rgba(var(--spice-rgb-sidebar), 0.5)),
- to(transparent)
- );
- background: linear-gradient(
- 90deg,
- rgba(var(--spice-rgb-sidebar), 0.5) 0,
- transparent 100%
- );
+ background: -webkit-gradient(linear,
+ left top,
+ right top,
+ from(rgba(var(--spice-rgb-sidebar), 0.5)),
+ to(transparent));
+ background: linear-gradient(90deg,
+ rgba(var(--spice-rgb-sidebar), 0.5) 0,
+ transparent 100%);
left: 0;
}
.search-searchCategory-catergoryGrid:after {
- background: -webkit-gradient(
- linear,
- right top,
- left top,
- from(rgba(var(--spice-rgb-sidebar), 0.5)),
- to(transparent)
- );
- background: linear-gradient(
- -90deg,
- rgba(var(--spice-rgb-sidebar), 0.5) 0,
- transparent 100%
- );
+ background: -webkit-gradient(linear,
+ right top,
+ left top,
+ from(rgba(var(--spice-rgb-sidebar), 0.5)),
+ to(transparent));
+ background: linear-gradient(-90deg,
+ rgba(var(--spice-rgb-sidebar), 0.5) 0,
+ transparent 100%);
right: 0;
}
@@ -1281,10 +1244,8 @@ dialog {
--bg-color: rgba(var(--spice-rgb-progress-bar, var(--spice-rgb-text)), 0.1);
--color: rgba(var(--spice-rgb-progress-bar, var(--spice-rgb-text)), 0.25);
--fg-color: rgba(var(--spice-rgb-progress-bar, var(--spice-rgb-accent)), 0.75);
- --is-active-fg-color: rgba(
- var(--spice-rgb-progress-bar, var(--spice-rgb-accent)),
- 1
- );
+ --is-active-fg-color: rgba(var(--spice-rgb-progress-bar, var(--spice-rgb-accent)),
+ 1);
}
.progress-bar--isDragging {
@@ -1366,9 +1327,7 @@ dialog {
background-color: transparent;
}
-.main-userWidget-dropDownMenu
- .main-contextMenu-menuItem
- button[role="menuitem"]:has(svg):before {
+.main-userWidget-dropDownMenu .main-contextMenu-menuItem button[role="menuitem"]:has(svg):before {
/* content: "";
width: 100%;
position: absolute;
@@ -1381,11 +1340,11 @@ dialog {
--generic-tooltip-background-color: transparent !important;
}
-.Root__top-container:has(
- .sgQuNaOh5Eu6vnzh3eoh
+.Root__top-container:has(.sgQuNaOh5Eu6vnzh3eoh
+
+ /* ADD: Root cinema active */
+) {
- /* ADD: Root cinema active */
- ) {
.lucid-static-background-container,
.lucid-animated-background-container,
.lucid-solid-background-container {
@@ -1394,6 +1353,7 @@ dialog {
}
.Root:has(.npv-main-container) {
+
.lucid-static-background-container,
.lucid-animated-background-container,
.lucid-solid-background-container {
@@ -1458,10 +1418,10 @@ svg:has(path[d="M12 3a9 9 0 1 0 0 18 9 9 0 0 0 0-18zM1 12C1 5.925 5.925 1 12 1s1
}
}
-.player-controls__buttons > button[aria-label*="Play"] span,
+.player-controls__buttons>button[aria-label*="Play"] span,
.main-playButton-button[aria-label*="Play"],
-.main-playButton-PlayButton > button[aria-label*="Play"],
-.player-controls__buttons > button[aria-label*="Pause"] span,
+.main-playButton-PlayButton>button[aria-label*="Play"],
+.player-controls__buttons>button[aria-label*="Pause"] span,
.main-playButton-button[aria-label*="Pause"],
.main-repeatButton-button[aria-label="Enable repeat"],
.main-repeatButton-button[aria-label="Disable repeat"],
@@ -1469,10 +1429,10 @@ svg:has(path[d="M12 3a9 9 0 1 0 0 18 9 9 0 0 0 0-18zM1 12C1 5.925 5.925 1 12 1s1
.main-playPauseButton-button,
.main-skipBackButton-button,
.main-skipForwardButton-button,
-.main-actionButtons > div > button[aria-label="Friend Activity"] svg,
-.main-actionButtons > button[aria-label="Friend Activity"] svg,
-.main-yourLibraryX-navLink[href="/lyrics-plus"] > svg,
-.main-yourLibraryX-navLink[href="/lyrics-plus"].active > svg,
+.main-actionButtons>div>button[aria-label="Friend Activity"] svg,
+.main-actionButtons>button[aria-label="Friend Activity"] svg,
+.main-yourLibraryX-navLink[href="/lyrics-plus"]>svg,
+.main-yourLibraryX-navLink[href="/lyrics-plus"].active>svg,
button[aria-label="Browse"] svg {
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
@@ -1493,66 +1453,50 @@ button[aria-label="Browse"] svg {
}
}
-.player-controls__buttons > button[aria-label*="Play"] span,
+.player-controls__buttons>button[aria-label*="Play"] span,
.main-playButton-button[aria-label*="Play"],
-.main-playButton-PlayButton > button[aria-label*="Play"],
+.main-playButton-PlayButton>button[aria-label*="Play"],
.main-playPauseButton-button[aria-label="Play"],
.main-playPauseButton-button[aria-label="Play"],
.main-trackList-rowPlayPauseButton[aria-label*="Play"],
-.main-playButton-PlayButton > button[aria-label*="Play"] {
+.main-playButton-PlayButton>button[aria-label*="Play"] {
background-color: var(--spice-text) !important;
- -webkit-mask-image: var(
- --play-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/play.svg")
- ) !important;
- mask-image: var(
- --play-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/play.svg")
- ) !important;
+ -webkit-mask-image: var(--play-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/play.svg")) !important;
+ mask-image: var(--play-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/play.svg")) !important;
}
.main-globalNav-link-icon[href="/lyrics-plus"] svg,
-.main-yourLibraryX-navLink[href="/lyrics-plus"] > svg {
- -webkit-mask-image: var(
- --slider-text-outline-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/slide-text-outline.svg")
- );
- mask-image: var(
- --slider-text-outline-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/slide-text-outline.svg")
- );
+.main-yourLibraryX-navLink[href="/lyrics-plus"]>svg {
+ -webkit-mask-image: var(--slider-text-outline-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/slide-text-outline.svg"));
+ mask-image: var(--slider-text-outline-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/slide-text-outline.svg"));
background-color: var(--spice-subtext) !important;
}
.main-globalNav-link-icon.main-globalNav-navLinkActive[href="/lyrics-plus"] svg,
-.main-yourLibraryX-navLink[href="/lyrics-plus"].active > svg {
- -webkit-mask-image: var(
- --slide-text-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/slide-text.svg")
- );
- mask-image: var(
- --slide-text-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/slide-text.svg")
- );
+.main-yourLibraryX-navLink[href="/lyrics-plus"].active>svg {
+ -webkit-mask-image: var(--slide-text-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/slide-text.svg"));
+ mask-image: var(--slide-text-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/slide-text.svg"));
background-color: var(--spice-accent) !important;
}
-.player-controls__buttons > button[aria-label*="Pause"] span,
+.player-controls__buttons>button[aria-label*="Pause"] span,
.main-playButton-button[aria-label*="Pause"],
-.main-playButton-PlayButton > button[aria-label*="Pause"],
+.main-playButton-PlayButton>button[aria-label*="Pause"],
.main-playPauseButton-button[aria-label*="Pause"],
.main-playPauseButton-button[aria-label="Pause"],
.main-trackList-rowPlayPauseButton[aria-label*="Pause"],
-.main-playButton-PlayButton > button[aria-label*="Pause"] {
+.main-playButton-PlayButton>button[aria-label*="Pause"] {
background-color: var(--spice-text) !important;
- -webkit-mask-image: var(
- --pause-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/pause.svg")
- ) !important;
- mask-image: var(
- --pause-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/pause.svg")
- ) !important;
+ -webkit-mask-image: var(--pause-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/pause.svg")) !important;
+ mask-image: var(--pause-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/pause.svg")) !important;
}
.player-controls__right button:first-child,
@@ -1570,42 +1514,30 @@ button[aria-label="Browse"] svg {
.main-repeatButton-button[aria-checked="false"],
.player-controls__right button[aria-label*="Enable repeat"] span {
- -webkit-mask-image: var(
- --repeat-off-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat-off.svg")
- );
- mask-image: var(
- --repeat-off-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat-off.svg")
- );
+ -webkit-mask-image: var(--repeat-off-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat-off.svg"));
+ mask-image: var(--repeat-off-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat-off.svg"));
background-color: var(--spice-subtext);
mask-size: contain;
}
.main-repeatButton-button[aria-checked="mixed"],
.player-controls__right button[aria-label*="Disable repeat"] span {
- -webkit-mask-image: var(
- --repeat-mixed-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat-mixed.svg")
- );
- mask-image: var(
- --repeat-mixed-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat-mixed.svg")
- );
+ -webkit-mask-image: var(--repeat-mixed-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat-mixed.svg"));
+ mask-image: var(--repeat-mixed-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat-mixed.svg"));
background-color: var(--spice-accent);
mask-size: contain;
}
.main-repeatButton-button[aria-checked="true"],
.player-controls__right button[aria-label*="Enable repeat one"] span {
- -webkit-mask-image: var(
- --repeat-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat.svg")
- );
- mask-image: var(
- --repeat-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat.svg")
- );
+ -webkit-mask-image: var(--repeat-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat.svg"));
+ mask-image: var(--repeat-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/repeat.svg"));
background-color: var(--spice-accent);
mask-size: contain;
}
@@ -1637,14 +1569,10 @@ button[aria-label="Browse"] svg {
.main-skipBackButton-button {
background-color: var(--spice-text) !important;
- -webkit-mask-image: var(
- --prev-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/prev.svg")
- );
- mask-image: var(
- --prev-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/prev.svg")
- );
+ -webkit-mask-image: var(--prev-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/prev.svg"));
+ mask-image: var(--prev-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/prev.svg"));
}
.main-yourLibraryX-navLink[aria-label="Marketplace"] svg,
@@ -1660,45 +1588,32 @@ button[href="/marketplace"] svg {
}
}
-.main-yourLibraryX-navLink[href="/marketplace"] > svg,
+.main-yourLibraryX-navLink[href="/marketplace"]>svg,
.main-globalNav-link-icon[aria-label="Marketplace"] svg {
- -webkit-mask-image: var(
- --cart-outline-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/cart-outline.svg")
- );
- mask-image: var(
- --cart-outline-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/cart-outline.svg")
- );
+ -webkit-mask-image: var(--cart-outline-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/cart-outline.svg"));
+ mask-image: var(--cart-outline-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/cart-outline.svg"));
background-color: var(--spice-subtext) !important;
transform: scale(1.25);
}
-.main-yourLibraryX-navLink[href="/marketplace"].active > svg,
-.main-globalNav-link-icon.main-globalNav-navLinkActive[aria-label="Marketplace"]
- svg {
- -webkit-mask-image: var(
- --cart-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/cart.svg")
- );
- mask-image: var(
- --cart-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/cart.svg")
- );
+.main-yourLibraryX-navLink[href="/marketplace"].active>svg,
+.main-globalNav-link-icon.main-globalNav-navLinkActive[aria-label="Marketplace"] svg {
+ -webkit-mask-image: var(--cart-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/cart.svg"));
+ mask-image: var(--cart-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/cart.svg"));
background-color: var(--spice-text) !important;
transform: scale(1.25);
}
.main-skipForwardButton-button {
background-color: var(--spice-text) !important;
- -webkit-mask-image: var(
- --next-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/next.svg")
- );
- mask-image: var(
- --next-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/next.svg")
- );
+ -webkit-mask-image: var(--next-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/next.svg"));
+ mask-image: var(--next-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/next.svg"));
}
svg:has(path[d="M8 1.5a4 4 0 0 0-4 4v3.27a.75.75 0 0 1-.1.373L2.255 12h11.49L12.1 9.142a.75.75 0 0 1-.1-.374V5.5a4 4 0 0 0-4-4zm-5.5 4a5.5 5.5 0 0 1 11 0v3.067l2.193 3.809a.75.75 0 0 1-.65 1.124H10.5a2.5 2.5 0 0 1-5 0H.957a.75.75 0 0 1-.65-1.124L2.5 8.569V5.5zm4.5 8a1 1 0 1 0 2 0H7z"]),
@@ -1707,16 +1622,12 @@ svg:has(path[d="M8 0a5.5 5.5 0 0 0-5.5 5.5v3.069L.307 12.376A.75.75 0 0 0 .25 13
mask-image: var(--alert-icon, url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/alert.svg"));
}
-.main-actionButtons > div > button[aria-label="Friend Activity"] svg,
-.main-actionButtons > button[aria-label="Friend Activity"] svg {
- -webkit-mask-image: var(
- --people-team-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/people-team.svg")
- );
- mask-image: var(
- --people-team-icon,
- url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/people-team.svg")
- );
+.main-actionButtons>div>button[aria-label="Friend Activity"] svg,
+.main-actionButtons>button[aria-label="Friend Activity"] svg {
+ -webkit-mask-image: var(--people-team-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/people-team.svg"));
+ mask-image: var(--people-team-icon,
+ url("https://sanooj.is-a.dev/Spicetify-Lucid/assets/icons/people-team.svg"));
}
.Root__globalNav button:is([aria-label="Clear search field"]) {
@@ -1744,9 +1655,7 @@ button[aria-label="Browse"] path {
transition: transform .3s linear;
}
-.main-gridContainer-gridContainer
- .Vn9yz8P5MjIvDT8c0U6w:hover
- .WDC2Yzs811n7JCYtYQzc {
+.main-gridContainer-gridContainer .Vn9yz8P5MjIvDT8c0U6w:hover .WDC2Yzs811n7JCYtYQzc {
transform: scale(1.06) rotate(15deg) translate(15%, 0%);
}
@@ -1825,65 +1734,51 @@ button[aria-label="Browse"] path {
}
.lyrics-lyricsContent-lyric:has(+ .lyrics-lyricsContent-active),
-.lyrics-lyricsContent-active + .lyrics-lyricsContent-lyric {
+.lyrics-lyricsContent-active+.lyrics-lyricsContent-lyric {
/* Sibling after active line */
color: rgba(var(--lyrics-active-color), 0.85) !important;
filter: blur(calc(var(--lyrics-blur-coefficent) * 1)) !important;
- transform: scale(
- calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 3.5)
- ) !important;
+ transform: scale(calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 3.5)) !important;
}
.lyrics-lyricsContent-lyric:has(+ * + .lyrics-lyricsContent-active),
-.lyrics-lyricsContent-active + * + .lyrics-lyricsContent-lyric {
+.lyrics-lyricsContent-active+*+.lyrics-lyricsContent-lyric {
/* Sibling 2 after active */
color: rgba(var(--lyrics-active-color), 0.75) !important;
filter: blur(calc(var(--lyrics-blur-coefficent) * 2)) !important;
- transform: scale(
- calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 3)
- ) !important;
+ transform: scale(calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 3)) !important;
}
.lyrics-lyricsContent-lyric:has(+ * + * + .lyrics-lyricsContent-active),
-.lyrics-lyricsContent-active + * + * + .lyrics-lyricsContent-lyric {
+.lyrics-lyricsContent-active+*+*+.lyrics-lyricsContent-lyric {
/* Sibling 3 after active */
color: rgba(var(--lyrics-active-color), 0.65) !important;
filter: blur(calc(var(--lyrics-blur-coefficent) * 2)) !important;
- transform: scale(
- calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 2.5)
- ) !important;
+ transform: scale(calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 2.5)) !important;
}
.lyrics-lyricsContent-lyric:has(+ * + * + * + .lyrics-lyricsContent-active),
-.lyrics-lyricsContent-active + * + * + * + .lyrics-lyricsContent-lyric {
+.lyrics-lyricsContent-active+*+*+*+.lyrics-lyricsContent-lyric {
/* Sibling 4 after active */
color: rgba(var(--lyrics-active-color), 0.55) !important;
filter: blur(calc(var(--lyrics-blur-coefficent) * 3)) !important;
- transform: scale(
- calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 2)
- ) !important;
+ transform: scale(calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 2)) !important;
}
.lyrics-lyricsContent-lyric:has(+ * + * + * + * + .lyrics-lyricsContent-active),
-.lyrics-lyricsContent-active + * + * + * + .lyrics-lyricsContent-lyric {
+.lyrics-lyricsContent-active+*+*+*+.lyrics-lyricsContent-lyric {
/* Sibling 5 after active */
color: rgba(var(--lyrics-active-color), 0.45) !important;
filter: blur(calc(var(--lyrics-blur-coefficent) * 3.5)) !important;
- transform: scale(
- calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 1.5)
- ) !important;
+ transform: scale(calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 1.5)) !important;
}
-.lyrics-lyricsContent-lyric:has(
- + * + * + * + * + * + .lyrics-lyricsContent-active
- ),
-.lyrics-lyricsContent-active + * + * + * + * + .lyrics-lyricsContent-lyric {
+.lyrics-lyricsContent-lyric:has(+ * + * + * + * + * + .lyrics-lyricsContent-active),
+.lyrics-lyricsContent-active+*+*+*+*+.lyrics-lyricsContent-lyric {
/* Sibling 6 after active */
color: rgba(var(--lyrics-active-color), 0.35) !important;
filter: blur(calc(var(--lyrics-blur-coefficent) * 4)) !important;
- transform: scale(
- calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 1)
- ) !important;
+ transform: scale(calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 1)) !important;
}
.lyrics-lyricsContent-lyric:hover,
@@ -1891,11 +1786,8 @@ button[aria-label="Browse"] path {
font-weight: var(--extra-bold-font-weight);
color: rgba(var(--lyrics-active-color), 1) !important;
filter: blur(calc(var(--lyrics-blur-coefficent) * 0)) !important;
- transform: scale(
- calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 5)
- ) !important;
- text-shadow: 0 0 calc(1rem + var(--lyrics-shadow-coefficent) * 5)
- var(--lyrics-color-shadow) !important;
+ transform: scale(calc(var(--scale-constant) + var(--lyrics-scale-coefficent) * 5)) !important;
+ text-shadow: 0 0 calc(1rem + var(--lyrics-shadow-coefficent) * 5) var(--lyrics-color-shadow) !important;
}
/* FullScreen Styles */
@@ -1977,12 +1869,12 @@ button[aria-label="Browse"] path {
container-type: normal !important;
}
-.Root__main-view > .main-view-container:has(.BeautifulLyricsPage) {
+.Root__main-view>.main-view-container:has(.BeautifulLyricsPage) {
container-type: size;
}
/* Whats new */
-.T9iBYqbERZHdwDl0U2tC .hGbRiYkIjjy4sJvor0A2 > :not(.OgaF7O4ER8AvZfFd6JdJ) {
+.T9iBYqbERZHdwDl0U2tC .hGbRiYkIjjy4sJvor0A2> :not(.OgaF7O4ER8AvZfFd6JdJ) {
opacity: 0.75;
}
@@ -1994,8 +1886,7 @@ button[aria-label="Browse"] path {
}
.IEDOUN3mwwZhHVziC03a .HeaderArea,
-.Box-group-naked-listRow-isInteractive-hasLeadingOrMedia-minBlockSize_56px
- .HeaderArea {
+.Box-group-naked-listRow-isInteractive-hasLeadingOrMedia-minBlockSize_56px .HeaderArea {
max-width: 70% !important;
}
@@ -2014,8 +1905,8 @@ button[aria-label="Browse"] path {
border: none;
}
-.SjhDNg4bQRQmIJAba47Z .eYvk_xcxVNMwCBkfY3O0 > *,
-.IEDOUN3mwwZhHVziC03a .Olh4d9g46wryDMTzRRmw > * {
+.SjhDNg4bQRQmIJAba47Z .eYvk_xcxVNMwCBkfY3O0>*,
+.IEDOUN3mwwZhHVziC03a .Olh4d9g46wryDMTzRRmw>* {
opacity: 1;
}
@@ -2127,7 +2018,7 @@ button[aria-label="Browse"] path {
overflow: hidden;
}
-.eKcCHC > .ProgressBarIndicator-sc-1b6tcn5-0 {
+.eKcCHC>.ProgressBarIndicator-sc-1b6tcn5-0 {
position: absolute;
height: 100%;
background: rgba(var(--spice-rgb-accent), 0.75);
@@ -2154,14 +2045,8 @@ aside[aria-label="Now playing view"] .mdMUqcSHFw1lZIcYEblu {
border-bottom: var(--default-border);
}
-aside[aria-label="Now playing view"]:has(.ZbDMGdU4aBOnrNLowNRq)
- .main-buddyFeed-scrollBarContainer:not(
- :has(.main-buddyFeed-content > .main-buddyFeed-header)
- ),
-aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
- .cZCuJDjrGA2QMXja_Sua:not(
- :has(.AAdBM1nhG73supMfnYX7 > .fNXmHtlrj4UVWmhQrJ_5)
- ) {
+aside[aria-label="Now playing view"]:has(.ZbDMGdU4aBOnrNLowNRq) .main-buddyFeed-scrollBarContainer:not(:has(.main-buddyFeed-content > .main-buddyFeed-header)),
+aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa) .cZCuJDjrGA2QMXja_Sua:not(:has(.AAdBM1nhG73supMfnYX7 > .fNXmHtlrj4UVWmhQrJ_5)) {
padding-top: 4rem;
}
@@ -2178,10 +2063,7 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
}
/* lucid Animated Bg */
-#lucid-main
- .background-container
- .background-wrapper
- .animated-background-container {
+#lucid-main .background-container .background-wrapper .animated-background-container {
filter: saturate(var(--saturation)) brightness(var(--brightness));
height: 100%;
left: 0;
@@ -2194,26 +2076,10 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
opacity: var(--opacity, 1);
}
-#lucid-main
- .background-container
- .background-wrapper
- .animated-background-container
- .back,
-#lucid-main
- .background-container
- .background-wrapper
- .animated-background-container
- .backright,
-#lucid-main
- .background-container
- .background-wrapper
- .animated-background-container
- .backleft,
-#lucid-main
- .background-container
- .background-wrapper
- .animated-background-container
- .front {
+#lucid-main .background-container .background-wrapper .animated-background-container .back,
+#lucid-main .background-container .background-wrapper .animated-background-container .backright,
+#lucid-main .background-container .background-wrapper .animated-background-container .backleft,
+#lucid-main .background-container .background-wrapper .animated-background-container .front {
pointer-events: none;
background-image: var(--now-playing-art-image);
background-repeat: no-repeat;
@@ -2222,48 +2088,31 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
transition: all var(--fade-time, 1s) ease;
animation: rotateBg var(--time, 40s) linear infinite;
border-radius: 18vw;
- filter: blur(var(--blur)) saturate(var(--saturation))
- brightness(var(--brightness)) contrast(var(--contrast));
+ filter: blur(var(--blur)) saturate(var(--saturation)) brightness(var(--brightness)) contrast(var(--contrast));
position: absolute;
aspect-ratio: 1 / 1;
width: 90%;
opacity: var(--opacity, 1);
}
-#lucid-main
- .background-container
- .background-wrapper
- .animated-background-container
- .front {
+#lucid-main .background-container .background-wrapper .animated-background-container .front {
animation-direction: reverse;
right: 0%;
top: 25%;
}
-#lucid-main
- .background-container
- .background-wrapper
- .animated-background-container
- .back {
+#lucid-main .background-container .background-wrapper .animated-background-container .back {
bottom: 35%;
left: 5%;
}
-#lucid-main
- .background-container
- .background-wrapper
- .animated-background-container
- .backright {
+#lucid-main .background-container .background-wrapper .animated-background-container .backright {
right: -50%;
top: -20%;
width: 75%;
}
-#lucid-main
- .background-container
- .background-wrapper
- .animated-background-container
- .backleft {
+#lucid-main .background-container .background-wrapper .animated-background-container .backleft {
left: -35%;
top: -20%;
width: 75%;
@@ -2292,8 +2141,7 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
pointer-events: none;
transition: all var(--fade-time) ease;
background-image: var(--now-playing-art-image);
- filter: blur(var(--blur)) contrast(var(--contrast))
- saturate(var(--saturation)) brightness(var(--brightness));
+ filter: blur(var(--blur)) contrast(var(--contrast)) saturate(var(--saturation)) brightness(var(--brightness));
z-index: -1;
opacity: var(--opacity, 1);
}
@@ -2381,26 +2229,20 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
flex-direction: column;
}
-#lucid-main .modal-wrapper .sections-container > *:not(:first-child) {
+#lucid-main .modal-wrapper .sections-container>*:not(:first-child) {
margin-top: var(--margin-xl, 1rem);
}
-#lucid-main
- .modal-container
- .setting-section
- .cards-wrapper
- .card
- .title-wrapper
- .title {
+#lucid-main .modal-container .setting-section .cards-wrapper .card .title-wrapper .title {
font-size: 1rem;
font-weight: 600;
}
-#lucid-main .modal-container .setting-section > *:not(:last-child) {
+#lucid-main .modal-container .setting-section>*:not(:last-child) {
margin-bottom: var(--gap-md);
}
-#lucid-main .modal-container > *:not(:last-child) {
+#lucid-main .modal-container>*:not(:last-child) {
margin-bottom: var(--gap-lg);
}
@@ -2414,32 +2256,18 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
border-radius: var(--card-border-radius);
}
-#lucid-main
- .modal-container
- .setting-section
- .cards-wrapper
- .card:has(.switch) {
+#lucid-main .modal-container .setting-section .cards-wrapper .card:has(.switch) {
padding: var(--padding-lg);
}
-#lucid-main
- .modal-container
- .setting-section
- .cards-wrapper
- .card
- .selected-value,
+#lucid-main .modal-container .setting-section .cards-wrapper .card .selected-value,
#lucid-main .modal-container .setting-section .cards-wrapper .card .tooltip {
font-size: 0.85rem;
font-weight: 500;
color: var(--spice-subtext);
}
-#lucid-main
- .modal-container
- .setting-section
- .cards-wrapper
- .card
- .selected-value {
+#lucid-main .modal-container .setting-section .cards-wrapper .card .selected-value {
display: -webkit-box;
-webkit-line-clamp: 1;
line-clamp: 1;
@@ -2459,24 +2287,14 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
transition: height 0.3s ease;
}
-#lucid-main
- .modal-container
- .setting-section
- .cards-wrapper
- .cards-wrapper
- .card {
+#lucid-main .modal-container .setting-section .cards-wrapper .cards-wrapper .card {
border-radius: 0;
border: 0;
min-height: 3.25rem;
transform: translateY(0) scaleY(1);
}
-#lucid-main
- .modal-container
- .setting-section
- .cards-wrapper
- .cards-wrapper
- .card:not(:first-child) {
+#lucid-main .modal-container .setting-section .cards-wrapper .cards-wrapper .card:not(:first-child) {
border-top: var(--default-border);
}
@@ -2552,11 +2370,9 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
#lucid-main .card .reset-button:hover::after {
border-color: rgba(220, 38, 38, 0.25) !important;
- background: linear-gradient(
- to bottom,
- rgba(255, 0, 0, 0.2) 0%,
- rgba(255, 0, 0, 0) 100%
- );
+ background: linear-gradient(to bottom,
+ rgba(255, 0, 0, 0.2) 0%,
+ rgba(255, 0, 0, 0) 100%);
}
/* input */
@@ -2758,7 +2574,7 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
border-radius: var(--border-radius-rounded);
}
-#lucid-main .switch input:checked + .slider {
+#lucid-main .switch input:checked+.slider {
background-color: rgba(var(--spice-rgb-button), 0.5);
}
@@ -2776,7 +2592,7 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
transform: translateY(-50%);
}
-#lucid-main .switch input:checked + .slider:before {
+#lucid-main .switch input:checked+.slider:before {
background-color: rgba(var(--spice-rgb-text), 1);
-webkit-transform: translateX(1.5rem) translateY(-50%);
-ms-transform: translateX(1.5rem) translateY(-50%);
@@ -2858,20 +2674,14 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
overflow: hidden;
}
-.playlist-view-card
- .main-entityHeader-container.main-entityHeader-nonWrapped
- .main-entityHeader-overlay {
- background: -webkit-gradient(
- linear,
+.playlist-view-card .main-entityHeader-container.main-entityHeader-nonWrapped .main-entityHeader-overlay {
+ background: -webkit-gradient(linear,
left top,
left bottom,
from(transparent),
- to(rgba(var(--spice-rgb-shadow), 0.25))
- ), var(--background-noise);
- background: linear-gradient(
- transparent 0,
- rgba(var(--spice-rgb-shadow), 0.25) 100%
- ), var(--background-noise);
+ to(rgba(var(--spice-rgb-shadow), 0.25))), var(--background-noise);
+ background: linear-gradient(transparent 0,
+ rgba(var(--spice-rgb-shadow), 0.25) 100%), var(--background-noise);
}
.main-nowPlayingView-contextItemInfo:before {
@@ -2886,31 +2696,24 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
content: "";
height: 100%;
width: 100%;
- background: linear-gradient(
- 0deg,
- rgba(var(--spice-rgb-main), 0.5),
- transparent
- );
+ background: linear-gradient(0deg,
+ rgba(var(--spice-rgb-main), 0.5),
+ transparent);
}
-.main-entityHeader-container.main-entityHeader-nonWrapped
- .main-entityHeader-backgroundColor {
+.main-entityHeader-container.main-entityHeader-nonWrapped .main-entityHeader-backgroundColor {
background-color: transparent !important;
}
.main-actionBarBackground-background {
background-color: transparent !important;
- background-image: -webkit-gradient(
- linear,
+ background-image: -webkit-gradient(linear,
left top,
left bottom,
from(rgba(var(--spice-rgb-card), 0.5)),
- to(transparent)
- ), var(--background-noise);
- background-image: linear-gradient(
- rgba(var(--spice-rgb-card), 0.5) 0,
- transparent 100%
- );
+ to(transparent)), var(--background-noise);
+ background-image: linear-gradient(rgba(var(--spice-rgb-card), 0.5) 0,
+ transparent 100%);
}
/* Image section (Playlist and Artist) */
@@ -2943,23 +2746,17 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
width: 100%;
pointer-events: none;
overflow: hidden;
- -webkit-mask-image: linear-gradient(
- to bottom,
- rgba(0, 0, 0, 1) 0%,
- rgba(0, 0, 0, 0) 100%
- );
- mask-image: linear-gradient(
- to bottom,
- rgba(0, 0, 0, 1) 0%,
- rgba(0, 0, 0, 0) 100%
- );
+ -webkit-mask-image: linear-gradient(to bottom,
+ rgba(0, 0, 0, 1) 0%,
+ rgba(0, 0, 0, 0) 100%);
+ mask-image: linear-gradient(to bottom,
+ rgba(0, 0, 0, 1) 0%,
+ rgba(0, 0, 0, 0) 100%);
opacity: var(--artwork-opacity, 1);
transition: opacity 0.3s ease;
}
-#main:has(.main-entityHeader-container.main-entityHeader-withBackgroundImage)
- #lucid-under-main-view
- .playlist-art-container {
+#main:has(.main-entityHeader-container.main-entityHeader-withBackgroundImage) #lucid-under-main-view .playlist-art-container {
-webkit-mask-image: none;
mask-image: none;
}
@@ -2973,38 +2770,26 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
background-position: center center;
}
-#main:has(.main-entityHeader-container.main-entityHeader-withBackgroundImage)
- #lucid-under-main-view
- .playlist-art-container
- .overlay {
+#main:has(.main-entityHeader-container.main-entityHeader-withBackgroundImage) #lucid-under-main-view .playlist-art-container .overlay {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
- background-image: -webkit-gradient(
- linear,
- left top,
- left bottom,
- from(transparent),
- to(rgba(var(--spice-rgb-shadow), 0.6))
- );
- background-image: linear-gradient(
- transparent 60%,
- rgba(var(--spice-rgb-shadow), 0.6) 100%
- );
-}
-
-.main-view-container:has(.main-entityHeader-withBackgroundImage)
- #lucid-under-main-view
- .playlist-art-container {
+ background-image: -webkit-gradient(linear,
+ left top,
+ left bottom,
+ from(transparent),
+ to(rgba(var(--spice-rgb-shadow), 0.6)));
+ background-image: linear-gradient(transparent 60%,
+ rgba(var(--spice-rgb-shadow), 0.6) 100%);
+}
+
+.main-view-container:has(.main-entityHeader-withBackgroundImage) #lucid-under-main-view .playlist-art-container {
height: calc(100vh - (var(--now-playing-bar-height) * 1.74));
}
-.main-view-container:has(.main-entityHeader-withBackgroundImage)
- #lucid-under-main-view
- .playlist-art-container
- .background {
+.main-view-container:has(.main-entityHeader-withBackgroundImage) #lucid-under-main-view .playlist-art-container .background {
filter: none;
mask-image: none;
-webkit-mask-image: none;
@@ -3061,17 +2846,13 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
}
.main-entityHeader-container.main-entityHeader-withBackgroundImage {
- background: -webkit-gradient(
- linear,
- left top,
- left bottom,
- from(transparent),
- to(rgba(var(--spice-rgb-shadow), 0.5))
- );
- background: linear-gradient(
- transparent 0,
- rgba(var(--spice-rgb-shadow), 0.5) 100%
- );
+ background: -webkit-gradient(linear,
+ left top,
+ left bottom,
+ from(transparent),
+ to(rgba(var(--spice-rgb-shadow), 0.5)));
+ background: linear-gradient(transparent 0,
+ rgba(var(--spice-rgb-shadow), 0.5) 100%);
}
.playlist-art-container.none .background {
@@ -3083,10 +2864,8 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
}
.playlist-art-container.now-playing .background {
- background-image: var(
- --under-main-view-art-image,
- var(--now-playing-art-image)
- );
+ background-image: var(--under-main-view-art-image,
+ var(--now-playing-art-image));
}
.artist .playlist-art-container .background {
@@ -3099,9 +2878,7 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
overflow: hidden;
}
-.playlist-view-card
- .main-entityHeader-container.main-entityHeader-nonWrapped
- .contentSpacing::before {
+.playlist-view-card .main-entityHeader-container.main-entityHeader-nonWrapped .contentSpacing::before {
content: "";
position: absolute;
top: 0;
@@ -3112,9 +2889,7 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
z-index: -1;
}
-.playlist-view-card
- .main-entityHeader-container.main-entityHeader-nonWrapped
- .contentSpacing {
+.playlist-view-card .main-entityHeader-container.main-entityHeader-nonWrapped .contentSpacing {
height: fit-content;
width: fit-content;
position: absolute;
@@ -3128,25 +2903,19 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
backdrop-filter: blur(var(--blur-xl));
}
-.playlist-view-compact
- .main-entityHeader-container.main-entityHeader-nonWrapped {
+.playlist-view-compact .main-entityHeader-container.main-entityHeader-nonWrapped {
position: relative;
height: min(25vh, calc(var(--fluid-height) / 2)) !important;
min-height: 25vh;
}
-.playlist-view-compact
- .main-entityHeader-imageContainer.main-entityHeader-imageContainerNew {
+.playlist-view-compact .main-entityHeader-imageContainer.main-entityHeader-imageContainerNew {
height: 10rem !important;
width: 10rem !important;
}
.playlist-view-compact .main-entityHeader-headerText .main-entityHeader-title *,
-.playlist-view-compact
- .main-entityHeader-title
- .main-entityHeader-titleButton
- .main-entityHeader-titleInner
- h1 {
+.playlist-view-compact .main-entityHeader-title .main-entityHeader-titleButton .main-entityHeader-titleInner h1 {
white-space: pretty !important;
font-size: 2rem !important;
}
@@ -3174,15 +2943,11 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
margin-top: var(--margin-sm, 0.25rem);
}
-.playlist-view-compact
- .main-entityHeader-headerText
- .main-entityHeader-pretitle {
+.playlist-view-compact .main-entityHeader-headerText .main-entityHeader-pretitle {
font-size: 0.9rem;
}
-.playlist-view-compact
- .main-entityHeader-metaDataText.main-entityHeader-creatorWrapper
- .encore-text-body-small-bold {
+.playlist-view-compact .main-entityHeader-metaDataText.main-entityHeader-creatorWrapper .encore-text-body-small-bold {
font-weight: 600;
}
@@ -3223,13 +2988,13 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
background-color: rgba(var(--accent-color), 0.5);
}
-.lucid-changelog .release-content > ul {
+.lucid-changelog .release-content>ul {
display: flex;
flex-direction: column;
gap: 0.25rem;
}
-.lucid-changelog .release-content > ul > li {
+.lucid-changelog .release-content>ul>li {
margin-left: 2rem;
list-style: disc;
}
@@ -3261,8 +3026,7 @@ aside[aria-label="Now playing view"]:has(.W3E0IT3_STcazjTeyOJa)
/* Context menu upgrade button */
.upgrade-button,
button[data-menu-item="upgrade-account"],
-.main-contextMenu-menuItem
- a[href="https://www.spotify.com/premium/?ref=desktop_loggedin_upgrade_menu"],
+.main-contextMenu-menuItem a[href="https://www.spotify.com/premium/?ref=desktop_loggedin_upgrade_menu"],
button[id="upgradeAccount"] {
display: none !important;
}
@@ -3325,4 +3089,4 @@ button[id="upgradeAccount"] {
--shuffle-icon: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj4NCjxwYXRoIGQ9Ik0xOS4yMDcxIDQuMjkyODlDMTguODE2NiAzLjkwMjM3IDE4LjE4MzQgMy45MDIzNyAxNy43OTI5IDQuMjkyODlDMTcuNDAyNCA0LjY4MzQyIDE3LjQwMjQgNS4zMTY1OCAxNy43OTI5IDUuNzA3MTFMMTguNTk0MyA2LjUwODU2QzE0Ljc4NTIgNi42NzA0OSAxMi40MjUxIDkuMDk4ODQgMTAuMzY4MyAxMS4yMTUyTDEwLjI4MyAxMS4zMDI5QzguMDU2ODMgMTMuNTkyNyA2LjE0Njc3IDE1LjUgMyAxNS41QzIuNDQ3NzIgMTUuNSAyIDE1Ljk0NzcgMiAxNi41QzIgMTcuMDUyMyAyLjQ0NzcyIDE3LjUgMyAxNy41QzcuMDQ5MDcgMTcuNSA5LjUwMjgyIDE0Ljk3NTMgMTEuNjMxNyAxMi43ODQ4TDExLjcxNyAxMi42OTcxQzEzLjg0MDkgMTAuNTEyNSAxNS42NzcgOC42NzYxIDE4LjU3MzkgOC41MTE5M0wxNy43OTI5IDkuMjkyODlDMTcuNDAyNCA5LjY4MzQxIDE3LjQwMjQgMTAuMzE2NiAxNy43OTI5IDEwLjcwNzFDMTguMTgzNCAxMS4wOTc2IDE4LjgxNjYgMTEuMDk3NiAxOS4yMDcxIDEwLjcwNzFMMjEuNzA3MSA4LjIwNzFDMjEuODk0NiA4LjAxOTU2IDIyIDcuNzY1MjEgMjIgNy40OTk5OUMyMiA3LjIzNDc4IDIxLjg5NDYgNi45ODA0MiAyMS43MDcxIDYuNzkyODhMMTkuMjA3MSA0LjI5Mjg5Wk0zIDYuNTAwMjRDNi4yMjg2NCA2LjUwMDI0IDguNDQyOTUgOC4xMDU0NSAxMC4yODcxIDkuODY2NDdDMTAuMDkwMiAxMC4wNjYgOS44OTkwMyAxMC4yNjI4IDkuNzEyOSAxMC40NTQ1TDkuNTY1OTkgMTAuNjA1N0M5LjMzMzMxIDEwLjg0NTEgOS4xMDczMSAxMS4wNzYzIDguODg2MTcgMTEuMjk4N0M3LjE4NTQ4IDkuNjgwNDYgNS40NzUzOCA4LjUwMDI0IDMgOC41MDAyNEMyLjQ0NzcyIDguNTAwMjQgMiA4LjA1MjUzIDIgNy41MDAyNEMyIDYuOTQ3OTYgMi40NDc3MiA2LjUwMDI0IDMgNi41MDAyNFpNMTguNTk0MyAxNy40OTE0QzE1LjU4MzkgMTcuMzYzNSAxMy40Nzg2IDE1LjgxOTkgMTEuNzEyNyAxNC4xMzM1QzExLjkwOTcgMTMuOTMzOSAxMi4xMDA5IDEzLjczNyAxMi4yODcxIDEzLjU0NTJMMTIuNDM0IDEzLjM5NEMxMi42NjY2IDEzLjE1NDggMTIuODkyNSAxMi45MjM2IDEzLjExMzYgMTIuNzAxNEMxNC43MTUgMTQuMjI1MSAxNi4zMjQ3IDE1LjM2MDYgMTguNTczOSAxNS40ODgxTDE3Ljc5MjkgMTQuNzA3MUMxNy40MDI0IDE0LjMxNjYgMTcuNDAyNCAxMy42ODM0IDE3Ljc5MjkgMTMuMjkyOUMxOC4xODM0IDEyLjkwMjQgMTguODE2NiAxMi45MDI0IDE5LjIwNzEgMTMuMjkyOUwyMS43MDcxIDE1Ljc5MjlDMjEuODk0NiAxNS45ODA0IDIyIDE2LjIzNDggMjIgMTYuNUMyMiAxNi43NjUyIDIxLjg5NDYgMTcuMDE5NiAyMS43MDcxIDE3LjIwNzFMMTkuMjA3MSAxOS43MDcxQzE4LjgxNjYgMjAuMDk3NiAxOC4xODM0IDIwLjA5NzYgMTcuNzkyOSAxOS43MDcxQzE3LjQwMjQgMTkuMzE2NiAxNy40MDI0IDE4LjY4MzQgMTcuNzkyOSAxOC4yOTI5TDE4LjU5NDMgMTcuNDkxNFoiIGZpbGw9IiMyMTIxMjEiLz4NCjwvc3ZnPg==");
--slide-text-outline-icon: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj4NCjxwYXRoIGQ9Ik02Ljc1IDhDNi4zMzU3OSA4IDYgOC4zMzU3OSA2IDguNzVDNiA5LjE2NDIxIDYuMzM1NzkgOS41IDYuNzUgOS41SDExLjI1QzExLjY2NDIgOS41IDEyIDkuMTY0MjEgMTIgOC43NUMxMiA4LjMzNTc5IDExLjY2NDIgOCAxMS4yNSA4SDYuNzVaTTYgMTEuNzVDNiAxMS4zMzU4IDYuMzM1NzkgMTEgNi43NSAxMUgxNS4yNUMxNS42NjQyIDExIDE2IDExLjMzNTggMTYgMTEuNzVDMTYgMTIuMTY0MiAxNS42NjQyIDEyLjUgMTUuMjUgMTIuNUg2Ljc1QzYuMzM1NzkgMTIuNSA2IDEyLjE2NDIgNiAxMS43NVpNNi43NSAxNEM2LjMzNTc5IDE0IDYgMTQuMzM1OCA2IDE0Ljc1QzYgMTUuMTY0MiA2LjMzNTc5IDE1LjUgNi43NSAxNS41SDEzLjI1QzEzLjY2NDIgMTUuNSAxNCAxNS4xNjQyIDE0IDE0Ljc1QzE0IDE0LjMzNTggMTMuNjY0MiAxNCAxMy4yNSAxNEg2Ljc1Wk00Ljc1IDRDMy4yMzEyMiA0IDIgNS4yMzEyMiAyIDYuNzVWMTcuMjVDMiAxOC43Njg4IDMuMjMxMjIgMjAgNC43NSAyMEgxOS4yNUMyMC43Njg4IDIwIDIyIDE4Ljc2ODggMjIgMTcuMjVWNi43NUMyMiA1LjIzMTIyIDIwLjc2ODggNCAxOS4yNSA0SDQuNzVaTTMuNSA2Ljc1QzMuNSA2LjA1OTY0IDQuMDU5NjQgNS41IDQuNzUgNS41SDE5LjI1QzE5Ljk0MDQgNS41IDIwLjUgNi4wNTk2NCAyMC41IDYuNzVWMTcuMjVDMjAuNSAxNy45NDA0IDE5Ljk0MDQgMTguNSAxOS4yNSAxOC41SDQuNzVDNC4wNTk2NCAxOC41IDMuNSAxNy45NDA0IDMuNSAxNy4yNVY2Ljc1WiIgZmlsbD0iIzIxMjEyMSIvPg0KPC9zdmc+");
--slide-text-icon: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj4NCjxwYXRoIGQ9Ik0yIDYuNzVDMiA1LjIzMTIyIDMuMjMxMjIgNCA0Ljc1IDRIMTkuMjVDMjAuNzY4OCA0IDIyIDUuMjMxMjIgMjIgNi43NVYxNy4yNUMyMiAxOC43Njg4IDIwLjc2ODggMjAgMTkuMjUgMjBINC43NUMzLjIzMTIyIDIwIDIgMTguNzY4OCAyIDE3LjI1VjYuNzVaTTYuNzUgOEM2LjMzNTc5IDggNiA4LjMzNTc5IDYgOC43NUM2IDkuMTY0MjEgNi4zMzU3OSA5LjUgNi43NSA5LjVIMTEuMjVDMTEuNjY0MiA5LjUgMTIgOS4xNjQyMSAxMiA4Ljc1QzEyIDguMzM1NzkgMTEuNjY0MiA4IDExLjI1IDhINi43NVpNNi43NSAxMUM2LjMzNTc5IDExIDYgMTEuMzM1OCA2IDExLjc1QzYgMTIuMTY0MiA2LjMzNTc5IDEyLjUgNi43NSAxMi41SDE1LjI1QzE1LjY2NDIgMTIuNSAxNiAxMi4xNjQyIDE2IDExLjc1QzE2IDExLjMzNTggMTUuNjY0MiAxMSAxNS4yNSAxMUg2Ljc1Wk02IDE0Ljc1QzYgMTUuMTY0MiA2LjMzNTc5IDE1LjUgNi43NSAxNS41SDEzLjI1QzEzLjY2NDIgMTUuNSAxNCAxNS4xNjQyIDE0IDE0Ljc1QzE0IDE0LjMzNTggMTMuNjY0MiAxNCAxMy4yNSAxNEg2Ljc1QzYuMzM1NzkgMTQgNiAxNC4zMzU4IDYgMTQuNzVaIiBmaWxsPSIjMjEyMTIxIi8+DQo8L3N2Zz4=");
-}
+}
\ No newline at end of file