feat(Fluent): add Fluent theme

This commit is contained in:
williamckha 2021-08-13 12:22:47 -07:00
parent 519198d17b
commit 80f21b264f
34 changed files with 1836 additions and 0 deletions

22
Fluent/LICENSE Normal file
View File

@ -0,0 +1,22 @@
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.

58
Fluent/README.md Normal file
View File

@ -0,0 +1,58 @@
# Fluent
## Screenshots
### Dark
![dark-1](screenshots/dark-1.png)
![dark-2](screenshots/dark-2.png)
### Light
![light-1](screenshots/light-1.png)
## More
### About
[Spicetify](https://github.com/khanhas/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
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
```
### Customization
Two color schemes are available: `light` or `dark`. Change scheme with commands:
```
spicetify config color_scheme <scheme_name>
spicetify apply
```
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.

View File

@ -0,0 +1,21 @@
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.

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM12 3.5C7.30558 3.5 3.5 7.30558 3.5 12C3.5 16.6944 7.30558 20.5 12 20.5C16.6944 20.5 20.5 16.6944 20.5 12C20.5 7.30558 16.6944 3.5 12 3.5ZM12 7C12.4142 7 12.75 7.33579 12.75 7.75V11.25H16.25C16.6642 11.25 17 11.5858 17 12C17 12.4142 16.6642 12.75 16.25 12.75H12.75V16.25C12.75 16.6642 12.4142 17 12 17C11.5858 17 11.25 16.6642 11.25 16.25V12.75H7.75C7.33579 12.75 7 12.4142 7 12C7 11.5858 7.33579 11.25 7.75 11.25H11.25V7.75C11.25 7.33579 11.5858 7 12 7Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 697 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.2954 19.7162C10.6888 20.1038 11.322 20.0991 11.7096 19.7057C12.0972 19.3123 12.0925 18.6792 11.6991 18.2915L6.32876 13.0001H19.9999C20.5522 13.0001 20.9999 12.5524 20.9999 12.0001C20.9999 11.4479 20.5522 11.0001 19.9999 11.0001H6.33536L11.6991 5.71525C12.0925 5.32763 12.0972 4.69448 11.7096 4.30108C11.322 3.90767 10.6888 3.90298 10.2954 4.29061L3.37122 11.113C2.87431 11.6026 2.87431 12.4042 3.37122 12.8938L10.2954 19.7162Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 561 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.7123 2.28878L14.6251 2.21113C14.2326 1.90052 13.6607 1.92641 13.2981 2.28878L13.2204 2.37594C12.9096 2.76818 12.9355 3.33963 13.2981 3.702L14.597 4.99899L8.99921 4.99919L8.75859 5.00325C5.00445 5.12998 2 8.21112 2 11.9935C2 13.4382 2.43833 14.7806 3.18863 15.8918C3.37024 16.1432 3.666 16.3068 4 16.3068C4.55228 16.3068 5 15.8594 5 15.3075C5 15.0914 4.93132 14.8912 4.81525 14.7288L4.68008 14.5107C4.24775 13.7716 4 12.9114 4 11.9935C4 9.23444 6.23822 6.99779 8.99921 6.99779L14.595 6.99758L13.2981 8.29497L13.2204 8.38213C12.9096 8.77438 12.9355 9.34582 13.2981 9.7082C13.6886 10.0984 14.3218 10.0984 14.7123 9.7082L17.7175 6.7051L17.7952 6.61794C18.106 6.2257 18.0801 5.65425 17.7175 5.29188L14.7123 2.28878ZM20.7865 8.06013C20.6034 7.82751 20.3191 7.67811 20 7.67811C19.4477 7.67811 19 8.12551 19 8.67741C19 8.88559 19.0637 9.0789 19.1717 9.23841C19.6952 10.0282 20 10.9753 20 11.9935C20 14.7525 17.7618 16.9892 15.0008 16.9892L9.415 16.9886L10.7087 15.6972L10.7923 15.6025C11.0733 15.2408 11.0713 14.7307 10.7864 14.3712L10.7087 14.284L10.6139 14.2004C10.252 13.9196 9.7415 13.9216 9.38169 14.2063L9.29447 14.284L6.28926 17.2871L6.20562 17.3818C5.92465 17.7435 5.92663 18.2536 6.21156 18.6132L6.28926 18.7003L9.29447 21.7034L9.38867 21.7865C9.78097 22.0913 10.3482 22.0636 10.7087 21.7034C11.0713 21.341 11.0972 20.7696 10.7864 20.3773L10.7087 20.2902L9.405 18.9872L15.0008 18.9878L15.2414 18.9837C18.9956 18.857 22 15.7759 22 11.9935C22 10.5336 21.5524 9.17809 20.7868 8.05666L20.7865 8.06013Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.19621 2.14705L3.28033 2.21967L21.7803 20.7197C22.0732 21.0126 22.0732 21.4874 21.7803 21.7803C21.5141 22.0466 21.0974 22.0708 20.8038 21.8529L20.7197 21.7803L17.211 18.2725C16.7749 18.3911 16.3205 18.4656 15.853 18.4906L15.5 18.5H8.564L10.4634 20.3991L10.5305 20.4759C10.7542 20.7699 10.7319 21.1913 10.4634 21.4598C10.1971 21.726 9.78044 21.7502 9.48683 21.5324L9.40271 21.4598L6.22073 18.2778L6.15361 18.201C5.95224 17.9364 5.95023 17.5686 6.14756 17.302L6.22073 17.2171L9.40271 14.0351L9.47951 13.968C9.74409 13.7667 10.1119 13.7646 10.3785 13.962L10.4634 14.0351L10.5305 14.1119C10.7319 14.3765 10.7339 14.7443 10.5365 15.0109L10.4634 15.0958L8.558 17H15.5C15.642 17 15.7825 16.9941 15.9215 16.9825L6.40042 7.46086C4.68788 8.25433 3.5 9.98844 3.5 12C3.5 13.296 3.99309 14.4769 4.80189 15.3652C4.92475 15.4972 5 15.6758 5 15.8718C5 16.286 4.66421 16.6218 4.25 16.6218C4.02803 16.6218 3.82858 16.5254 3.69126 16.3722C2.6407 15.2192 2 13.6844 2 12C2 9.57872 3.32389 7.46665 5.28729 6.34818L2.21967 3.28033C1.92678 2.98744 1.92678 2.51256 2.21967 2.21967C2.48594 1.9534 2.9026 1.9292 3.19621 2.14705ZM19.75 7.37814C19.9691 7.37814 20.1662 7.47209 20.3034 7.62189C21.3571 8.77553 22 10.3127 22 12C22 14.0566 21.0449 15.8901 19.554 17.0812L18.4851 16.0115C19.708 15.1 20.5 13.6425 20.5 12C20.5 10.6939 19.9992 9.50473 19.1791 8.61411C19.0677 8.48435 19 8.31416 19 8.12814C19 7.71393 19.3358 7.37814 19.75 7.37814ZM14.5334 2.40255L14.6102 2.46967L17.7922 5.65165C18.0606 5.92014 18.083 6.34154 17.8593 6.63551L17.7922 6.71231L14.6102 9.89429C14.3173 10.1872 13.8424 10.1872 13.5495 9.89429C13.281 9.62581 13.2587 9.20441 13.4824 8.91043L13.5495 8.83363L15.381 7H9.473L7.99365 5.51943C8.08422 5.51245 8.1753 5.50733 8.26687 5.5041L8.5 5.5L15.5211 5.50003L13.5495 3.53033C13.281 3.26184 13.2587 2.84044 13.4824 2.54647L13.5495 2.46967C13.818 2.20118 14.2394 2.17881 14.5334 2.40255Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M13.7045 4.28377C13.3111 3.89615 12.678 3.90084 12.2904 4.29424C11.9027 4.68765 11.9074 5.3208 12.3008 5.70842L17.6712 10.9998H4C3.44771 10.9998 3 11.4475 3 11.9998C3 12.5521 3.44772 12.9998 4 12.9998H17.6646L12.3008 18.2847C11.9074 18.6723 11.9027 19.3055 12.2904 19.6989C12.678 20.0923 13.3111 20.097 13.7045 19.7094L20.6287 12.887C21.1256 12.3974 21.1256 11.5958 20.6287 11.1062L13.7045 4.28377Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 529 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.4968 3.00195L20.0525 3.00341L20.1734 3.01731L20.2611 3.03685L20.365 3.07133L20.4541 3.11166L20.5179 3.14728L20.5805 3.1888L20.6445 3.2387L20.7076 3.29703L20.802 3.40667L20.8736 3.51791L20.9271 3.63064L20.9624 3.73598L20.9781 3.80116L20.9873 3.85351L20.9983 4.00195V11.5058C20.9983 12.0581 20.5506 12.5058 19.9983 12.5058C19.4854 12.5058 19.0628 12.1198 19.005 11.6225L18.9983 11.5058L18.998 6.41595L4.70611 20.7076C4.34562 21.0681 3.77839 21.0958 3.38611 20.7908L3.2919 20.7076C2.93142 20.3471 2.90371 19.7798 3.20874 19.3876L3.29193 19.2934L17.583 5.00195H12.4968C11.9839 5.00195 11.5612 4.61591 11.5035 4.11857L11.4968 4.00195C11.4968 3.44967 11.9445 3.00195 12.4968 3.00195Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 812 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.7482 3.00098L20.3019 3.00149L20.4022 3.01541L20.501 3.043L20.5613 3.06857C20.6405 3.10341 20.7148 3.15409 20.78 3.21929L20.8207 3.26333L20.8812 3.34481L20.9184 3.40983L20.9571 3.50015L20.9763 3.56427L20.9899 3.62822L20.9992 3.72141L20.9997 11.2549C20.9997 11.6691 20.6639 12.0049 20.2497 12.0049C19.87 12.0049 19.5562 11.7227 19.5066 11.3566L19.4997 11.2549L19.4993 5.55898L4.27966 20.7843C4.01342 21.0506 3.59676 21.0748 3.30313 20.857L3.219 20.7844C2.9527 20.5181 2.92845 20.1015 3.14627 19.8078L3.21888 19.7237L18.4383 4.49998L12.7482 4.50098C12.3685 4.50098 12.0547 4.21882 12.005 3.85275L11.9982 3.75098C11.9982 3.37128 12.2803 3.05749 12.6464 3.00782L12.7482 3.00098Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 808 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.5492 2.53318C11.3872 1.82618 12.6128 1.82618 13.4508 2.53318L20.2008 8.22772C20.7076 8.65523 21 9.28447 21 9.94747V19.7504C21 20.7169 20.2165 21.5004 19.25 21.5004H16.25C15.2835 21.5004 14.5 20.7169 14.5 19.7504V14.7504C14.5 14.3362 14.1642 14.0004 13.75 14.0004H10.25C9.83579 14.0004 9.5 14.3362 9.5 14.7504V19.7504C9.5 20.7169 8.7165 21.5004 7.75 21.5004H4.75C3.7835 21.5004 3 20.7169 3 19.7504V9.94747C3 9.28447 3.29241 8.65523 3.79916 8.22772L10.5492 2.53318Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 598 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.5495 2.53189C11.3874 1.82531 12.6126 1.82531 13.4505 2.5319L20.2005 8.224C20.7074 8.65152 21 9.2809 21 9.94406V19.7468C21 20.7133 20.2165 21.4968 19.25 21.4968H15.75C14.7835 21.4968 14 20.7133 14 19.7468V14.2468C14 14.1088 13.8881 13.9968 13.75 13.9968H10.25C10.1119 13.9968 9.99999 14.1088 9.99999 14.2468V19.7468C9.99999 20.7133 9.2165 21.4968 8.25 21.4968H4.75C3.7835 21.4968 3 20.7133 3 19.7468V9.94406C3 9.2809 3.29255 8.65152 3.79952 8.224L10.5495 2.53189ZM12.4835 3.6786C12.2042 3.44307 11.7958 3.44307 11.5165 3.6786L4.76651 9.37071C4.59752 9.51321 4.5 9.72301 4.5 9.94406V19.7468C4.5 19.8849 4.61193 19.9968 4.75 19.9968H8.25C8.38807 19.9968 8.49999 19.8849 8.49999 19.7468V14.2468C8.49999 13.2803 9.2835 12.4968 10.25 12.4968H13.75C14.7165 12.4968 15.5 13.2803 15.5 14.2468V19.7468C15.5 19.8849 15.6119 19.9968 15.75 19.9968H19.25C19.3881 19.9968 19.5 19.8849 19.5 19.7468V9.94406C19.5 9.72301 19.4025 9.51321 19.2335 9.37071L12.4835 3.6786Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5.5 3C6.328 3 7 3.672 7 4.5V19.5C7 20.328 6.328 21 5.5 21H3.5C2.672 21 2 20.328 2 19.5V4.5C2 3.672 2.672 3 3.5 3H5.5ZM11.5 3C12.328 3 13 3.672 13 4.5V19.5C13 20.328 12.328 21 11.5 21H9.5C8.672 21 8 20.328 8 19.5V4.5C8 3.672 8.672 3 9.5 3H11.5ZM18.781 6.1238L21.995 18.6428C22.201 19.4448 21.718 20.2628 20.915 20.4688L19.039 20.9498C18.236 21.1558 17.419 20.6728 17.213 19.8698L13.999 7.3528C13.793 6.5498 14.276 5.7328 15.079 5.5268L16.955 5.0438C17.758 4.8388 18.575 5.3228 18.781 6.1238Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 622 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4 3H5C6.05382 3 6.91812 3.8164 6.99451 4.85081L7 5V19C7 20.0538 6.1836 20.9181 5.14919 20.9945L5 21H4C2.94618 21 2.08188 20.1836 2.00549 19.1492L2 19V5C2 3.94618 2.8164 3.08188 3.85081 3.00549L4 3H5H4ZM10 3H11C12.0538 3 12.9181 3.8164 12.9945 4.85081L13 5V19C13 20.0538 12.1836 20.9181 11.1492 20.9945L11 21H10C8.94618 21 8.08188 20.1836 8.00549 19.1492L8 19V5C8 3.94618 8.8164 3.08188 9.85081 3.00549L10 3H11H10ZM16.9743 5.0005C17.8138 5.0005 18.5825 5.5311 18.8643 6.34636L18.9113 6.5025L21.9263 18.2485C22.1888 19.2689 21.613 20.3094 20.6295 20.6402L20.4863 20.6825L19.5173 20.9315C19.3513 20.9735 19.1833 20.9945 19.0193 20.9945C18.1807 20.9945 17.4112 20.463 17.1302 19.6476L17.0833 19.4915L14.0673 7.7465C13.8058 6.72514 14.3807 5.68555 15.3649 5.35484L15.5083 5.3125L16.4763 5.0635C16.6423 5.0205 16.8103 5.0005 16.9743 5.0005ZM5 4.5H4C3.75467 4.5 3.55042 4.67778 3.50806 4.91043L3.5 5V19C3.5 19.2444 3.67699 19.4494 3.91016 19.4919L4 19.5H5C5.24533 19.5 5.44958 19.3222 5.49194 19.0896L5.5 19V5C5.5 4.75556 5.32301 4.55062 5.08984 4.50809L5 4.5ZM11 4.5H10C9.75467 4.5 9.55042 4.67778 9.50806 4.91043L9.5 5V19C9.5 19.2444 9.67699 19.4494 9.91016 19.4919L10 19.5H11C11.2453 19.5 11.4496 19.3222 11.4919 19.0896L11.5 19V5C11.5 4.75556 11.323 4.55062 11.0898 4.50809L11 4.5ZM16.9753 6.5005L16.9119 6.50437L16.8493 6.5165L15.8813 6.7645C15.7063 6.8095 15.6143 6.9275 15.5743 6.9955C15.5431 7.0483 15.4985 7.14718 15.5049 7.27422L15.5203 7.3745L18.5363 19.1185C18.6023 19.3765 18.8333 19.4945 19.0193 19.4945L19.0818 19.4906L19.1443 19.4785L20.1133 19.2295C20.3515 19.1691 20.5052 18.9458 20.4879 18.7102L20.4733 18.6215L17.4583 6.8755C17.3913 6.6185 17.1613 6.5005 16.9753 6.5005Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -0,0 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M21 4C21 3.44772 20.5523 3 20 3C19.4477 3 19 3.44772 19 4V20C19 20.5523 19.4477 21 20 21C20.5523 21 21 20.5523 21 20V4Z" fill="#212121"/>
<path d="M3 4.94743C3 3.5226 4.61175 2.69498 5.7697 3.52521L16.2394 11.0318C17.2443 11.7523 17.2053 13.2593 16.1646 13.927L5.69492 20.6434C4.53019 21.3905 3 20.5542 3 19.1704V4.94743Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 452 B

View File

@ -0,0 +1,4 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.5 2C2.67157 2 2 2.67157 2 3.5V12.5C2 13.3284 2.67157 14 3.5 14H5.5C6.32843 14 7 13.3284 7 12.5V3.5C7 2.67157 6.32843 2 5.5 2H3.5Z" fill="#212121"/>
<path d="M10.5 2C9.67157 2 9 2.67157 9 3.5V12.5C9 13.3284 9.67157 14 10.5 14H12.5C13.3284 14 14 13.3284 14 12.5V3.5C14 2.67157 13.3284 2 12.5 2H10.5Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 431 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5 5.27368C5 3.56682 6.82609 2.48151 8.32538 3.2973L20.687 10.0235C22.2531 10.8756 22.2531 13.124 20.687 13.9762L8.32538 20.7024C6.82609 21.5181 5 20.4328 5 18.726V5.27368Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 303 B

View File

@ -0,0 +1,4 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.75 20C2.75 20.5523 3.19772 21 3.75 21C4.30228 21 4.75 20.5523 4.75 20L4.75 4C4.75 3.44772 4.30229 3 3.75 3C3.19772 3 2.75 3.44772 2.75 4V20Z" fill="#212121"/>
<path d="M20.75 19.0526C20.75 20.4774 19.1383 21.305 17.9803 20.4748L7.51062 12.9682C6.50574 12.2477 6.54467 10.7407 7.5854 10.073L18.0551 3.35665C19.2198 2.60946 20.75 3.44583 20.75 4.82961L20.75 19.0526Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 498 B

View File

@ -0,0 +1,3 @@
<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M5 1C2.79086 1 1 2.79086 1 5C1 7.20914 2.79086 9 5 9C5.83335 9 6.60717 8.74516 7.2478 8.30916L9.71973 10.7802C10.0127 11.0731 10.4875 11.073 10.7804 10.78C11.0732 10.4871 11.0731 10.0122 10.7802 9.71936L8.30859 7.24863C8.74494 6.60784 9 5.83371 9 5C9 2.79086 7.20914 1 5 1ZM2.5 5C2.5 3.61929 3.61929 2.5 5 2.5C6.38071 2.5 7.5 3.61929 7.5 5C7.5 6.38071 6.38071 7.5 5 7.5C3.61929 7.5 2.5 6.38071 2.5 5Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 531 B

View File

@ -0,0 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.10741 10.1681C8.37179 10.6919 7.47188 11 6.5 11C4.01472 11 2 8.98529 2 6.5C2 4.01472 4.01472 2 6.5 2C8.98528 2 11 4.01472 11 6.5C11 7.47187 10.6919 8.37179 10.1681 9.1074L13.7803 12.7197C14.0732 13.0126 14.0732 13.4874 13.7803 13.7803C13.4874 14.0732 13.0126 14.0732 12.7197 13.7803L9.10741 10.1681ZM9.5 6.5C9.5 4.84315 8.15685 3.5 6.5 3.5C4.84315 3.5 3.5 4.84315 3.5 6.5C3.5 8.15686 4.84315 9.50001 6.5 9.50001C8.15685 9.50001 9.5 8.15686 9.5 6.5Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 582 B

View File

@ -0,0 +1,3 @@
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.30887 10.016C8.53903 10.6318 7.56252 11 6.5 11C4.01472 11 2 8.98531 2 6.50002C2 4.01473 4.01472 2 6.5 2C8.98528 2 11 4.01473 11 6.50002C11 7.56252 10.6318 8.53901 10.016 9.30885L13.8536 13.1464C14.0488 13.3417 14.0488 13.6583 13.8536 13.8536C13.6583 14.0488 13.3417 14.0488 13.1464 13.8536L9.30887 10.016ZM10 6.50002C10 4.56701 8.433 3 6.5 3C4.567 3 3 4.56701 3 6.50002C3 8.43302 4.567 10 6.5 10C8.433 10 10 8.43302 10 6.50002Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 561 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10 2.5C14.1421 2.5 17.5 5.85786 17.5 10C17.5 11.7101 16.9276 13.2866 15.964 14.5483L20.7071 19.2929C21.0976 19.6834 21.0976 20.3166 20.7071 20.7071C20.3466 21.0676 19.7794 21.0953 19.3871 20.7903L19.2929 20.7071L14.5483 15.964C13.2866 16.9276 11.7101 17.5 10 17.5C5.85786 17.5 2.5 14.1421 2.5 10C2.5 5.85786 5.85786 2.5 10 2.5ZM10 4.5C6.96243 4.5 4.5 6.96243 4.5 10C4.5 13.0376 6.96243 15.5 10 15.5C13.0376 15.5 15.5 13.0376 15.5 10C15.5 6.96243 13.0376 4.5 10 4.5Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 597 B

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10 2.75C14.0041 2.75 17.25 5.99594 17.25 10C17.25 11.7319 16.6427 13.3219 15.6295 14.5688L20.5303 19.4697C20.8232 19.7626 20.8232 20.2374 20.5303 20.5303C20.2641 20.7966 19.8474 20.8208 19.5538 20.6029L19.4697 20.5303L14.5688 15.6295C13.3219 16.6427 11.7319 17.25 10 17.25C5.99594 17.25 2.75 14.0041 2.75 10C2.75 5.99594 5.99594 2.75 10 2.75ZM10 4.25C6.82436 4.25 4.25 6.82436 4.25 10C4.25 13.1756 6.82436 15.75 10 15.75C13.1756 15.75 15.75 13.1756 15.75 10C15.75 6.82436 13.1756 4.25 10 4.25Z" fill="#212121"/>
</svg>

After

Width:  |  Height:  |  Size: 625 B

View File

@ -0,0 +1,21 @@
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.

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="192" height="192" fill="#000000" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"></rect><path d="M32,72H55.06445a64,64,0,0,1,52.079,26.80076l41.7132,58.39848A64,64,0,0,0,200.93555,184H232" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="24"></path><polyline points="208 48 232 72 208 96" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="24"></polyline><polyline points="208 160 232 184 208 208" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="24"></polyline><path d="M152.76794,93.858A64.00219,64.00219,0,0,1,200.93555,72H232" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="24"></path><path d="M32,184H55.06445a64.00212,64.00212,0,0,0,48.16769-21.85814" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="24"></path></svg>

After

Width:  |  Height:  |  Size: 993 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="192" height="192" fill="#000000" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"></rect><path d="M32,72H55.06445a64,64,0,0,1,52.079,26.80076l41.7132,58.39848A64,64,0,0,0,200.93555,184H232" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="12"></path><polyline points="208 48 232 72 208 96" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="12"></polyline><polyline points="208 160 232 184 208 208" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="12"></polyline><path d="M147.66275,100.47214l1.19385-1.67138A64,64,0,0,1,200.93555,72H232" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="12"></path><path d="M32,184H55.06445a64,64,0,0,0,52.079-26.80076l1.19384-1.67138" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="12"></path></svg>

After

Width:  |  Height:  |  Size: 1002 B

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="192" height="192" fill="#000000" viewBox="0 0 256 256"><rect width="256" height="256" fill="none"></rect><path d="M32,72H55.06445a64,64,0,0,1,52.079,26.80076l41.7132,58.39848A64,64,0,0,0,200.93555,184H232" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></path><polyline points="208 48 232 72 208 96" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></polyline><polyline points="208 160 232 184 208 208" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></polyline><path d="M147.66275,100.47214l1.19385-1.67138A64,64,0,0,1,200.93555,72H232" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></path><path d="M32,184H55.06445a64,64,0,0,0,52.079-26.80076l1.19384-1.67138" fill="none" stroke="#000000" stroke-linecap="round" stroke-linejoin="round" stroke-width="16"></path></svg>

After

Width:  |  Height:  |  Size: 1002 B

55
Fluent/color.ini Normal file
View File

@ -0,0 +1,55 @@
[light]
text = 000000
subtext = 6D6D6D
alt-text = ffffff
main = f9f9f9
sidebar = f2f2f2
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
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

86
Fluent/fluent.js Normal file
View File

@ -0,0 +1,86 @@
(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",
"#spicetify-playlist-list"
], function() {
function replacePlaylistIcons() {
var els = document.getElementsByClassName("main-rootlist-rootlistItemLink");
for (let i = 0; i < els.length; i++) {
let link = els[i];
let [_, app, uid] = link.pathname.split("/");
let uri;
if (app == "playlist") {
uri = Spicetify.URI.playlistV2URI(uid);
} else if (app == "folder") {
link.style.content = "url(https://api.iconify.design/fluent/folder-24-regular.svg?color=%23bbb)"
link.style.padding = "10px";
continue;
}
Spicetify.CosmosAsync.get(
`sp://core-playlist/v1/playlist/${uri.toURI()}/metadata`, {
policy: {
picture: true
}
}
).then(res => {
const meta = res.metadata;
if (meta.picture == "") {
link.style.content = "url(https://api.iconify.design/fluent/music-note-2-24-regular.svg?color=%23bbb)"
link.style.padding = "10px";
} else {
link.style.backgroundImage = "url(" + meta.picture + ")";
link.style.content = "";
}
});
}
};
replacePlaylistIcons();
const observer = new MutationObserver(replacePlaylistIcons);
const rootList = document.querySelector("#spicetify-playlist-list");
observer.observe(rootList, {
childList: true,
subtree: true
});
});
waitForElement([
'.main-navBar-navBarLink',
'[href="/collection"] > span'
], function() {
var accent = getComputedStyle(document.documentElement).getPropertyValue('--spice-accent').replace(" #", "");
var icons = ["home", "search", "library"];
var els = document.getElementsByClassName("main-navBar-navBarLink");
for (let i = 0; i < els.length; i++) {
let link = els[i];
let div = document.createElement("div");
div.classList.add("navBar-navBarLink-accent");
link.appendChild(div);
}
document.querySelector('[href="/collection"] > span').innerHTML = "Library";
});
var text_color = getComputedStyle(document.documentElement).getPropertyValue('--spice-text');
if (text_color == " #000000") {
document.documentElement.style.setProperty('--filter-brightness', 0);
}
})();

Binary file not shown.

After

Width:  |  Height:  |  Size: 591 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 583 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 222 KiB

1497
Fluent/user.css Normal file

File diff suppressed because it is too large Load Diff

View File

@ -61,6 +61,16 @@ 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)
## Onepunch
#### Dark