Create user.css

Psycho/user.css

@@ -0,0 +1,219 @@
+.main-rootlist-rootlistDividerGradient {
+    display: none;
+}
+
+.main-rootlist-rootlistDivider {
+    background-color: rgba(var(--spice-rgb-button-disabled),.8)
+}
+
+input {
+    background-color: unset !important;
+    border-bottom: solid 1px var(--spice-text) !important;
+    border-radius: 0 !important;
+    padding: 6px 10px 6px 48px;
+    color: var(--spice-text) !important;
+}
+
+.x-833-searchInput-searchInputSearchIcon {
+    color: var(--spice-text) !important;
+}
+
+.main-home-homeHeader, .x-441-entityHeader-overlay, .main-actionBarBackground-background, .main-entityHeader-overlay, .main-entityHeader-backgroundColor {
+    background-color: unset !important;
+    background-image: unset !important;
+}
+
+.main-playlistEditDetailsModal-textElement:focus {
+    border: 0;
+}
+
+.main-playButton-PlayButton.main-playButton-primary {
+    color: var(--spice-main);
+}
+
+.connect-title, .connect-header {
+    display: none;
+}
+
+/* Topbar visibility bug */
+
+.main-topBar-topbarContent:not(.main-topBar-topbarContentFadeIn)>* {
+    opacity: unset !important;
+}
+
+.main-entityHeader-topbarContent:not(.main-entityHeader-topbarContentFadeIn)>* {
+    opacity: 0 !important;
+}
+
+/* Remove Topbar background colour */
+
+.main-topBar-background {
+    background-color: unset !important;
+}
+
+.main-topBar-overlay {
+    background-color: var(--spice-main);
+}
+
+.main-entityHeader-shadow {
+    box-shadow: 0 04px 20px #21212130;
+}
+
+.main-trackList-playingIcon {
+    filter: brightness(0) saturate(100%) invert(11%) sepia(81%) saturate(4689%) hue-rotate(359deg) brightness(78%) contrast(115%);
+}
+
+span.artist-artistVerifiedBadge-badge svg:nth-child(1) {
+    fill: black;
+}
+
+.main-playPauseButton-button {
+    background-color: var(--spice-player) !important;
+}
+
+/* Hide Banner Ads */
+
+.main-leaderboardComponent-container {
+    display: none;
+}
+
+.desktoproutes-homepage-takeover-ad-hptoComponent-parentContainer, .desktoproutes-homepage-takeover-ad-hptoComponent-container {
+    display: none !important;
+}
+
+/* Hide Upgrade Button */
+
+.main-topBar-UpgradeButton {
+    display: none;
+}
+
+[aria-label="Playing"] {
+    color: var(--spice-text);
+}
+
+/* Fix design fault */
+
+@media (min-width: 1024px) {
+    .main-trackList-trackListHeader {
+        margin: 0 -33px 16px;
+    }
+}
+
+.main-trackList-trackListHeaderStuck.main-trackList-trackListHeader {
+    background: var(--spice-main);
+    border: 0;
+}
+
+.main-trackList-trackListHeaderStuck .main-trackList-trackListHeaderRow {
+    border-bottom: 1px solid rgba(var(--spice-rgb-button-disabled),.8);
+}
+
+/* Changing Playback Bar Location */
+
+.playback-bar .progress-bar-wrapper {
+    right: 82.9%;
+}
+
+.playback-bar .progress-bar__bg, .playback-bar .progress-bar__fg_wrapper {
+    width: 265.8%;
+    border-radius: 0;
+}
+
+.playback-bar .progress-bar__fg {
+    background-color: var(--spice-text);
+}
+
+.playback-bar__progress-time {
+    display: none;
+}
+
+.playback-bar {
+    transform: translateY(-72px);
+}
+
+.main-playbackBarRemainingTime-container {
+    display: none;
+}
+
+.player-controls__buttons {
+    transform: translateY(10px);
+}
+
+.main-playPauseButton-button {
+    background-color: var(--spice-main);
+    box-shadow: black 0 5px 9px 0px;
+    --button-size: 43px !important;
+    color: var(--spice-button);
+}
+
+.player-controls__buttons {
+    align-items: center;
+}
+
+.main-entityTitle-subtitle.main-entityTitle-small {
+    color: var(--spice-button);
+}
+
+.main-entityTitle-subtitle.main-entityTitle-small.main-entityTitle-uppercase.main-entityTitle-bold {
+    border: 2px var(--spice-text) solid;
+    border-radius: 4px;
+    width: fit-content;
+    display: inline;
+    text-align: center;
+    padding: 0 5px;
+}
+
+.os-theme-spotify.os-host-transition>.os-scrollbar-vertical>.os-scrollbar-track>.os-scrollbar-handle {
+    border-radius: 4px;
+    background-color: rgba(var(--spice-rgb-button-disabled),.8);
+}
+
+/* Hide Profile Options in Nav Bar */
+
+.main-userWidget-displayName, .main-userWidget-notificationIndicator {
+    display: none;
+}
+
+.main-avatar-userIcon {
+    color: white;
+}
+
+.main-userWidget-box {
+    color: var(--spice-subtext);
+}
+
+/* Improve Sidebar Buttons */
+
+.main-likedSongsButton-likedSongsIcon {
+    background: var(--spice-text);
+}
+
+.main-likedSongsButton-likedSongsIcon {
+    color: var(--spice-sidebar);
+}
+
+.main-trackList-trackListHeaderRow {
+    border-bottom: 1px solid rgba(var(--spice-rgb-button-disabled),.8)
+}
+
+.main-trackList-trackListHeaderStuck .main-trackList-trackListHeaderRow {
+    border-bottom: 1px solid rgba(var(--spice-rgb-button-disabled),.8);
+}
+
+.main-trackList-trackListRow.main-trackList-selected, 
+.main-trackList-trackListRow.main-trackList-selected:hover {
+    background-color: rgba(var(--spice-rgb-selected-row),.15) !important;
+}
+
+.main-duplicateTracksDialog-container {
+    background-color: var(--spice-card);
+    color: var(--spice-subtext);
+}
+
+.main-duplicateTracksDialog-secondaryButton {
+    color: var(--spice-text);
+}
+
+._9eb5acf729a98d62135ca21777fef244-scss {
+    color: var(--spice-card);
+}