diff --git a/Fluent/LICENSE b/Fluent/LICENSE deleted file mode 100644 index d1baa63..0000000 --- a/Fluent/LICENSE +++ /dev/null @@ -1,22 +0,0 @@ -MIT License - -Copyright (c) 2021 William Ha -Copyright (c) 2021 schnensch - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. \ No newline at end of file diff --git a/Fluent/README.md b/Fluent/README.md deleted file mode 100644 index dc57ccb..0000000 --- a/Fluent/README.md +++ /dev/null @@ -1,74 +0,0 @@ -# Fluent - -## Screenshots - -### Dark -![dark-1](screenshots/dark-1.png) -![dark-2](screenshots/dark-2.png) - -### Comfy -![comfy-1](screenshots/comfy-1.jpg) -![comfy-2](screenshots/comfy-2.jpg) - -### Light -![light-1](screenshots/light-1.png) - -## More - -### About - -[Spicetify](https://github.com/spicetify/spicetify-cli) theme inspired by Windows 11 UI and Microsoft's Fluent Design. -Requires Segoe UI font. - -Based off [Ziro](https://github.com/schnensch0/ziro) theme by [schnensch](https://github.com/schnensch0) -[Fluent UI System Icons](https://github.com/microsoft/fluentui-system-icons) by Microsoft Corporation -[Phosphor Icons](https://github.com/phosphor-icons/phosphor-icons) by Phosphor Icons - -### Install - -Make sure spicetify >= v2.7.0 is installed. Run these commands: - -#### Windows -In **Powershell**: -```powershell -cd "$(spicetify -c | Split-Path)\Themes\Fluent" -Copy-Item fluent.js ..\..\Extensions -spicetify config extensions fluent.js -spicetify config current_theme Fluent color_scheme dark -spicetify config inject_css 1 replace_colors 1 overwrite_assets 1 -spicetify apply -``` - -#### macOS and Linux -In **Bash**: -```bash -cd "$(dirname "$(spicetify -c)")/Themes/Fluent" -mkdir -p ../../Extensions -cp fluent.js ../../Extensions/. -spicetify config extensions fluent.js -spicetify config current_theme Fluent color_scheme dark -spicetify config inject_css 1 replace_colors 1 overwrite_assets 1 -spicetify apply -``` - -### Important -For the sidebar playlists to show properly, ensure that these two lines are added in your config-xpui.ini file: -```ini -[Patch] -xpui.js_find_8008 = ,(\w+=)32, -xpui.js_repl_8008 = ,${1}56, -``` - - -### Customization - -Three color schemes are available: `light` or `dark` or `comfy`. Change scheme with commands: -``` -spicetify config color_scheme -spicetify apply -``` - -### More Options -- You can change the accent color in the theme folder's color.ini file. -- If you are using Windows, you can hide the window controls by adding the flag `--transparent-window-controls` after Spotify.exe in your Spotify shortcut. -- Use "Sidebar config" in the Spotify profile menu to hide/unhide and stick/unstick the Liked Songs and My Episodes icons in the sidebar. diff --git a/Fluent/assets/fluentui-system-icons/LICENSE b/Fluent/assets/fluentui-system-icons/LICENSE deleted file mode 100644 index 3c88423..0000000 --- a/Fluent/assets/fluentui-system-icons/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -MIT License - -Copyright (c) 2020 Microsoft Corporation - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_add_circle_24_regular.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_add_circle_24_regular.svg deleted file mode 100644 index 5e815d5..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_add_circle_24_regular.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_left_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_left_24_filled.svg deleted file mode 100644 index 70aba33..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_left_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_repeat_all_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_repeat_all_24_filled.svg deleted file mode 100644 index 1a6555f..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_repeat_all_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_repeat_all_off_24_regular.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_repeat_all_off_24_regular.svg deleted file mode 100644 index 73dc777..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_repeat_all_off_24_regular.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_repeat_all_once_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_repeat_all_once_24_filled.svg deleted file mode 100644 index da1268c..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_repeat_all_once_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_right_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_right_24_filled.svg deleted file mode 100644 index c6bf786..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_right_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_up_right_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_up_right_24_filled.svg deleted file mode 100644 index 4e3401c..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_up_right_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_up_right_24_regular.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_up_right_24_regular.svg deleted file mode 100644 index 6644f30..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_arrow_up_right_24_regular.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_folder_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_folder_24_filled.svg deleted file mode 100644 index 6d3cd52..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_folder_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_heart_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_heart_24_filled.svg deleted file mode 100644 index 986fb83..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_heart_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_home_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_home_24_filled.svg deleted file mode 100644 index 14a902e..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_home_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_home_24_regular.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_home_24_regular.svg deleted file mode 100644 index 7b1fc58..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_home_24_regular.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_library_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_library_24_filled.svg deleted file mode 100644 index e1a6abc..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_library_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_library_24_regular.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_library_24_regular.svg deleted file mode 100644 index a80c1d1..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_library_24_regular.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_mic_on_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_mic_on_24_filled.svg deleted file mode 100644 index 3d9786b..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_mic_on_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_music_note_2_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_music_note_2_24_filled.svg deleted file mode 100644 index 0b55699..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_music_note_2_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_next_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_next_24_filled.svg deleted file mode 100644 index 54758a0..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_next_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_pause_16_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_pause_16_filled.svg deleted file mode 100644 index 3cd5cce..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_pause_16_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_play_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_play_24_filled.svg deleted file mode 100644 index 556fc7a..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_play_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_previous_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_previous_24_filled.svg deleted file mode 100644 index 750f39f..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_previous_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_search_12_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_search_12_filled.svg deleted file mode 100644 index 0b7fd13..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_search_12_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_search_16_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_search_16_filled.svg deleted file mode 100644 index 7556f8c..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_search_16_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_search_16_regular.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_search_16_regular.svg deleted file mode 100644 index c8aeb38..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_search_16_regular.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_search_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_search_24_filled.svg deleted file mode 100644 index d3bcb5d..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_search_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_search_24_regular.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_search_24_regular.svg deleted file mode 100644 index 57ed716..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_search_24_regular.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_skip_backward_15_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_skip_backward_15_24_filled.svg deleted file mode 100644 index 096eafa..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_skip_backward_15_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ -Layer 1 \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_skip_forward_15_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_skip_forward_15_24_filled.svg deleted file mode 100644 index 99d051b..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_skip_forward_15_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ -Layer 1 \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_slide_text_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_slide_text_24_filled.svg deleted file mode 100644 index ba7d534..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_slide_text_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_slide_text_24_regular.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_slide_text_24_regular.svg deleted file mode 100644 index cde3c10..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_slide_text_24_regular.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/fluentui-system-icons/ic_fluent_top_speed_24_filled.svg b/Fluent/assets/fluentui-system-icons/ic_fluent_top_speed_24_filled.svg deleted file mode 100644 index 6330f27..0000000 --- a/Fluent/assets/fluentui-system-icons/ic_fluent_top_speed_24_filled.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/phosphor-icons/LICENSE b/Fluent/assets/phosphor-icons/LICENSE deleted file mode 100644 index e2eb0bd..0000000 --- a/Fluent/assets/phosphor-icons/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -MIT License - -Copyright (c) 2020 Phosphor Icons - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. diff --git a/Fluent/assets/phosphor-icons/shuffle-bold.svg b/Fluent/assets/phosphor-icons/shuffle-bold.svg deleted file mode 100644 index 8ec07e0..0000000 --- a/Fluent/assets/phosphor-icons/shuffle-bold.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/phosphor-icons/shuffle-light.svg b/Fluent/assets/phosphor-icons/shuffle-light.svg deleted file mode 100644 index 4c5a11c..0000000 --- a/Fluent/assets/phosphor-icons/shuffle-light.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/assets/phosphor-icons/shuffle.svg b/Fluent/assets/phosphor-icons/shuffle.svg deleted file mode 100644 index 13b2b9e..0000000 --- a/Fluent/assets/phosphor-icons/shuffle.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/Fluent/color.ini b/Fluent/color.ini deleted file mode 100644 index c2b2965..0000000 --- a/Fluent/color.ini +++ /dev/null @@ -1,86 +0,0 @@ -[light] -text = 000000 -subtext = 6D6D6D -alt-text = ffffff -main = f9f9f9 -sidebar = f2f2f2 -topbar = f2f2f2 -nav-icon-active = bbbbbb -player = f2f2f2 -player-border = e4e4e4 -player-bar-shadow = a5a5a5 -player-bar-bg = 7D7D7D -card = FDFDFD -shadow = ffffff -selected-row = fdfdfd -button = ffffff -button-active = ffffff -button-disabled = fdfdfd -tab-active = EEEEEE -notification = fdfdfd -notification-error = fb7c7c -misc = 202020 -not-selected = BBBBBB - -; Change accent color -accent = 006BBA - -layer-shadow = EDEDED -contour = EFEFEF - -[dark] -text = ffffff -subtext = 909090 -alt-text = ffffff -main = 272727 -sidebar = 202020 -topbar = 202020 -nav-icon-active = bbbbbb -player = 202020 -player-border = 2d2d2d -player-bar-shadow = 171717 -player-bar-bg = 313131 -card = 323232 -shadow = ffffff -selected-row = 323232 -button = ffffff -button-active = ffffff -button-disabled = 313131 -tab-active = 272727 -notification = 191919 -notification-error = fb7c7c -misc = 202020 -not-selected = BBBBBB - -; Change accent color -accent = 00BEFD - -layer-shadow = 1d1d1d -contour = 303030 - -[comfy] -text = ffffff -subtext = 909090 -alt-text = ffffff -main = 23283d -sidebar = 1a202e -topbar = 101320 -nav-icon-active = bbbbbb -player = 1a202e -player-border = 0d0d0d -player-bar-shadow = 171717 -player-bar-bg = 313131 -card = 1e2233 -shadow = ffffff -selected-row = 1e2233 -button = ffffff -button-active = ffffff -button-disabled = 313131 -tab-active = 23283d -notification = 191919 -notification-error = fb7c7c -misc = 1a202e -not-selected = BBBBBB -accent = 1b7d48 -layer-shadow = 1d1d1d -contour = 0c0c0c diff --git a/Fluent/fluent.js b/Fluent/fluent.js deleted file mode 100644 index 46b0457..0000000 --- a/Fluent/fluent.js +++ /dev/null @@ -1,125 +0,0 @@ -(function fluent() { - - function waitForElement(els, func, timeout = 10000) { - const queries = els.map(el => document.querySelector(el)); - if (queries.every(a => a)) { - func(); - } else if (timeout > 0) { - setTimeout(waitForElement, 300, els, func, timeout--); - } - } - - waitForElement([ - ".main-rootlist-rootlistItemLink" - ], function () { - function replacePlaylistIcons() { - const playListItems = document.getElementsByClassName("main-rootlist-rootlistItemLink"); - - for (const item of playListItems) { - const link = item.pathname; - let uri; - if (link.search("playlist") !== -1) { - uri = Spicetify.URI.playlistV2URI(link.split("/").pop()); - } else if (link.search("folder") !== -1) { - item.style.content = "url('./fluentui-system-icons/ic_fluent_folder_24_filled.svg')" - continue; - } - - Spicetify.CosmosAsync.get( - `sp://core-playlist/v1/playlist/${uri.toString()}/metadata`, { - policy: { - picture: true - } - } - ).then(res => { - const meta = res.metadata; - if (meta.picture === "") { - item.style.content = "url('./fluentui-system-icons/ic_fluent_music_note_2_24_filled.svg')" - } else { - item.style.backgroundImage = "url(" + meta.picture + ")"; - item.style.content = ""; - } - }); - }; - - }; - - replacePlaylistIcons(); - const observer = new MutationObserver(replacePlaylistIcons); - waitForElement(["#spicetify-playlist-list"], () => { - const rootList = document.querySelector("#spicetify-playlist-list"); - observer.observe(rootList, { - childList: true, - subtree: true - }); - }); - }); - - waitForElement([ - ".main-navBar-navBarLink", - "[href='/collection'] > span" - ], () => { - const navBarItems = document.getElementsByClassName("main-navBar-navBarLink"); - for (const item of navBarItems) { - let div = document.createElement("div"); - div.classList.add("navBar-navBarLink-accent"); - item.appendChild(div); - } - document.querySelector("[href='/collection'] > span").innerHTML = "Library"; - }); - - const textColor = getComputedStyle(document.documentElement).getPropertyValue('--spice-text'); - if (textColor == " #000000") { - document.documentElement.style.setProperty('--filter-brightness', 0); - } - - var interval = setInterval(function() { - if (typeof Spicetify.Platform == 'undefined' || (typeof Spicetify.Platform.Translations.play == 'undefined' && typeof Spicetify.Platform.Translations.pause == 'undefined')) return; - clearInterval(interval); - var playButtonStyle = document.createElement('style'); - playButtonStyle.type = 'text/css'; - playButtonStyle.innerHTML = ` - .main-playButton-button[aria-label="${Spicetify.Platform.Translations.play}"], - .main-playButton-PlayButton[aria-label="${Spicetify.Platform.Translations.play}"], - .main-playPauseButton-button[aria-label="${Spicetify.Platform.Translations.play}"], - .main-trackList-rowPlayPauseButton[aria-label="${Spicetify.Platform.Translations.play}"] { - background-color: var(--spice-text) !important; - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_play_24_filled.svg') !important; - } - .main-playButton-button[aria-label="${Spicetify.Platform.Translations.pause}"], - .main-playButton-PlayButton[aria-label="${Spicetify.Platform.Translations.pause}"], - .main-playPauseButton-button[aria-label="${Spicetify.Platform.Translations.pause}"], - .main-trackList-rowPlayPauseButton[aria-label="${Spicetify.Platform.Translations.pause}"] { - background-color: var(--spice-text) !important; - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_pause_16_filled.svg') !important; - } - `; - document.getElementsByTagName('head')[0].appendChild(playButtonStyle); - }, 10) - - waitForElement([".progress-bar__slider"], () => { - const sliders = document.getElementsByClassName("progress-bar__slider"); - for (const slider of sliders) { - const dot = document.createElement("div"); - dot.classList.add("slider-dot"); - slider.appendChild(dot); - } - }, 10); - - - waitForElement([".ExtraControls"], () => { - const element = document.querySelector(".ExtraControls"); - element.addEventListener("click", () => { - waitForElement([".npv-main-container .progress-bar__slider"], () => { - const sliders = document.getElementsByClassName("npv-main-container")[0].getElementsByClassName("progress-bar__slider"); - for (const slider of sliders) { - if(slider.dataset.dot === "true") { continue; } - slider.dataset.dot = "true"; - const dot = document.createElement("div"); - dot.classList.add("slider-dot"); - slider.appendChild(dot); - } - }, 10) - }) - }, 10); -})(); diff --git a/Fluent/screenshots/comfy-1.jpg b/Fluent/screenshots/comfy-1.jpg deleted file mode 100644 index aa1ff0a..0000000 Binary files a/Fluent/screenshots/comfy-1.jpg and /dev/null differ diff --git a/Fluent/screenshots/comfy-2.jpg b/Fluent/screenshots/comfy-2.jpg deleted file mode 100644 index 1d1f50c..0000000 Binary files a/Fluent/screenshots/comfy-2.jpg and /dev/null differ diff --git a/Fluent/screenshots/dark-1.png b/Fluent/screenshots/dark-1.png deleted file mode 100644 index cd10115..0000000 Binary files a/Fluent/screenshots/dark-1.png and /dev/null differ diff --git a/Fluent/screenshots/dark-2.png b/Fluent/screenshots/dark-2.png deleted file mode 100644 index c028abe..0000000 Binary files a/Fluent/screenshots/dark-2.png and /dev/null differ diff --git a/Fluent/screenshots/light-1.png b/Fluent/screenshots/light-1.png deleted file mode 100644 index a9032e3..0000000 Binary files a/Fluent/screenshots/light-1.png and /dev/null differ diff --git a/Fluent/user.css b/Fluent/user.css deleted file mode 100644 index 9e934ce..0000000 --- a/Fluent/user.css +++ /dev/null @@ -1,1675 +0,0 @@ -:root { - --border-radius-1: 8px; - --border-radius-2: 4px; - --border-radius-3: 4px; - --glue-font-weight-normal: 400; - --glue-font-weight-bold: 600; - --glue-font-weight-black: 700; - --scrollbars: unset; - --scrollbar-vertical-size: 8px; - --filter-brightness: 1; - --green: #1db954; -} - -* { - font-family: 'Segoe UI', sans-serif !important; - box-shadow: none !important; - -webkit-mask-repeat: no-repeat; - -webkit-mask-position: center; - -webkit-mask-size: contain; -} - -.Root__main-view { - z-index: 0; - background-color: var(--spice-main); - height: 100%; -} - -.os-scrollbar { - display: var(--scrollbars); -} - -.os-scrollbar-handle { - border-radius: 50px; - background: var(--spice-button-disabled) !important; -} - -.os-theme-spotify>.os-scrollbar-vertical { - margin-right: 2px; -} - -.os-scrollbar-horizontal { - display: none; -} - -.contentSpacing { - max-width: 100vw !important; -} - -.main-home-homeHeader, -.main-actionBarBackground-background { - background-image: none; -} - -.main-actionBarBackground-background, -.main-home-homeHeader, -.x-entityHeader-overlay, -.x-actionBarBackground-background { - background-color: var(--spice-main) !important; -} - -.main-topBar-background, -.main-topBar-overlay { - background-color: var(--spice-topbar) !important; - opacity: 1 !important; -} - -.main-entityHeader-overlay { - background-image: linear-gradient(to bottom, rgb(39 39 39 / 0%), var(--spice-main)); -} - -.x-actionBarBackground-background, -.x-entityHeader-overlay, -.We1fExPHxLIRmV0rZGNo { - background: none !important; -} - - -/* remove dividers */ - -.main-trackList-trackListHeaderRow, -.main-trackCreditsModal-header { - border-bottom: none; -} - -.now-playing-bar-container, -._6e96ad0ba78d75ffb2a0156aa1834a21-scss { - border-top: none; -} - -.main-rootlist-rootlistDivider, -.main-contextMenu-dividerBefore::before, -.main-contextMenu-dividerAfter::after, -.show-episodeList-divider, -.main-rootlist-rootlistDividerContainer { - display: none; -} - - -/* cards */ - -.main-shelf-shelfGrid, -.view-homeShortcutsGrid-grid { - overflow: visible; -} - -.main-cardImage-image, -.main-cardImage-imageWrapper, -.OALAQFKvC7XQOVYpklB4 img { - border-radius: var(--border-radius-2); -} - -.main-card-card, -.x-heroCategoryCard-HeroCategoryCard, -.x-categoryCard-CategoryCard, -.main-heroCard-card, -.OALAQFKvC7XQOVYpklB4 { - border-radius: var(--border-radius-1); -} - -.main-card-card, -.main-heroCard-card, -.x-searchResultsTracks-root>.main-gridContainer-gridContainer, -.main-trackList-indexable, -.view-homeShortcutsGrid-shortcut, -.OALAQFKvC7XQOVYpklB4, -.L4WROPnQ7MPGhylvVyxd { - background-color: var(--spice-card); - box-shadow: 0px 0px 6px 0px var(--spice-layer-shadow) !important; - border: var(--spice-contour) solid 1px; -} - -.main-tag-container { - font-family: "Segoe UI", sans-serif !important; - font-weight: 400; - font-size: 10px; - color: #463d3d !important; -} - -.main-heroCardTag-root, ._8PRqRiYMqnyy_gN_fUD ._AxyaXOKl3GkvT212Vco { - height: 24px; - padding: 12px; - margin-top: 8px; -} - -.ZHE5oMCbrUVXtUWiPmpH { /* tags */ - padding: 12px !important; -} - -.x-categoryCard-title, -.x-heroCategoryCard-heroTitle, -.collection-collectionEntityHeroCard-likedSongs div { - color: var(--spice-alt-text); -} - - -/* transitions */ - -.main-card-card { - transition: background-color 150ms ease; -} - -.link-subtle { - transition-duration: 150ms; -} - - -/* headers */ - -.Root__top-bar { - position: absolute !important; - width: 100vw !important; - grid-area: none; - z-index: 4 !important; -} - -.main-topBar-container { - max-width: 100vw; -} - -.main-entityHeader-withBackgroundImage { - padding: 0 32px 24px; - margin-top: 48px; -} - -.main-entityHeader-title { - font-size: unset; - font-family: 'Segoe UI', sans-serif !important; - font-weight: 500; - overflow: visible !important; -} - -h1, -h2, -h3, -.main-shelf-title, -.main-entityHeader-topbarTitle, -.main-type-canon, -.main-type-bass, -.main-cardHeader-text.main-type-alto, -.x-searchResultsTracks-title { - font-family: 'Segoe UI', sans-serif !important; - font-weight: 500; - letter-spacing: 0.1px !important; - overflow: visible !important; - margin-bottom: 4px; - white-space: normal; -} - -.main-seeAll-link { - margin-bottom: 10px; -} - -.main-topBar-topbarContent { - position: absolute; - display: -webkit-box; - left: 50%; - top: 5px; - transform: translate(-50%, 0%); - padding: 6px; -} - -.queue-tabBar-header { - text-align: center; - min-width: 100px; -} - -.queue-tabBar-headerItemLink { - transition: background-color ease-out 167ms; -} - -.main-topBar-historyButtons button:nth-child(1) { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_arrow_left_24_filled.svg'); - margin-left: 60px; - background-color: var(--spice-text) !important; - padding: 5px; - align-self: center; - width: 24px !important; - height: 24px !important; -} - -.main-topBar-historyButtons button:nth-child(2) { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_arrow_right_24_filled.svg'); - background-color: var(--spice-text) !important; - padding: 5px; - align-self: center; - width: 24px !important; - height: 24px !important; -} - -.main-userWidget-displayName, -.main-userWidget-chevron { - display: none !important; -} - - -/* menus */ - -.main-contextMenu-menuItemButton, -.main-userWidget-dropDownMenuItemButton { - border-radius: var(--border-radius-1); - color: var(--spice-text) !important; - height: 32px; - padding-left: 8px; -} - -.main-contextMenu-menuItem, -._60cb742e518d084c3c959007b9463b51-scss>li { - margin: 2px 6px; -} - -.main-contextMenu-menuItem:first-child, -._60cb742e518d084c3c959007b9463b51-scss> :first-child { - margin: 6px 6px 2px; -} - -.main-contextMenu-menuItem:last-child { - margin: 2px 6px 6px; -} - -._60cb742e518d084c3c959007b9463b51-scss> :last-child { - margin: 2px 6px 8px; -} - -.main-contextMenu-menu, -._60cb742e518d084c3c959007b9463b51-scss { - border-radius: var(--border-radius-1); - border: 1px solid var(--spice-layer-shadow); - background-color: var(--spice-card); -} - -.queue-tabBar-dropdownItemLink { - color: var(--spice-text) !important; -} - - -/* buttons */ - -.icon, .gSLhUO, .hDgDGI { - -webkit-mask-repeat: no-repeat; - -webkit-mask-position: center; - margin: auto; - display: block; -} - -.main-navBar-navBarLink .gSLhUO path, -.icon > svg, -.x-searchInput-searchInputIconContainer path, -.show-episodeBlock-playerActions svg, -.main-playButton-PlayButton polygon, -.main-playButton-PlayButton rect { - display: none !important; -} - -.home-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_home_24_regular.svg'); - background-color: var(--spice-subtext) !important; -} - -.home-active-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_home_24_filled.svg'); - background-color: var(--spice-nav-icon-active) !important; -} - -.search-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_search_24_regular.svg'); - background-color: var(--spice-subtext) !important; -} - -.search-active-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_search_24_filled.svg'); - background-color: var(--spice-nav-icon-active) !important; -} - -.collection-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_library_24_regular.svg'); - background-color: var(--spice-subtext) !important; -} - -.collection-active-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_library_24_filled.svg'); - background-color: var(--spice-nav-icon-active) !important; -} - -.main-navBar-navBarLink[href="/lyrics-plus"] > .collection-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_slide_text_24_regular.svg'); - background-color: var(--spice-subtext) !important; -} - -.main-navBar-navBarLink[href="/lyrics-plus"] > .collection-active-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_slide_text_24_filled.svg'); - background-color: var(--spice-nav-icon-active) !important; -} - -.main-createPlaylistButton-button { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_add_circle_24_regular.svg'); - background-color: var(--spice-subtext) !important; - padding: 0px; - margin: auto; - height: 24px !important; - width: 24px !important; - display: block !important; - margin-top: 20px !important; - margin-bottom: 10px !important; -} - -.main-createPlaylistButton-button svg { - display: none !important; -} - -.main-createPlaylistButton-createPlaylistIcon { - background-color: var(--spice-subtext) !important; - display: block !important; -} - -.main-createPlaylistButton-createPlaylistIcon > svg, .main-createPlaylistButton-text { - display: none !important; -} - -.main-collectionLinkButton-collectionLinkButton { - width: 49px; - min-height: 48px; - margin: auto; - margin-bottom: 14px; - justify-content: center; -} - -.main-collectionLinkButton-collectionLinkButton[href="/collection/tracks"] { - background: linear-gradient(135deg,#450af5,#c4efd9) !important; -} - -.main-collectionLinkButton-collectionLinkButton[href="/collection/episodes"] { - background-color: #006450 !important; -} - -.main-collectionLinkButton-collectionLinkButton[href="/collection/tracks"] .main-collectionLinkButton-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_heart_24_filled.svg'); - background-color: white !important; - margin-right: 0px; -} - -.main-collectionLinkButton-collectionLinkButton[href="/collection/episodes"] .main-collectionLinkButton-icon { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_mic_on_24_filled.svg'); - background-color: #00DA6B !important; - margin-right: 0px; -} - -.main-likedSongsButton-likedSongsIcon, -.main-yourEpisodesButton-yourEpisodesIcon, -.main-collectionLinkButton-collectionLinkText { - display: none !important; -} - - -.main-type-balladBold { - font-family: 'Segoe UI', sans-serif !important; - font-weight: 500; - letter-spacing: 0.2px; -} - -.main-type-minuetBold { - text-transform: none; - letter-spacing: 0px; - font-weight: 400; - font-size: 14px; - line-height: 0px; -} - -.main-shelf-seeAll { - height: 21px; -} - -style { - --nav-bar-width: 62px !important; -} - -.main-playButton-PlayButton.main-playButton-primary, -.main-pageErrorTemplate-errorButton { - color: var(--spice-shadow); -} - -button.switch { - background-color: transparent !important; -} - -#spicetify-home-config button, -#spicetify-sidebar-config button { - background-color: var(--spice-main) !important; - color: var(--spice-text) !important; - border: none !important; -} - -#spicetify-home-config button { - border-radius: var(--border-radius-2) !important; -} - -#spicetify-sidebar-config button { - border-radius: var(--border-radius-3) !important; -} - -#spicetify-home-config button:disabled, -#spicetify-sidebar-config button:disabled { - background-color: var(--spice-button-disabled) !important; - color: var(--spice-text) !important; -} - -.main-buttons-button, -.show-followButton-button { - background-color: var(--spice-card); - font-family: "Segoe UI", sans-serif; - font-weight: normal; - font-size: 15px; - letter-spacing: 0px; - text-transform: none; - border-radius: var(--border-radius-2); - -webkit-font-smoothing: subpixel-antialiased; -} - -.main-button-outlined, -.main-button-outlined:hover { - border: var(--spice-contour) solid 1px !important; -} - -.main-button-primary { - background-color: var(--spice-accent); - color: black; -} - -.main-button-outlined { - background-color: var(--spice-card); -} - -.main-button-secondary { - color: var(--spice-text); -} - -.main-entityHeader-titleButton { - background: none !important; -} - -.x-carousel-button, -.x-removeButton-RemoveButton { - background-color: var(--spice-card); -} - -.x-carousel-button svg { - fill: var(--spice-text) !important; -} - -/* sidebar */ - -.Root__nav-bar { - z-index: 1 !important; - max-width: 85px !important; - height: calc(100% + 107px); - padding-bottom: 127px; -} - -.main-navBar-navBar { - width: 85px !important; -} - -.main-navBar-navBarLink { - border-radius: var(--border-radius-2); - color: var(--spice-text); - height: 65px !important; - display: block; - padding-top: 12px; - padding-left: 0px; - padding-right: 0px; - margin-bottom: 4px; -} - -.main-navBar-navBarLink>span, -.main-createPlaylistButton-text { - overflow: visible; - font-size: 12px !important; - margin: auto; - display: block; - text-align: center; - margin-top: 4px; - white-space: pre; - color: var(--spice-subtext); -} - -.main-navBar-navBarLinkActive > .icon, -.main-navBar-navBarLinkActive .gSLhUO, -.main-navBar-navBarLinkActive > .hDgDGI { - position: relative; - top: 50%; - transform: translate(0, -50%); - margin: auto; -} - -.main-navBar-navBarLinkActive { - padding: 0px; -} - -.main-navBar-entryPoints { - padding-top: 36px !important; -} - -.main-type-mestoBold { - font-family: 'Segoe UI', sans-serif !important; - font-weight: normal !important; -} - -.navBar-navBarLink-accent { - position: relative; - width: 4px; - height: 25px; - background-color: var(--spice-accent); - border-radius: var(--border-radius-2); - bottom: 3px; - display: none; -} - -.main-navBar-navBarLinkActive>.navBar-navBarLink-accent { - display: block !important; -} - -.main-navBar-navBarLink:hover { - background-color: rgba(var(--spice-rgb-selected-row), 0.3); -} - -.main-navBar-navBarLink:active { - background-color: rgba(var(--spice-rgb-selected-row), 0.5); -} - -.main-navBar-navBarLinkActive, -.main-navBar-navBarLinkActive:hover, -.main-navBar-navBarLinkActive:active, -.main-navBar-navBarLinkActive:focus { - background-color: var(--spice-selected-row); - color: var(--spice-not-selected); - transition: 167ms ease-out all; -} - -.main-navBar-navBarLink { - transition: background-color ease-out 167ms; -} - -.main-navBar-navBarLinkActive>span.ellipsis-one-line { - display: none; -} - - -/* playlist sidebar */ - -.main-rootlist-rootlist .os-content { - padding: 0px 0px !important; -} - -.main-rootlist-rootlist { - --left-sidebar-item-height: 48px; - --left-sidebar-padding-left: 18px; - --left-sidebar-padding-right: 18px; -} - -.main-rootlist-rootlistItemLink { - padding: 8px; -} - -.main-rootlist-rootlistItemLink:link, -.main-rootlist-rootlistItemLink:visited, -.main-rootlist-rootlistPlaylistHeader { - color: var(--spice-text); - background-color: var(--spice-card); - background-size: cover; - border-radius: var(--border-radius-2); - margin-bottom: 14px; -} - -.main-rootlist-textWrapper { - display: none; -} - - -.main-rootlist-statusIcons { - right: 17px !important; - top: -4px; -} - -.main-rootlist-rootlistItemLinkActive~.main-rootlist-expandArrow:focus, -.main-rootlist-rootlistItemLinkActive~.main-rootlist-expandArrow:hover, -.main-rootlist-rootlistItemLinkActive~.main-rootlist-expandArrow { - color: var(--spice-text); -} - -.main-rootlist-expandArrow { - color: var(--spice-text); - position: relative; - margin-inline-start: -32px; - padding: 8px; - right: -17px; - top: -1px; -} - -.main-rootlist-expandArrowRotated { - right: -5px !important; - top: 14px !important; -} - -.main-rootlist-statusIcons { - margin-inline-start: -24px; - position: relative; - right: 8px; -} - -.main-rootlist-rootlistItemLink:hover, -.main-createPlaylistButton-button:hover, -.main-collectionLinkButton-collectionLinkButton:hover { - filter: brightness(50%); -} - -.main-rootlist-statusIcons>button { - color: var(--spice-text); -} - -.main-rootlist-rootlistItemLinkActive~.main-rootlist-statusIcons>button { - color: var(--spice-shadow); -} - -/* tracklist */ - -.main-trackList-indexable .main-virtualScrollList-wrapper, -.main-trackList-indexable .main-rootlist-wrapper { - background-color: var(--spice-card); - border-radius: var(--border-radius-2); - padding: 8px; -} - -.main-trackList-indexable { - padding: 8px; - padding-bottom: 24px; -} - -.main-trackList-trackListHeader.g9n_9K5pFI3B_JuDI_hS { - padding: 0px; - margin: 0px; - border-bottom: none; - background: var(--spice-card); -} - -.main-trackList-trackListRow { - border-radius: var(--border-radius-2); -} - -.main-trackList-trackListRow:hover { - background-color: rgba(var(--spice-rgb-selected-row), .05); -} - -.main-trackList-trackListRow:active { - background-color: rgba(var(--spice-rgb-selected-row), .1); -} - -.main-trackList-trackListRow.main-trackList-selected, -.main-trackList-trackListRow.main-trackList-selected:hover { - background-color: var(--spice-selected-row); -} - -.main-trackList-trackListRow.main-trackList-selected .main-tag-container, -.main-trackList-trackListRow.main-trackList-selected:hover .main-tag-container, -.main-trackList-trackListRow.main-trackList-selected:active .main-tag-container, -.main-trackList-trackListRow.main-trackList-selected:focus .main-tag-container { - color: var(--spice-text) !important; - background-color: var(--spice-shadow); -} - -.main-tag-container, -.main-trackList-rowImage { - border-radius: var(--border-radius-3); -} - -.main-trackList-rowTitle { - color: var(--spice-text) !important; -} - -.main-trackList-trackListRow.main-trackList-selected span, -.main-trackList-trackListRow.main-trackList-selected:hover span, -.main-trackList-trackListRow.main-trackList-selected:active span, -.main-trackList-trackListRow.main-trackList-selected:focus span, -.main-trackList-trackListRow.main-trackList-selected a, -.main-trackList-trackListRow.main-trackList-selected:hover a, -.main-trackList-trackListRow.main-trackList-selected:active a, -.main-trackList-trackListRow.main-trackList-selected:focus a, -.main-trackList-trackListRow.main-trackList-selected button, -.main-trackList-trackListRow.main-trackList-selected:hover button, -.main-trackList-trackListRow.main-trackList-selected:active button, -.main-trackList-trackListRow.main-trackList-selected:focus button, -.main-trackList-trackListRow.main-trackList-selected div, -.main-trackList-trackListRow.main-trackList-selected:hover div, -.main-trackList-trackListRow.main-trackList-selected:active div, -.main-trackList-trackListRow.main-trackList-selected:focus div { - color: var(--spice-text) !important; -} - -.main-trackList-trackListHeader { - margin-bottom: 8px; -} - -._110dbc41d89af63f97cdd8b7cd7fea47-scss { - border: 1px solid var(--spice-text); -} - -.main-trackList-trackListRow.main-trackList-selected ._110dbc41d89af63f97cdd8b7cd7fea47-scss, -.main-trackList-trackListRow.main-trackList-selected:hover ._110dbc41d89af63f97cdd8b7cd7fea47-scss, -.main-trackList-trackListRow.main-trackList-selected:active ._110dbc41d89af63f97cdd8b7cd7fea47-scss, -.main-trackList-trackListRow.main-trackList-selected:focus ._110dbc41d89af63f97cdd8b7cd7fea47-scss, -.main-trackList-trackListRow.main-trackList-selected .main-button-outlined { - border: 1px solid var(--spice-text); -} - -.main-trackList-trackListHeaderStuck.main-trackList-trackListHeader { - border-bottom: none; -} - -.main-trackList-statusChangeUp { - color: var(--green); -} - -/* big thanks to CharlieS and harbassan for providing the svg */ -.main-trackList-playingIcon, .WBTm60_TPRG_oYwBuS7_ { - -webkit-mask-image: url("data:image/svg+xml,%3Csvg id='playing-icon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3Cstyle%3E %23playing-icon %7B fill: %2320BC54; %7D @keyframes play %7B 0%25 %7Btransform: scaleY(1);%7D 3.3%25 %7Btransform: scaleY(0.9583);%7D 6.6%25 %7Btransform: scaleY(0.9166);%7D 9.9%25 %7Btransform: scaleY(0.8333);%7D 13.3%25 %7Btransform: scaleY(0.7083);%7D 16.6%25 %7Btransform: scaleY(0.5416);%7D 19.9%25 %7Btransform: scaleY(0.4166);%7D 23.3%25 %7Btransform: scaleY(0.25);%7D 26.6%25 %7Btransform: scaleY(0.1666);%7D 29.9%25 %7Btransform: scaleY(0.125);%7D 33.3%25 %7Btransform: scaleY(0.125);%7D 36.6%25 %7Btransform: scaleY(0.1666);%7D 39.9%25 %7Btransform: scaleY(0.1666);%7D 43.3%25 %7Btransform: scaleY(0.2083);%7D 46.6%25 %7Btransform: scaleY(0.2916);%7D 49.9%25 %7Btransform: scaleY(0.375);%7D 53.3%25 %7Btransform: scaleY(0.5);%7D 56.6%25 %7Btransform: scaleY(0.5833);%7D 59.9%25 %7Btransform: scaleY(0.625);%7D 63.3%25 %7Btransform: scaleY(0.6666);%7D 66.6%25 %7Btransform: scaleY(0.6666);%7D 69.9%25 %7Btransform: scaleY(0.6666);%7D 73.3%25 %7Btransform: scaleY(0.6666);%7D 76.6%25 %7Btransform: scaleY(0.7083);%7D 79.9%25 %7Btransform: scaleY(0.75);%7D 83.3%25 %7Btransform: scaleY(0.8333);%7D 86.6%25 %7Btransform: scaleY(0.875);%7D 89.9%25 %7Btransform: scaleY(0.9166);%7D 93.3%25 %7Btransform: scaleY(0.9583);%7D 96.6%25 %7Btransform: scaleY(1);%7D %7D %23bar1 %7B transform-origin: bottom; animation: play 0.9s -0.51s infinite; %7D %23bar2 %7B transform-origin: bottom; animation: play 0.9s infinite; %7D %23bar3 %7B transform-origin: bottom; animation: play 0.9s -0.15s infinite; %7D %23bar4 %7B transform-origin: bottom; animation: play 0.9s -0.75s infinite; %7D %3C/style%3E%3C/defs%3E%3Ctitle%3Eplaying-icon%3C/title%3E%3Crect id='bar1' class='cls-1' width='4' height='24'/%3E%3Crect id='bar2' class='cls-1' x='6' width='4' height='24'/%3E%3Crect id='bar3' class='cls-1' x='12' width='4' height='24'/%3E%3Crect id='bar4' class='cls-1' x='18' width='4' height='24'/%3E%3C/svg%3E"); - background: var(--spice-text); - content-visibility: hidden; -} - -.main-trackList-selected .main-trackList-playingIcon { - background: var(--spice-shadow); -} - -.main-trackList-rowImageWithPlay .main-trackList-rowPlayPauseButton { - width: 24px; - height: 24px; -} - -/* headers */ - -.main-entityHeader-image:not(.main-entityHeader-circle) { - border-radius: var(--border-radius-1); -} - -.x-sortBox-sortDropdown, -.x-filterBox-filterInput, -.x-filterBox-expandButton:focus, -.x-filterBox-expandButton:hover { - border-radius: var(--border-radius-2) !important; -} - -.x-sortBox-sortDropdown { - color: var(--spice-text); -} - -.main-actionBar-ActionBarRow>button:not(:first-child), -.x-actionBar-ActionButtonsRow>div>button { - color: var(--spice-text); -} - -.main-actionBar-ActionBarRow span { - color: var(--spice-text) !important; -} - -.fIDrcz, .ghlXvf { - fill: var(--spice-text); -} - -.main-navBar-navBar .fIDrcz { - fill: var(--spice-alt-text); -} - -.x-filterBox-filterInput { - background-color: var(--spice-card); - color: var(--spice-text); -} - -.x-emptyState-container { - height: auto; - margin-top: 120px; -} - -/* artist page */ - -.artist-artistOverview-heading, -.artist-artistPick-heading, -.J6CYfp0Tj6MkWJCdssuA, -.artist-artistAbout-heading { - margin-bottom: 20px !important; -} - -.artist-artistPick-pinnedImage, -.artist-artistOffers-item { - border-radius: var(--border-radius-2) !important; -} - -.artist-artistAbout-container, -.main-entityHeader-background, -.main-entityHeader-background.main-entityHeader-overlay { - border-radius: var(--border-radius-1); -} - -.main-entityHeader-background.main-entityHeader-overlay, -.wQi0raQMEJJrELuj_2FP.main-entityHeader-overlay { - --bgColor: transparent !important; - background: none; -} - -.artist-artistOffers-item:hover { - background-color: rgba(var(--spice-rgb-selected-row), .05) !important; -} - -.artist-artistOffers-item:active { - background-color: rgba(var(--spice-rgb-selected-row), .1) !important; -} - -.main-entityHeader-background, .wQi0raQMEJJrELuj_2FP._dsx4Y9jukDHLzhl7bQb { - transform: scale(1) !important; - margin-top: 48px; -} - -[class="main-entityHeader-backgroundColor"] { - opacity: min(calc(var(--filter-brightness) + 0.4), 1); -} - -.main-entityHeader-container { - background-image: linear-gradient(to bottom, rgb(255 255 255 / 0%), var(--spice-main)); -} - -.main-entityHeader-metaDataText, -.main-entityTitle-subtitle, -.main-entityHeader-metaDataText span { - color: var(--spice-text) !important; -} - - -/* podcasts */ - -.show-trailer-container, -.show-episodeBlock-episodeBlock, -.show-show-episodes> :last-child { - border-radius: var(--border-radius-1) !important; -} - -.show-episodeBlock-episodeBlock:hover { - background-color: rgba(var(--spice-rgb-selected-row), .05); -} - -.show-episodeBlock-episodeBlock:active { - background-color: rgba(var(--spice-rgb-selected-row), .1); -} - -.show-show-episodes> :last-child { - padding: 8px 24px; -} - -.show-trailer-container, -.show-show-episodes> :last-child { - background-color: var(--spice-card) !important; -} - - -/* top bar */ - -.main-topBar-button, -.main-userWidget-box { - background-color: var(--spice-sidebar); -} - -.main-entityHeader-topbarTitle, -.main-topBar-topbarTitle { - font-size: 16px; - font-family: 'Segoe UI', sans-serif !important; - font-weight: 400; - padding-left: 4px; - position: relative; - top: 5px; -} - -.main-playButton-PlayButton.main-playButton-primary { - padding: 12px; - padding-bottom: 0px; - padding-top: 0px; - height: auto; -} - -.main-topBar-topbarContent>.main-playButton-PlayButton.main-playButton-primary { - margin-top: 10px; -} - - -/* tab bars */ - -a[class*='-tabBar-active'] { - background-color: rgba(var(--spice-rgb-selected-row), 1) !important; -} - -a[class*='-tabBar-headerItemLink']:hover { - background-color: rgba(var(--spice-rgb-selected-row), 0.3); -} - -a[class*='-tabBar-headerItemLink']:active { - background-color: rgba(var(--spice-rgb-selected-row), 0.5); -} - - -/* search */ - -.x-searchInput-searchInputInput, -.dIwMadpRrW1PwEwEeAbN, -.G9iUss4eOSpJyn2VBzsS { - background-color: var(--spice-card); - color: var(--spice-text) !important; - border-radius: var(--border-radius-2) !important; - padding-right: 0px; - padding-left: 12px; - transition: background-color ease-in 167ms; -} - -.x-searchInput-searchInputInput:focus, -.dIwMadpRrW1PwEwEeAbN:focus, -.G9iUss4eOSpJyn2VBzsS:focus { - background-color: var(--spice-main); - border-bottom: var(--spice-accent) solid 2px; -} - -.x-searchInput-searchInput, ._UTWTgKCqE8eruFNFAMf { - -webkit-box-flex: 1; - width: 40vw; -} - -.x-searchInput-searchInputIconContainer, -._6e_T5d5DVIdzLw3pCIw { - flex-direction: row-reverse; -} - -.c16n2m346Ss2TcRUx8Bw { - flex: 0 !important; -} - -.x-searchInput-searchInputSearchIcon, -.c16n2m346Ss2TcRUx8Bw .BDcKgSW_ys9_Hj2DwDBW { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_search_16_regular.svg'); - background-color: var(--spice-subtext) !important; - flex: 0; - transform: scaleX(-1); - height: 16px; - width: 16px; -} - -.BDcKgSW_ys9_Hj2DwDBW path { - display: none; -} - -.x-searchInput-searchInputClearButton, -.g7ggq46CbOli19ZxJlQe .BDcKgSW_ys9_Hj2DwDBW { - margin-left: 5px; - margin-right: 12px; - height: 20px; -} - -.x-searchInput-searchInputClearButton path, -.g7ggq46CbOli19ZxJlQe .BDcKgSW_ys9_Hj2DwDBW path { - display: block !important; - stroke: var(--spice-subtext) !important; - stroke-width: 1.3px; -} - -.x-searchInput-searchInputClearButton svg, -.g7ggq46CbOli19ZxJlQe .BDcKgSW_ys9_Hj2DwDBW svg { - padding: 3px; -} - -.x-searchInput-searchInputSearchIcon, -.x-searchInput-searchInputInput::placeholder, -.x-searchInput-searchInputClearButton { - color: var(--spice-text) !important; -} - -.x-searchResultsTracks-root .main-gridContainer-gridContainer { - padding: 8px; -} - -.main-heroCard-card, -.x-searchResultsTracks-root .main-gridContainer-gridContainer { - background-color: var(--spice-card); - border-radius: var(--border-radius-1); -} - - -/* error */ - -path[d="M23 0C10.298 0 0 10.297 0 23c0 12.702 10.298 23 23 23 12.703 0 23-10.298 23-23C46 10.297 35.703 0 23 0zm0 44C11.421 44 2 34.579 2 23S11.42 2 23 2c11.579 0 21 9.42 21 21 0 11.579-9.42 21-21 21zm1.872-32.065l-.8 16.192h-2.144l-.832-16.192h3.776zm-3.968 20.768c0-.576.203-1.072.608-1.488a1.979 1.979 0 011.472-.624c.576 0 1.072.208 1.488.624.416.416.624.912.624 1.488s-.208 1.067-.624 1.472a2.056 2.056 0 01-1.488.608 2.006 2.006 0 01-1.472-.608 2.002 2.002 0 01-.608-1.472z"], -.spoticon-warning-64::before { - color: var(--spice-notification-error); -} - - -/* modals */ - -.GenericModal__overlay { - background-color: rgba(0, 0, 0, 0.6) -} - -.main-trackCreditsModal-container, -.main-aboutRecsModal-container, -.main-playlistEditDetailsModal-container, -.profile-userEditDetails-container, -.artist-artistAbout-modal { - background-color: var(--spice-main) !important; - border-radius: var(--border-radius-1) !important; -} - -.main-playlistEditDetailsModal-titleInput, -.main-playlistEditDetailsModal-descriptionTextarea, -.main-playlistEditDetailsModal-titleInput:focus, -.main-playlistEditDetailsModal-descriptionTextarea:focus, -.playlist-inlineSearchBox-filterInput { - background-color: var(--spice-card); -} - -.profile-userEditDetails-nameInput, -.profile-userEditDetails-textElement:focus { - background: var(--spice-card) !important; -} - -.main-playlistEditDetailsModal-titleInput:focus, -.main-playlistEditDetailsModal-descriptionTextarea:focus, -.profile-userEditDetails-textElement:focus, -.playlist-inlineSearchBox-filterInput:focus { - border: 1px solid var(--spice-button-active) !important; -} - -.playlist-inlineSearchBox-filterInput { - border: 1px solid var(--spice-card); -} - -.main-playlistEditDetailsModal-titleInput, -.main-playlistEditDetailsModal-descriptionTextarea, -.profile-userEditDetails-nameInput, -.playlist-inlineSearchBox-filterInput { - border-radius: var(--border-radius-2) !important; -} - -.profile-userEditDetails-labelText:before { - bottom: 8px !important; -} - -.main-playlistEditDetailsModal-titleInput::placeholder, -.main-playlistEditDetailsModal-descriptionTextarea::placeholder { - color: var(--spice-text); -} - -.main-editImageButton-overlay { - background-color: rgba(var(--spice-rgb-card), 0.7); -} - - -/* dialogs */ - -.main-deletePlaylistDialog-container, -.main-deleteFolderDialog-container { - background-color: var(--spice-card); - color: var(--spice-text); - border-radius: var(--border-radius-1); -} - -.main-deletePlaylistDialog-secondaryButton, -.main-deleteFolderDialog-secondaryButton { - color: var(--spice-button); -} - -.main-deletePlaylistDialog-buttonContainer>:last-child, -.main-deleteFolderDialog-buttonContainer>:last-child { - background-color: var(--spice-notification-error); -} - - -/* friend activity */ -.spotify__container--is-desktop.spotify__os--is-windows.buddyfeed-visible .main-topBar-container { - padding-inline-end: 170px; -} - -.main-connectToFacebook-container { - margin-top: 50px; -} - -.main-connectToFacebook-text, -.main-connectToFacebook-disclaimer, -.main-connectToFacebook-headerTitle, -.main-addFriendsView-headerText p { - color: var(--spice-text); -} - -.main-addFriendsView-header { - margin-top: 16px; - border-bottom: 1px solid var(--spice-selected-row) !important; -} - -.main-addFriendsView-facebookIconWrapper { - background-color: #008AFF !important; -} - -.main-addFriendsView-filterInput { - background-color: var(--spice-card) !important; - color: var(--spice-text) !important; -} - -.main-addFriendsView-filterInput::placeholder { - color: var(--spice-text) !important; -} - -.main-buddyFeed-header { - opacity: 1 !important; -} - -.main-buddyFeed-friendsFeedContainer { - margin-top: 25px; -} - -.main-buddyFeed-findFriendsIcon, -.main-buddyFeed-addFriendPlaceholderIcon { - color: var(--spice-text) !important; -} - -.main-buddyFeed-username a { - color: var(--spice-text) !important; -} - -.main-buddyFeed-artistAndTrackName a, -.main-buddyFeed-activityMetadata, -.main-buddyFeed-playbackContextLink { - color: var(--spice-subtext) !important; -} - -.main-buddyFeed-friendActivity { - background-color: var(--spice-card); - border-radius: var(--border-radius-1); - margin: 8px; - padding: 8px 8px 8px 12px; -} - -.main-buddyFeed-addFriendsContainer { - background-color: var(--spice-main); -} - -.main-buddyFeed-buddyFeedRoot, -.main-buddyFeed-buddyFeed { - width: 280px; - z-index: 0; -} - -.main-buddyFeed-buddyFeedRoot .main-avatar-avatar { - margin-right: 8px; -} - -.main-buddyFeed-activityMetadata { - max-width: 190px; -} - -.profile-userOverview-section .main-shelf-shelfGrid { - overflow: hidden; -} - -/* settings */ - -.main-dropDown-dropDown, -option { - background-color: var(--spice-card) !important; - color: var(--spice-text); -} - -.main-dropDown-dropDown { - border-radius: var(--border-radius-2) !important; -} - -.x-toggle-indicator { - background-color: var(--spice-card) !important; -} - -.x-settings-facebookButton, -.main-connectToFacebook-facebookButton { - color: var(--spice-shadow); -} - -.x-toggle-indicatorWrapper { - background-color: rgba(var(--spice-rgb-subtext), .3) !important; -} - -.x-proxySettings-proxyInput { - border-radius: var(--border-radius-2) !important; - background-color: var(--spice-card) !important; -} - -.x-proxySettings-proxyInput::placeholder { - color: var(--spice-subtext); -} - -.x-proxySettings-proxyInput:focus { - border-color: var(--spice-button-active); -} - - -/* connect device menu */ - -._9eb5acf729a98d62135ca21777fef244-scss, -.connect-device-button { - color: var(--spice-shadow); -} - -.connect-device-list-container { - border-radius: var(--border-radius-1); - border: 1px solid var(--spice-button-disabled); -} - -.connect-device-list-item { - margin: 0 8px; - border-radius: var(--border-radius-2); - width: -webkit-fill-available; -} - -.connect-device-list-item:last-child { - margin: 0 8px 8px; -} - -.connect-device-list-item:focus, -.connect-device-list-item:hover { - background-color: rgba(var(--spice-rgb-selected-row), 0.05); -} - -.connect-header { - display: none; -} - -.connect-device-list-item--active, -.connect-device-list-item--active .connect-device-list-item__icon, -.connect-device-list-item--active .connect-device-list-item__device-subtitle { - color: var(--spice-subtext); -} - -.main-connectBar-connectBar { - background-color: var(--spice-accent) !important; - border-radius: 4px; - height: 28px; - width: fit-content; - padding: 8px; - position: absolute; - right: 14px; - bottom: 112px; - color: black !important; - box-shadow: 0px 0px 8px 4px rgba(0, 0, 0, 0.25) !important; -} - -.main-connectBar-connectBar:after { - border-bottom: none !important; -} - -.main-connectBar-connectBar .icon, -.main-connectBar-connectBar .gSLhUO { - margin: 0px; - margin-right: 8px; -} - -/* player */ - -.Root__now-playing-bar { - padding-right: 6px; - margin: 0px 13px 13px 13px; - width: calc(100% - 26px); - box-shadow: 0px 0px 8px 4px rgba(0, 0, 0, 0.25) !important; - border-radius: var(--border-radius-1); - border: 1px solid var(--spice-player-border); -} - -.main-nowPlayingBar-container { - border-radius: var(--border-radius-1); -} - -.gqeP9Y0_y6DLm4CD_m3Q { - border: 0px; - background: none; -} - -.main-nowPlayingBar-container { - border-top: 0px; -} - -.now-playing--cover-expanded { - transform: translateX(0px) !important; -} - -.playback-bar, -.progress-bar, -.progress-bar__fg_wrapper, -.lRNLjBiX_H7SPYbkJKLp, -.lIrtJi5Y_8ENU19VSvJO { - --fg-color: var(--spice-accent) !important; - --is-active-fg-color: var(--spice-accent) !important; - --bg-color: var(--spice-player-bar-bg); -} - -/* Progress bar tooltip: - * I think it makes sense to just remove the tooltip, given that the labels on the progress bar provide the exact same info. - * Regardless, this style will prevent the text from pushing the player controls uncomfortably close to the top of the player bar. -*/ -.prog-tooltip { - width: 140px; - overflow: hidden; - display: none; -} - -.progress-bar__slider, -.giO6cIQ8auPNZuTvC4Y8 { - background-color: var(--spice-selected-row) !important; - border: 6px solid var(--spice-selected-row); - box-shadow: 0 0 3px 0 var(--spice-player-bar-shadow) !important; - box-sizing: content-box !important; - width: 10px; - height: 10px; - opacity: 1 !important; - display: block; - margin-left: -10px; -} - -.slider-dot { - width: 3px; - height: 3px; - background-color: var(--spice-accent); - position: relative; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - border: 5px solid var(--spice-accent); - border-radius: 50%; - transition: border-width 75ms ease; -} - -.progress-bar__slider:hover .slider-dot:not(:hover) { - border-width: 7px; -} - -.slider-dot:hover { - border-width: 7px; -} - -.progress-bar__slider:active .slider-dot:not(:active) { - border-width: 4px !important; -} - -.slider-dot:active { - border-width: 4px !important; -} - -.main-nowPlayingWidget-nowPlaying>.ellipsis-one-line, -.main-trackInfo-container { - margin-left: 74px; -} - -.main-coverSlotExpanded-container, -.T6whS8zYB9fG_tIdTg6m { - position: fixed; - top: calc(100% - 320px); - left: calc(100% - 220px); - width: 200px; - height: 200px; - visibility: hidden; - transform-origin: center; - box-shadow: 0px 0px 8px 4px rgba(0, 0, 0, 0.5) !important; - animation: 1s coverExpandedIn; - animation-fill-mode: forwards; - background: none; -} - -.main-coverSlotExpanded-containerExitActive { - display: none; -} - -@keyframes coverExpandedIn { - 99% { - visibility: hidden; - } - 100% { - visibility: visible; - } -} - -@keyframes coverExpandedOut { - 99% { - visibility: visible; - } - 100% { - visibility: hidden; - } -} - -.main-coverSlotCollapsed-container, -.zcsxy3fvYCmZGcE7VzW7 { - position: fixed; - top: -12px; - left: 0px; - width: 56px; - height: 56px; - visibility: visible; - z-index: 99999 !important; -} - -.main-coverSlotCollapsed-container, -.cover-art .cover-art-image, -.zcsxy3fvYCmZGcE7VzW7 { - transform-origin: center; - transition-timing-function: ease-in; - transition: width 0.5s 0.2s, height 0.5s 0.2s, top 0.3s, left 0.5s, box-shadow 0.5s; -} - -.main-coverSlotCollapsed-container[aria-hidden="true"], -.zcsxy3fvYCmZGcE7VzW7[aria-hidden="true"] { - left: calc(100vw - 178px); - top: -245px; - width: 200px; - height: 200px; - visibility: hidden; - box-shadow: 0px 0px 8px 4px rgba(0, 0, 0, 0.5) !important; - animation: 1s coverExpandedOut; -} - -.main-coverSlotCollapsed-container[aria-hidden="false"], -.zcsxy3fvYCmZGcE7VzW7[aria-hidden="false"] { - transition-timing-function: ease-out !important; - transition: width 0.5s 0.2s, height 0.5s 0.2s, top 0.5s 0.1s, left 0.3s, box-shadow 0.5s !important; -} - -.main-coverSlotCollapsed-container[aria-hidden="true"] .cover-art .cover-art-image, -.main-nowPlayingWidget-coverExpanded .zcsxy3fvYCmZGcE7VzW7 .cover-art .cover-art-image { - width: 200px; - height: 200px; -} - -.CoverSlotExpanded__actionButton, -.main-coverSlotCollapsed-expandButton, -.CoverSlotExpanded__actionButton:hover, -.main-coverSlotCollapsed-expandButton:hover, -.kyn0AY4_gXWvbdivdFgP, -.kyn0AY4_gXWvbdivdFgP:hover { - background-color: var(--spice-card); -} - -.now-playing-bar .cover-art-image { - border-radius: var(--border-radius-2); -} - -.playback-bar__progress-time, -.main-playbackBarRemainingTime-container { - color: var(--spice-text) !important; -} - -.progress-bar--is-active .progress-bar__slider:focus { - background-color: var(--spice-accent); -} - -.volume-bar { - margin-right: 8px; -} - -.main-playPauseButton-button, -.player-controls__buttons button:not(.main-playPauseButton-button) { - --button-size: 28px !important; -} - -.main-seekBack15sButton-button, -.main-seekForward15sButton-button, -.main-speedControlsButton-button { - height: auto; - color: var(--spice-button); -} - -.main-playPauseButton-button svg { - height: 24px; - width: 24px; -} - -.player-controls__buttons { - margin-bottom: 8px; - align-items: center; -} - -.player-controls__buttons path { - display: none !important; -} - -.player-controls__left, .player-controls__right { - margin-top: 2px; -} - -.player-controls__buttons button { - padding-left: 20px; - padding-right: 20px; -} - -.main-skipForwardButton-button { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_next_24_filled.svg'); - background-color: var(--spice-text) !important; - height: 22px !important; -} - -.main-skipBackButton-button { - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_previous_24_filled.svg'); - background-color: var(--spice-text) !important; - height: 22px !important; -} - -.j4TkiByCgwfJawuHfzsd { /* Skip back 15 sec */ - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_skip_backward_15_24_filled.svg'); - background-color: var(--spice-text) !important; - height: 22px !important; -} - -.Kvxb6GUtWNNo5mFeKfMn { /* Skip forward 15 sec */ - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_skip_forward_15_24_filled.svg'); - background-color: var(--spice-text) !important; - height: 22px !important; -} - -.Y0lBew4O9_Ma84_Lnnsq { /* Speed icon for podcasts */ - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_top_speed_24_filled.svg'); - background-color: var(--spice-text) !important; - height: 22px !important; -} - -/* Disabled */ -.main-repeatButton-button[aria-checked="false"]{ - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_arrow_repeat_all_off_24_regular.svg'); - background-color: var(--spice-subtext) !important; - height: 22px !important; -} -/* Repeat one */ -.main-repeatButton-button[aria-checked="mixed"]{ - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_arrow_repeat_all_once_24_filled.svg') !important; - background-color: var(--spice-text) !important; - height: 22px !important; -} -/* Repeat all */ -.main-repeatButton-button[aria-checked="true"]{ - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_arrow_repeat_all_24_filled.svg'); - background-color: var(--spice-text) !important; - height: 22px !important; -} - -/* Shuffle disabled */ -.main-shuffleButton-button { - -webkit-mask-image: url('./phosphor-icons/shuffle.svg'); - background-color: var(--spice-subtext) !important; - height: 22px !important; -} -/* Shuffle enabled */ -.main-shuffleButton-button[aria-checked="true"] { - -webkit-mask-image: url('./phosphor-icons/shuffle-bold.svg'); - background-color: var(--spice-text) !important; - height: 22px !important; -} - -/*Like button*/ -.control-button-heart[aria-checked=true] { - color: var(--spice-accent); -} - -/* ads */ - -.main-leaderboardComponent-container, -.main-billboardComponent-footer, -.k6onUQZSeZIsonJ4cSpK { - display: none; -} - -.desktoproutes-homepage-takeover-ad-hptoComponent-parentContainer, -.desktoproutes-homepage-takeover-ad-hptoComponent-container, -.snMc3rl8H2pM9cqkTpQ6 { - display: none !important; -} - -.main-topBar-UpgradeButton { - display: none !important; -} - - -/* play buttons */ - -.main-playButton-button, -.main-playButton-PlayButton, -.main-trackList-rowPlayPauseButton{ - background-color: var(--spice-text) !important; - -webkit-mask-image: url('./fluentui-system-icons/ic_fluent_play_24_filled.svg'); -} - - -/* spicetify */ - -#spicetify-sidebar-config { - flex-direction: column; - top: -60px !important; -} - -#spicetify-show-list >* { - padding: 0px; -} - -/* spicetify extensions */ - -.main-topBar-button[title="Popup Lyrics"], -.main-topBar-button[title="Full App Display"], -.main-topBar-button[title="Bookmark"] { - background-color: var(--spice-card) !important; -} - -.contentSpacing div[role="search"] > div > span { - margin-right: auto; - flex: 0; -} diff --git a/README.md b/README.md index 5a0ac50..9f0cdc0 100644 --- a/README.md +++ b/README.md @@ -9,7 +9,7 @@ You can add your own theme simply by opening a Pull Request (more info in [CONTR ## Notes: * **These themes require you to have the latest version of Spotify and Spicetify.** -* **To install Dribbblish, Turntable and Fluent themes - follow the instructions in their READMEs**. +* **To install Dribbblish and Turntable themes, follow the instructions in their READMEs**. * **Spotify ad-blocked version is not supported.** ## Installation and usage diff --git a/THEMES.md b/THEMES.md index 93d1e8e..657b738 100644 --- a/THEMES.md +++ b/THEMES.md @@ -64,16 +64,6 @@ Here you can find a preview of all the themes. Some of them may have different c ![samourai](Dribbblish/samourai.png) -## Fluent - -#### Dark - -![dark](Fluent/screenshots/dark-1.png) - -#### Light - -![light](Fluent/screenshots/light-1.png) - ## Glaze ### Base