Compare commits
373 Commits
redirect
...
6ee608c2e8
| Author | SHA1 | Date | |
|---|---|---|---|
 AngelJumbo
|
6ee608c2e8 | ||
|
Harsh Vyapari (harshv5094)
|
7411dc8ee3 | ||
|
AngelJumbo
|
5c145c83ae | ||
|
amano.kenji
|
a60e29ee17 | ||
|
AngelJumbo
|
1416589456 | ||
|
amano.kenji
|
3a348089b2 | ||
|
AngelJumbo
|
c13a21f35b | ||
|
amano.kenji
|
b26fa4e969 | ||
|
AngelJumbo
|
3389197695 | ||
|
amano.kenji
|
f3b9a41862 | ||
|
amano.kenji
|
a68b088dae | ||
|
AngelJumbo
|
c872a3f226 | ||
|
amano.kenji
|
517cfb8e93 | ||
|
amano.kenji
|
6c68c9063b | ||
|
AngelJumbo
|
92022114fb | ||
|
Harsh Vyapari (harshv5094)
|
a9612de0b0 | ||
|
AngelJumbo
|
dc904c44ae | ||
|
theairdemon
|
ca6b93bf55 | ||
|
AngelJumbo
|
2b4e93431a | ||
|
amano.kenji
|
38694db0c9 | ||
|
amano.kenji
|
b56a3c6946 | ||
|
AngelJumbo
|
3208fa286d | ||
|
amano.kenji
|
354943de0c | ||
|
AngelJumbo
|
27d6ad2fcd | ||
|
yaro-bit
|
997fb5e27e | ||
|
AngelJumbo
|
74ac074588 | ||
|
Denilseven
|
53cdd6e4a8 | ||
|
AngelJumbo
|
e8d4b7c498 | ||
|
laurelie-pie
|
e7731a09b1 | ||
|
AngelJumbo
|
ab8d8bf2f1 | ||
|
AngelJumbo
|
e4d051fdb6 | ||
|
Harsh Vyapari (harshv5094)
|
212a8b35c6 | ||
|
Harsh Vyapari (harshv5094)
|
f418290a30 | ||
|
AngelJumbo
|
af10335593 | ||
|
punnch
|
608f6d334d | ||
|
AngelJumbo
|
bf3562b8b7 | ||
|
Topplehawk
|
e1fd5eb296 | ||
|
Topplehawk
|
549782c484 | ||
|
AngelJumbo
|
57f0caefd6 | ||
|
Vaibhav Pancholi
|
e0fca7224f | ||
|
Vaibhav Pancholi
|
c0a4f2cd4c | ||
|
Vaibhav Pancholi
|
54605ad14e | ||
|
AngelJumbo
|
0f3baa21aa | ||
|
yaro-bit
|
85549a18e5 | ||
|
AngelJumbo
|
f54801299a | ||
|
Harsh Vyapari (harshv5094)
|
4c6a16a1a4 | ||
|
AngelJumbo
|
4482bbccba | ||
|
Harsh Vyapari (harshv5094)
|
9a65ffc32f | ||
|
AngelJumbo
|
63a8c1c17b | ||
|
Harsh Vyapari (harshv5094)
|
4cf21b392c | ||
|
AngelJumbo
|
3208e6d455 | ||
|
Honeycomb936
|
279c86c8dd | ||
|
Honeycomb936
|
a9603bf5f6 | ||
|
AngelJumbo
|
128e50100a | ||
|
AngelJumbo
|
dad7df37e5 | ||
|
ozwaldorf
|
1619078eea | ||
|
ozwaldorf
|
6018121056 | ||
|
AngelJumbo
|
46c4cfcc70 | ||
|
Giovani-Rabbit
|
af1a21834e | ||
|
Giovani-Rabbit
|
d02f551c14 | ||
|
AngelJumbo
|
e0612b8542 | ||
|
Om Rawaley
|
90df2c7119 | ||
|
AngelJumbo
|
ceeea304e6 | ||
|
amano.kenji
|
70e7299afd | ||
|
amano.kenji
|
b7d25d80df | ||
|
AngelJumbo
|
bde4094f9e | ||
|
AngelJumbo
|
b57a4368cc | ||
|
AngelJumbo
|
85d3a44f8d | ||
|
෴Δ[̲̅S̲̅]ŢŖ[̲̅A̲̅]෴
|
db216b4063 | ||
|
AngelJumbo
|
04c6d3478d | ||
|
EysseW
|
5afb04921b | ||
|
EysseW
|
ec720b2f8c | ||
|
AngelJumbo
|
a676c94544 | ||
|
EysseW
|
6515c3ffbf | ||
|
EysseW
|
afa8935b3e | ||
|
EysseW
|
09e8961b48 | ||
|
AngelJumbo
|
40d16de38f | ||
|
EysseW
|
9301c64e99 | ||
|
EysseW
|
2c85563907 | ||
|
EysseW
|
e5b3c1beb1 | ||
|
EysseW
|
aa3f952178 | ||
|
EysseW
|
a64dc0f900 | ||
|
EysseW
|
93ad5df691 | ||
|
Gurjaka
|
a97cdc3f29 | ||
|
AngelJumbo
|
0785bf9fe0 | ||
|
Gurjaka
|
be4ac55137 | ||
|
AngelJumbo
|
1d4fd02844 | ||
|
amano.kenji
|
aae8a3e746 | ||
|
AngelJumbo
|
4dfa1b2c66 | ||
|
RZ
|
47cf991c32 | ||
|
AngelJumbo
|
816720c965 | ||
|
amano.kenji
|
a47f76f5ed | ||
|
amano.kenji
|
ae0e474113 | ||
|
AngelJumbo
|
56c18fbc7f | ||
|
amano.kenji
|
8557efa44b | ||
|
AngelJumbo
|
43dce677fd | ||
|
amano.kenji
|
6ae616835e | ||
|
AngelJumbo
|
cc0f8ed5ba | ||
|
The NikOS Team
|
b1bd18dc78 | ||
|
AngelJumbo
|
34d163bdd6 | ||
|
AngelJumbo
|
34ca9f78ad | ||
|
AngelJumbo
|
ed4888c5d5 | ||
|
AngelJumbo
|
d09bbc5645 | ||
|
AngelJumbo
|
53cc1d6cdf | ||
|
AngelJumbo
|
694f5bf7a6 | ||
|
prismm121
|
6dece815f5 | ||
|
prismm121
|
435811a74d | ||
|
prismm121
|
02f0c03e9d | ||
|
AngelJumbo
|
b7e82843e1 | ||
|
AngelJumbo
|
7e0cafd350 | ||
|
prismm121
|
72e58c18dc | ||
|
prismm121
|
bb38fb9d89 | ||
|
prismm121
|
dc25073a5e | ||
|
prismm121
|
dbb5e48513 | ||
|
AngelJumbo
|
7bc1a8ca5d | ||
|
𝙑
|
975490479b | ||
|
𝙑
|
07bdfe17de | ||
|
AngelJumbo
|
e28e0eb694 | ||
|
AngelJumbo
|
6d4f195bf8 | ||
|
AngelJumbo
|
cf5f1b4e49 | ||
|
AngelJumbo
|
eb5b979f52 | ||
|
𝙑
|
eaf28a91c9 | ||
|
AngelJumbo
|
2b51018758 | ||
|
AngelJumbo
|
0433696bad | ||
|
AngelJumbo
|
df26d20ba7 | ||
|
Facundo Ciruzzi
|
962814cb1b | ||
|
AngelJumbo
|
725fefba8b | ||
|
Topplehawk
|
e1e98cb97b | ||
|
AngelJumbo
|
aea563acb4 | ||
|
Om Rawaley
|
f2a635f585 | ||
|
Om Rawaley
|
d900060d62 | ||
|
AngelJumbo
|
32817ad442 | ||
|
Om Rawaley
|
16658275b1 | ||
|
AngelJumbo
|
28c142ac53 | ||
|
AngelJumbo
|
5fea0cae30 | ||
|
AngelJumbo
|
ee31dfd8cc | ||
|
shvedes
|
42e80aaf7a | ||
|
AngelJumbo
|
d3b07d3ec4 | ||
|
Andre Ribeiro
|
ac23685be5 | ||
|
AngelJumbo
|
b210a7432d | ||
|
𝙑
|
306fad3db8 | ||
|
AngelJumbo
|
e5322d8d50 | ||
|
AngelJumbo
|
1ebfa70174 | ||
|
AngelJumbo
|
bd074b4a99 | ||
|
shvedes
|
c097da93a0 | ||
|
AngelJumbo
|
e1d98318e6 | ||
|
AngelJumbo
|
5ece2d831e | ||
|
VykeTheGreat
|
509d3ddc91 | ||
|
AngelJumbo
|
06325d17fe | ||
|
AngelJumbo
|
53e3809591 | ||
|
AngelJumbo
|
4164e617dc | ||
|
AngelJumbo
|
7d5b2064d1 | ||
|
AngelJumbo
|
9c68496d42 | ||
|
AngelJumbo
|
cac93e87f0 | ||
|
touero
|
610a3ba816 | ||
|
AngelJumbo
|
e73070e430 | ||
|
𝙑
|
545fe46e5a | ||
|
AngelJumbo
|
18a76f7c15 | ||
|
Ensong Wei
|
c875ee0f52 | ||
|
Ensong Wei
|
d2c1fd9f25 | ||
|
AngelJumbo
|
d496054722 | ||
|
Ensong Wei
|
7a2f51a7f2 | ||
|
AngelJumbo
|
511f33dbc4 | ||
|
Ninjafire
|
a84806bb91 | ||
|
AngelJumbo
|
4ff8caecb6 | ||
|
Hosein Salmani
|
75889c4a37 | ||
|
AngelJumbo
|
83fb97458e | ||
|
Hosein Salmani
|
cf7dceb9a1 | ||
|
AngelJumbo
|
57a16c4d93 | ||
|
Ensong Wei
|
52c44d409c | ||
|
AngelJumbo
|
f7d3a2d58a | ||
|
Hosein Salmani
|
8bfef10c3d | ||
|
AngelJumbo
|
f54f0ff3f5 | ||
|
Hosein Salmani
|
181f5acd04 | ||
|
Hosein Salmani
|
8c78d03d70 | ||
|
AngelJumbo
|
bb3d4a7df9 | ||
|
Ninjafire
|
68763c4bc4 | ||
|
AngelJumbo
|
0609f7258f | ||
|
Frost-Phoenix
|
658a10034c | ||
|
AngelJumbo
|
edb315e711 | ||
|
SirDave
|
eb5caaccb4 | ||
|
AngelJumbo
|
d42d226e83 | ||
|
AngelJumbo
|
6e0c1ebca9 | ||
|
AngelJumbo
|
836b5c4d07 | ||
|
AngelJumbo
|
9573c78a90 | ||
|
AngelJumbo
|
7b7726fc69 | ||
|
devsnakex34
|
58917ee8c7 | ||
|
devsnakex34
|
c23ea139d7 | ||
|
Katy248
|
37629bf4e9 | ||
|
Katy248
|
879717cfaa | ||
|
AngelJumbo
|
3bd3380a3c | ||
|
shvedes
|
4be1241aed | ||
|
shvedes
|
b2aced73df | ||
|
shvedes
|
3510f231fa | ||
|
shvedes
|
3fd21999a2 | ||
|
shvedes
|
46ba442fc5 | ||
|
shvedes
|
4ff371f85a | ||
|
shvedes
|
8e54edc078 | ||
|
shvedes
|
fe1fe80748 | ||
|
AngelJumbo
|
f84b65ab55 | ||
|
shved.
|
ba2ab83067 | ||
|
shvedes
|
ca324d2a4c | ||
|
shvedes
|
cd8abe91b7 | ||
|
shvedes
|
e63bcb1ded | ||
|
shvedes
|
806261381d | ||
|
shvedes
|
8015c5ff21 | ||
|
AngelJumbo
|
1b316126fc | ||
|
shvedes
|
23ea5d0be0 | ||
|
shvedes
|
97dafc128c | ||
|
shvedes
|
0fc4b75bc3 | ||
|
shvedes
|
79f55607c7 | ||
|
shvedes
|
9b72a50974 | ||
|
shvedes
|
f4a5a2df43 | ||
|
shvedes
|
4354a17030 | ||
|
shvedes
|
88cdda4dad | ||
|
shvedes
|
a06f012dc9 | ||
|
shvedes
|
aa567f877a | ||
|
shvedes
|
f38ab2b946 | ||
|
shvedes
|
95a509b657 | ||
|
shvedes
|
2e4f702715 | ||
|
shvedes
|
f48204667c | ||
|
shvedes
|
aac330bf39 | ||
|
shvedes
|
456fee12dd | ||
|
shvedes
|
3a8114ed5a | ||
|
AngelJumbo
|
44974374d3 | ||
|
shvedes
|
a9e7548984 | ||
|
shvedes
|
7feadcae55 | ||
|
shvedes
|
f9b3a62d1c | ||
|
shvedes
|
bd3a0de00c | ||
|
shvedes
|
d7e2ad0566 | ||
|
shvedes
|
1314b9aa5d | ||
|
shvedes
|
290c06e8e4 | ||
|
shvedes
|
0713acf2f7 | ||
|
shvedes
|
f77d639965 | ||
|
shvedes
|
6397501d26 | ||
|
shvedes
|
8f7eeef6e8 | ||
|
shvedes
|
258f464878 | ||
|
shvedes
|
676699b0e3 | ||
|
shvedes
|
9d69078b22 | ||
|
shvedes
|
6adadfe8f3 | ||
|
shvedes
|
ccba4a364d | ||
|
shvedes
|
5466b16adb | ||
|
shvedes
|
ef7d2f1bb2 | ||
|
shvedes
|
8e745f6f62 | ||
|
shvedes
|
96e43c06be | ||
|
shvedes
|
78705d188c | ||
|
AngelJumbo
|
f94cdf6d5b | ||
|
shvedes
|
5f40e4af20 | ||
|
shvedes
|
74d8545d54 | ||
|
shved.
|
68a9933db0 | ||
|
shvedes
|
438e77f61d | ||
|
shvedes
|
0c2c66435c | ||
|
shvedes
|
2b881d3a8c | ||
|
shvedes
|
5a93b2dc5b | ||
|
shvedes
|
e5805dcb25 | ||
|
shvedes
|
bf2aa1f130 | ||
|
shvedes
|
e7ec6bb2f9 | ||
|
shvedes
|
098e2c2e22 | ||
|
shvedes
|
52f710cfd7 | ||
|
shvedes
|
c428959edc | ||
|
AngelJumbo
|
9706a4b71e | ||
|
shvedes
|
acb3623ed8 | ||
|
AngelJumbo
|
16b686d33d | ||
|
shvedes
|
8abd1c6f5e | ||
|
AngelJumbo
|
24920190a6 | ||
|
Frost-Phoenix
|
f1b84ff78b | ||
|
Frost-Phoenix
|
2c31069fb0 | ||
|
AngelJumbo
|
0448e3b406 | ||
|
Anksio
|
e73217a8f7 | ||
|
Anksio
|
9506419666 | ||
|
Anksio
|
7f4bce9be7 | ||
|
AngelJumbo
|
028d9947a6 | ||
|
beatsbury
|
344e3e4cc5 | ||
|
AngelJumbo
|
1c6ea8b9a6 | ||
|
IBM-5100-PC
|
518d2a5321 | ||
|
IBM-5100-PC
|
b3900a7f51 | ||
|
IBM-5100-PC
|
111fbec077 | ||
|
AngelJumbo
|
9fcfb9a41d | ||
|
DaliborBilicky
|
cd4853c388 | ||
|
DaliborBilicky
|
e09f5b0ab6 | ||
|
AngelJumbo
|
c4bb604bb8 | ||
|
daiquyfunny
|
f6fce1995e | ||
|
AngelJumbo
|
2ff849faa8 | ||
|
Advait Pandharpurkar
|
a941f364cf | ||
|
AngelJumbo
|
58907eb22a | ||
|
Facundo Ciruzzi
|
c1c08c87b7 | ||
|
AngelJumbo
|
27cad112c3 | ||
|
00xBAD
|
7242a8187f | ||
|
AngelJumbo
|
d6a204a5fd | ||
|
AngelJumbo
|
4899b3d32d | ||
|
AngelJumbo
|
cbe2e52507 | ||
|
AngelJumbo
|
7c7c9f9fc8 | ||
|
AngelJumbo
|
4d63eea921 | ||
|
AngelJumbo
|
9f6e2b0525 | ||
|
AngelJumbo
|
575d88e485 | ||
|
Katy248
|
6299537d22 | ||
|
AngelJumbo
|
0f839b54e2 | ||
|
Katy248
|
0dfad27294 | ||
|
Katy248
|
4a1caafdfe | ||
|
Katy248
|
cf81ba31f9 | ||
|
Katy248
|
841e75f581 | ||
|
Katy248
|
96eef9616a | ||
|
AngelJumbo
|
c5aab3de19 | ||
|
AngelJumbo
|
5992f48512 | ||
|
AngelJumbo
|
0a3cdc17f2 | ||
|
AngelJumbo
|
9d9ad8f367 | ||
|
Katy248
|
d0eee7a6a4 | ||
|
Katy248
|
6409642dc3 | ||
|
Katy248
|
5a73cf5341 | ||
|
Katy248
|
4e5b68630c | ||
|
Katy248
|
1db5c74b2c | ||
|
Katy248
|
fbbfef9b82 | ||
|
AngelJumbo
|
f298aa85e8 | ||
|
AngelJumbo
|
6bbb48fb26 | ||
|
AngelJumbo
|
321c915bad | ||
|
AngelJumbo
|
7e65737868 | ||
|
AngelJumbo
|
0c740aacf1 | ||
|
AngelJumbo
|
9f6ea14b1b | ||
|
AngelJumbo
|
6a5ab1386b | ||
|
AngelJumbo
|
7f3e1caea9 | ||
|
AngelJumbo
|
38c2464a60 | ||
|
Advait Pandharpurkar
|
6721b3133e | ||
|
AngelJumbo
|
b93ab73dbf | ||
|
Brad Cook
|
3fe9a9033a | ||
|
AngelJumbo
|
4da423e5e9 | ||
|
seth0xd
|
99e24e6b91 | ||
|
AngelJumbo
|
705117d906 | ||
|
The Linux Cast
|
73ec37569a | ||
|
The Linux Cast
|
6f6441610d | ||
|
AngelJumbo
|
fbd09f9f8e | ||
|
seth0xd
|
f03f1c255a | ||
|
AngelJumbo
|
912e4f627c | ||
|
No0ne
|
b3322d5f4d | ||
|
AngelJumbo
|
40e7e82e92 | ||
|
Alan Ari
|
b4bf22ceed | ||
|
AngelJumbo
|
bcdb2fb8d8 | ||
|
Moh Anif Yuliansyah
|
71eb608650 | ||
|
AngelJumbo
|
aa8684c638 | ||
|
AngelJumbo
|
c620ff7f47 | ||
|
lnxwizard
|
0fc2228295 | ||
|
lnxwizard
|
c0d9a49b8c | ||
|
AngelJumbo
|
dc6a4c8b78 | ||
|
AngelJumbo
|
bc7c7b28d5 | ||
|
AngelJumbo
|
f4eae59224 | ||
|
Player6734
|
4f6c5390ca | ||
|
Player6734
|
3f45cb4698 | ||
|
Player6734
|
fb7beaf7c6 | ||
|
Player6734
|
7d4e2609e8 | ||
|
AngelJumbo
|
0333a4f6f9 | ||
|
LukasEins
|
46324eb663 | ||
|
Player6734
|
6fcde95a85 | ||
|
AngelJumbo
|
8bd4d3e282 | ||
|
hoolycoww
|
1ec7c3f708 | ||
|
hoolycoww
|
bec5605b4c | ||
|
AngelJumbo
|
739d1df5e7 | ||
|
Player6734
|
558f45f53e | ||
|
AngelJumbo
|
660f4e4785 | ||
|
AngelJumbo
|
c16fce4adb | ||
|
Corentin Deret
|
c357526872 | ||
|
AngelJumbo
|
f0ef341c7c | ||
|
Kian Moloney
|
fb07b1f2a9 | ||
|
AngelJumbo
|
4308da29f5 | ||
|
Jeremy Cains
|
8f5f9cf8e4 | ||
|
AngelJumbo
|
7699bff551 | ||
|
LukasEins
|
dd033ec972 | ||
|
AngelJumbo
|
458828e054 | ||
|
AngelJumbo
|
b9bdba8553 | ||
|
AngelJumbo
|
98dc560aa6 | ||
|
AngelJumbo
|
532c8ef745 | ||
|
AngelJumbo
|
20941c26f8 | ||
|
AngelJumbo
|
31048baa6f | ||
|
AngelJumbo
|
65f08f1b6a | ||
|
AngelJumbo
|
66111d0694 |
@@ -1 +1,3 @@
|
||||
index.html
|
||||
*.html
|
||||
thumbnails/
|
||||
*.js
|
||||
@@ -1,10 +1,53 @@
|
||||
# Gruvbox Wallpapers
|
||||
A place where to find gruvbox theme wallpapers.
|
||||
[https://gruvbox-wallpapers.onrender.com/](https://gruvbox-wallpapers.onrender.com/ 'Gruvbox Wallpapers')
|
||||
[https://gruvbox-wallpapers.pages.dev/](https://gruvbox-wallpapers.pages.dev/ 'Gruvbox Wallpapers')
|
||||
## Contributions
|
||||
|
||||
1. Fork the project.
|
||||
2. Add the wallpapers that you have in their respective folder.
|
||||
3. For light variants: Place the light-themed wallpapers in a light/ subfolder within the category.
|
||||
3. Make a pull request.
|
||||
|
||||
If your wallpaper does not fit in any of the folders we can debate the creation of a new one.
|
||||
> [!CAUTION]
|
||||
> - Use files under 25mb
|
||||
> - Avoid spaces in names
|
||||
|
||||
> [!TIP]
|
||||
> If your wallpaper does not fit in any of the folders we can debate the creation of a new one.
|
||||
|
||||
I tend to accept any contributions, but let's keep the site with images that match or look good with the gruvbox's color scheme :').
|
||||
|
||||
|
||||
## Nix package
|
||||
|
||||
1. **Use [nix flakes](https://wiki.nixos.org/wiki/Flakes)**:
|
||||
|
||||
2. Add the following to your `flake.nix` file:
|
||||
|
||||
```nix
|
||||
inputs = {
|
||||
gruvbox-wallpapers.url = "github:AngelJumbo/gruvbox-wallpapers";
|
||||
# ...
|
||||
};
|
||||
```
|
||||
|
||||
3. Then, in your Home Manager configuration:
|
||||
|
||||
```nix
|
||||
{
|
||||
inputs,
|
||||
pkgs,
|
||||
...
|
||||
}: {
|
||||
home.file = {
|
||||
"path/to/dir" = {
|
||||
source = inputs.gruvbox-wallpapers.packages."${pkgs.stdenv.hostPlatform.system}".default;
|
||||
recursive = true;
|
||||
};
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
## Disclaimer
|
||||
|
||||
Most of the images shared here are community contributions, and their original sources are often unknown. If you are the rightful owner of any image and would like it removed, please contact me by opening an issue. For any use beyond personal scope, I recommend performing a reverse image search to verify the origin.
|
||||
|
||||
@@ -1,92 +1,506 @@
|
||||
#!/bin/sh
|
||||
#!/usr/bin/env bash
|
||||
|
||||
touch ./index.html
|
||||
# MIT License
|
||||
# Copyright (c) 2022 Angel Jumbo <anarjumb@protonmail.com>
|
||||
#
|
||||
# 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.
|
||||
|
||||
echo "<!DOCTYPE html>
|
||||
<html lang=\"en\">
|
||||
|
||||
<head>
|
||||
<meta charset=\"utf-8\">
|
||||
<link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\">
|
||||
<title>Gruvbox wallpapers</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>Wallpapers for gruvbox</h1>" > ./index.html
|
||||
|
||||
color=1
|
||||
for subdir in ./wallpapers/*
|
||||
do
|
||||
|
||||
echo "<h2 id=s"$color">" >> ./index.html
|
||||
echo "${subdir##*/}" | tr a-z A-Z >> ./index.html
|
||||
echo "</h2>" >> ./index.html
|
||||
generate_thumbnails() {
|
||||
echo "generate thumbnails ..."
|
||||
mkdir -p thumbnails
|
||||
rm -rf thumbnails/*
|
||||
|
||||
echo "<div id=c>" >> ./index.html
|
||||
# Count total number of images
|
||||
total_images=$(find ./wallpapers -type f \( -iname "*.jpg" -o -iname "*.jpeg" -o -iname "*.png" \) | wc -l)
|
||||
current_image=0
|
||||
|
||||
count=1;
|
||||
for wallpaper in ${subdir}/*
|
||||
do
|
||||
if [ "$count" -lt 11 ]; then #limit the amount of images per section in index
|
||||
echo " <a target=\"_blank\" href=\"$wallpaper\">
|
||||
<img loading=\"lazy\" src=\"$wallpaper\" alt="$wallpaper" width=\"200\"></a>" >> ./index.html
|
||||
count=$((count+1))
|
||||
else #if the limit is exceeded then create a new html with all the images of the section
|
||||
# TODO: make this part cleaner, this is really ugly.
|
||||
subhtml="${subdir##*/}.html"
|
||||
nimgs=$(ls "${subdir}" | wc -l)
|
||||
echo " <a target=\"_blank\" class = \"showmore\" href=\"${subhtml}\">
|
||||
<div class = \"showmore\">show all ${nimgs} ${subdir##*/} wallpapers </div></a>" >> ./index.html
|
||||
touch "${subhtml}"
|
||||
|
||||
echo "<!DOCTYPE html>
|
||||
<html lang=\"en\">
|
||||
|
||||
<head>
|
||||
<meta charset=\"utf-8\">
|
||||
<link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\">
|
||||
<title>Gruvbox wallpapers</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>Wallpapers for gruvbox</h1>" > "${subhtml}"
|
||||
|
||||
echo "<h2 id=s"$color">" >> "${subhtml}"
|
||||
echo "${subdir##*/}" | tr a-z A-Z >> "${subhtml}"
|
||||
echo "</h2>" >> "${subhtml}"
|
||||
|
||||
echo "<div id=c>" >> "${subhtml}"
|
||||
|
||||
for wallpaper2 in ${subdir}/*
|
||||
do
|
||||
echo " <a target=\"_blank\" href=\"$wallpaper2\">
|
||||
<img loading=\"lazy\" src=\"$wallpaper2\" alt="$wallpaper2" width=\"200\"></a>" >> "${subhtml}"
|
||||
done
|
||||
|
||||
echo "</div>" >> "${subhtml}"
|
||||
|
||||
echo "<p> Contributions <a href=\"https://github.com/AngelJumbo/gruvbox-wallpapers\">here</a>.</p>
|
||||
<p> This images are from random sites or contributions so I don't have a way to know who are their original artist.</p>
|
||||
<p> I want to keep this site as simple as possible, but if you are the creator of any of these images and you want acknowledgment I will happily add a section with your name. Just open an issue <a href=\"https://github.com/AngelJumbo/gruvbox-wallpapers/issues\">here</a>.</p>
|
||||
<p> The same goes, if you want me to remove your art.</p>
|
||||
</body>
|
||||
</html>" >> "${subhtml}"
|
||||
break
|
||||
fi
|
||||
for section_dir in ./wallpapers/*; do
|
||||
section_name="${section_dir##*/}"
|
||||
mkdir -p "thumbnails/$section_name"
|
||||
|
||||
# Process dark images (base directory)
|
||||
for img in "$section_dir"/*; do
|
||||
[ -f "$img" ] || continue
|
||||
case "$img" in
|
||||
*.jpg|*.jpeg|*.png|*.JPG|*.JPEG|*.PNG) ;;
|
||||
*) continue ;;
|
||||
esac
|
||||
|
||||
current_image=$((current_image + 1))
|
||||
local img_filename="${img##*/}"
|
||||
local thumbnail="thumbnails/$section_name/$img_filename"
|
||||
echo "($current_image/$total_images): $img -> $thumbnail"
|
||||
convert "$img" -resize 300x300 "$thumbnail"
|
||||
done
|
||||
|
||||
# Process light images if light folder exists
|
||||
if [ -d "$section_dir/light" ]; then
|
||||
mkdir -p "thumbnails/$section_name/light"
|
||||
for img in "$section_dir/light"/*; do
|
||||
[ -f "$img" ] || continue
|
||||
case "$img" in
|
||||
*.jpg|*.jpeg|*.png|*.JPG|*.JPEG|*.PNG) ;;
|
||||
*) continue ;;
|
||||
esac
|
||||
|
||||
current_image=$((current_image + 1))
|
||||
local img_filename="${img##*/}"
|
||||
local thumbnail="thumbnails/$section_name/light/$img_filename"
|
||||
echo "($current_image/$total_images): $img -> $thumbnail"
|
||||
convert "$img" -resize 300x300 "$thumbnail"
|
||||
done
|
||||
fi
|
||||
done
|
||||
|
||||
echo "</div>" >> ./index.html
|
||||
echo "Thumbnail generation complete: $total_images images processed"
|
||||
}
|
||||
|
||||
color=$((color+1))
|
||||
check_has_light_folder() {
|
||||
local section_dir=$1
|
||||
[ -d "$section_dir/light" ] && echo "true" || echo "false"
|
||||
}
|
||||
|
||||
count_images_in_dir() {
|
||||
local dir=$1
|
||||
find "$dir" -maxdepth 1 -type f \( -iname "*.jpg" -o -iname "*.jpeg" -o -iname "*.png" \) | wc -l
|
||||
}
|
||||
|
||||
create_section_data() {
|
||||
local section=$1
|
||||
local subdir=$2
|
||||
local maxPerPage=8
|
||||
local has_light=$(check_has_light_folder "$subdir")
|
||||
|
||||
echo "Creating data for section: $section"
|
||||
|
||||
# Create JSON data file for the section
|
||||
local data_file="${section}_data.js"
|
||||
|
||||
cat > "$data_file" << EOF
|
||||
// Data for $section section
|
||||
window.sectionData = window.sectionData || {};
|
||||
window.sectionData['$section'] = {
|
||||
hasLight: $has_light,
|
||||
maxPerPage: $maxPerPage,
|
||||
dark: [
|
||||
EOF
|
||||
|
||||
# Generate dark images data
|
||||
for wallpaper in "$subdir"/*; do
|
||||
[ -f "$wallpaper" ] || continue
|
||||
case "$wallpaper" in
|
||||
*.jpg|*.jpeg|*.png|*.JPG|*.JPEG|*.PNG) ;;
|
||||
*) continue ;;
|
||||
esac
|
||||
|
||||
local img_path="${wallpaper#./}"
|
||||
local img_filename="${wallpaper##*/}"
|
||||
local thumbnail_path="thumbnails/$section/$img_filename"
|
||||
echo " { src: '$img_path', thumb: '$thumbnail_path', alt: '$img_filename' }," >> "$data_file"
|
||||
done
|
||||
|
||||
# Generate light images data if exists
|
||||
echo " ]," >> "$data_file"
|
||||
if [ "$has_light" = "true" ]; then
|
||||
echo " light: [" >> "$data_file"
|
||||
for wallpaper in "$subdir/light"/*; do
|
||||
[ -f "$wallpaper" ] || continue
|
||||
case "$wallpaper" in
|
||||
*.jpg|*.jpeg|*.png|*.JPG|*.JPEG|*.PNG) ;;
|
||||
*) continue ;;
|
||||
esac
|
||||
|
||||
local img_path="${wallpaper#./}"
|
||||
local img_filename="${wallpaper##*/}"
|
||||
local thumbnail_path="thumbnails/$section/light/$img_filename"
|
||||
echo " { src: '$img_path', thumb: '$thumbnail_path', alt: '$img_filename' }," >> "$data_file"
|
||||
done
|
||||
echo " ]" >> "$data_file"
|
||||
else
|
||||
echo " light: []" >> "$data_file"
|
||||
fi
|
||||
|
||||
echo "};" >> "$data_file"
|
||||
}
|
||||
|
||||
# Clean up old files
|
||||
rm -f *.html *.js
|
||||
|
||||
# Generate thumbnails
|
||||
generate_thumbnails
|
||||
|
||||
# Create main index.html
|
||||
cat > index.html << 'EOF'
|
||||
<!DOCTYPE html>
|
||||
<html lang='en'>
|
||||
<head>
|
||||
<meta charset='utf-8'>
|
||||
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
|
||||
<link rel='stylesheet' type='text/css' href='style.css'>
|
||||
<title>Gruvbox wallpapers</title>
|
||||
<style>
|
||||
.section-content {
|
||||
margin: 20px 0;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: all 0.3s ease-in-out;
|
||||
transform: translateY(10px);
|
||||
}
|
||||
|
||||
.section.selected .section-content {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
/* Theme switcher styles */
|
||||
.section-theme-switcher {
|
||||
text-align: center;
|
||||
margin: 15px 0;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: all 0.3s ease-in-out;
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
|
||||
.section.selected .section-theme-switcher {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.theme-toggle {
|
||||
display: inline-flex;
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.theme-btn {
|
||||
padding: 10px 20px;
|
||||
background-color: var(--bg-color-reverse);
|
||||
color: var(--fg-color-reverse);
|
||||
border: 2px solid transparent;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.3s ease;
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
argin: 0 5px 0 5px;
|
||||
}
|
||||
|
||||
.theme-btn:hover {
|
||||
background-color: var(--bg-color-reverse);
|
||||
}
|
||||
|
||||
.theme-btn.active {
|
||||
border: 4px solid var(--fg-color);
|
||||
background-color: var(--bg-color);
|
||||
color: var(--fg-color);
|
||||
}
|
||||
|
||||
.subsection-content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.subsection-content.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.loading {
|
||||
text-align: center;
|
||||
padding: 40px;
|
||||
color: var(--fg-color);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class='float-btns'>
|
||||
<a href='https://github.com/AngelJumbo/gruvbox-wallpapers' target='_blank' class='btn float-btn' title='Source code'>
|
||||
<span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-github-icon lucide-github"><path d="M15 22v-4a4.8 4.8 0 0 0-1-3.5c3 0 6-2 6-5.5.08-1.25-.27-2.48-1-3.5.28-1.15.28-2.35 0-3.5 0 0-1 0-3 1.5-2.64-.5-5.36-.5-8 0C6 2 5 2 5 2c-.3 1.15-.3 2.35 0 3.5A5.403 5.403 0 0 0 4 9c0 3.5 3 5.5 6 5.5-.39.49-.68 1.05-.85 1.65-.17.6-.22 1.23-.15 1.85v4"/><path d="M9 18c-4.51 2-5-2-7-2"/></svg>
|
||||
</span>
|
||||
</a>
|
||||
<button onclick='switchMainTheme()' class='btn float-btn' title='Switch theme'>
|
||||
<span>
|
||||
<svg id="light-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-sun-icon lucide-sun"><circle cx="12" cy="12" r="4"/><path d="M12 2v2"/><path d="M12 20v2"/><path d="m4.93 4.93 1.41 1.41"/><path d="m17.66 17.66 1.41 1.41"/><path d="M2 12h2"/><path d="M20 12h2"/><path d="m6.34 17.66-1.41 1.41"/><path d="m19.07 4.93-1.41 1.41"/></svg>
|
||||
<svg id="dark-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-moon-icon lucide-moon"><path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401"/></svg>
|
||||
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<main>
|
||||
<h1>Gruvbox Wallpapers</h1>
|
||||
EOF
|
||||
|
||||
# Generate sections
|
||||
color=1
|
||||
declare -a sections
|
||||
declare -a sections_with_light
|
||||
|
||||
for subdir in ./wallpapers/*; do
|
||||
section="${subdir##*/}"
|
||||
sections+=("$section")
|
||||
has_light=$(check_has_light_folder "$subdir")
|
||||
|
||||
if [ "$has_light" = "true" ]; then
|
||||
sections_with_light+=("$section")
|
||||
fi
|
||||
|
||||
# Create the data file
|
||||
create_section_data "$section" "$subdir"
|
||||
|
||||
# Add section to main page
|
||||
echo " <h2 class='s$color clickable' onclick='activeSection(\"$section\")'>" >> index.html
|
||||
echo " $(echo "$section" | tr a-z A-Z)" >> index.html
|
||||
echo " </h2>" >> index.html
|
||||
echo " <div class='section' id='$section'>" >> index.html
|
||||
|
||||
# Add theme switcher if section has light variant
|
||||
if [ "$has_light" = "true" ]; then
|
||||
echo " <div class='section-theme-switcher'>" >> index.html
|
||||
echo " <div class='theme-toggle'>" >> index.html
|
||||
echo " <button class='theme-btn active' onclick='switchSectionTheme(\"$section\", \"dark\")' id='$section-dark-btn'>Dark</button>" >> index.html
|
||||
echo " <button class='theme-btn' onclick='switchSectionTheme(\"$section\", \"light\")' id='$section-light-btn'>Light</button>" >> index.html
|
||||
echo " </div>" >> index.html
|
||||
echo " </div>" >> index.html
|
||||
fi
|
||||
|
||||
echo " <div class='section-content' id='$section-content'>" >> index.html
|
||||
echo " <div class='loading'>Loading...</div>" >> index.html
|
||||
echo " </div>" >> index.html
|
||||
echo " </div>" >> index.html
|
||||
|
||||
color=$((color + 1))
|
||||
if [ "$color" -eq 8 ]; then
|
||||
color=1
|
||||
fi
|
||||
done
|
||||
|
||||
echo "<p> Contributions <a href=\"https://github.com/AngelJumbo/gruvbox-wallpapers\">here</a>.</p>
|
||||
<p> This images are from random sites or contributions so I don't have a way to know who are their original artist.</p>
|
||||
<p> I want to keep this site as simple as possible, but if you are the creator of any of these images and you want acknowledgment I will happily add a section with your name. Just open an issue <a href=\"https://github.com/AngelJumbo/gruvbox-wallpapers/issues\">here</a>.</p>
|
||||
<p> The same goes, if you want me to remove your art.</p>
|
||||
# Add all section data scripts
|
||||
for section in "${sections[@]}"; do
|
||||
echo " <script src='${section}_data.js'></script>" >> index.html
|
||||
done
|
||||
|
||||
# Add main JavaScript
|
||||
cat >> index.html << 'EOF'
|
||||
<script>
|
||||
// Global state
|
||||
let activeSectionName = null;
|
||||
let sectionStates = {};
|
||||
|
||||
// Initialize section state
|
||||
function initSectionState(section) {
|
||||
if (!sectionStates[section]) {
|
||||
sectionStates[section] = {
|
||||
currentTheme: 'dark',
|
||||
currentPages: { dark: 1, light: 1 },
|
||||
loaded: false
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
function activeSection(section) {
|
||||
hideAllSections();
|
||||
const targetSection = document.getElementById(section);
|
||||
|
||||
targetSection.classList.add('selected');
|
||||
activeSectionName = section;
|
||||
|
||||
initSectionState(section);
|
||||
|
||||
// Load content if not already loaded
|
||||
if (!sectionStates[section].loaded) {
|
||||
loadSectionContent(section);
|
||||
}
|
||||
|
||||
// Reset to dark theme
|
||||
if (window.sectionData[section].hasLight) {
|
||||
switchSectionTheme(section, 'dark');
|
||||
}
|
||||
|
||||
setTimeout(() => {
|
||||
targetSection.scrollIntoView({ block: 'start', behavior: 'smooth' });
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function hideAllSections() {
|
||||
document.querySelectorAll('.section').forEach(s => {
|
||||
s.classList.remove('selected');
|
||||
});
|
||||
activeSectionName = null;
|
||||
}
|
||||
|
||||
function loadSectionContent(section) {
|
||||
const contentDiv = document.getElementById(section + '-content');
|
||||
const data = window.sectionData[section];
|
||||
|
||||
if (!data) {
|
||||
contentDiv.innerHTML = '<div class="loading">Error: Section data not found</div>';
|
||||
return;
|
||||
}
|
||||
|
||||
let html = '';
|
||||
|
||||
// Dark content
|
||||
if (data.dark.length > 0) {
|
||||
html += `<div class="subsection-content active" id="${section}-dark">`;
|
||||
|
||||
// Dark pagination
|
||||
const darkPages = Math.ceil(data.dark.length / data.maxPerPage);
|
||||
if (darkPages > 1) {
|
||||
html += '<div class="pager">';
|
||||
for (let i = 1; i <= darkPages; i++) {
|
||||
const selectedClass = i === 1 ? ' selected' : '';
|
||||
html += `<button class="btn pager-btn${selectedClass}" onclick="loadPage('${section}', 'dark', ${i})">${i}</button>`;
|
||||
}
|
||||
html += '</div>';
|
||||
}
|
||||
|
||||
html += `<div id="${section}-dark-content">`;
|
||||
html += generateImageGrid(data.dark.slice(0, data.maxPerPage));
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
}
|
||||
|
||||
// Light content
|
||||
if (data.hasLight && data.light.length > 0) {
|
||||
html += `<div class="subsection-content" id="${section}-light">`;
|
||||
|
||||
// Light pagination
|
||||
const lightPages = Math.ceil(data.light.length / data.maxPerPage);
|
||||
if (lightPages > 1) {
|
||||
html += '<div class="pager">';
|
||||
for (let i = 1; i <= lightPages; i++) {
|
||||
const selectedClass = i === 1 ? ' selected' : '';
|
||||
html += `<button class="btn pager-btn${selectedClass}" onclick="loadPage('${section}', 'light', ${i})">${i}</button>`;
|
||||
}
|
||||
html += '</div>';
|
||||
}
|
||||
|
||||
html += `<div id="${section}-light-content">`;
|
||||
html += generateImageGrid(data.light.slice(0, data.maxPerPage));
|
||||
html += '</div>';
|
||||
html += '</div>';
|
||||
}
|
||||
|
||||
contentDiv.innerHTML = html;
|
||||
sectionStates[section].loaded = true;
|
||||
}
|
||||
|
||||
function generateImageGrid(images) {
|
||||
let html = '<div class="c">';
|
||||
images.forEach(img => {
|
||||
html += `<a target="_blank" href="${img.src}">
|
||||
<img loading="lazy" src="${img.thumb}" alt="${img.alt}" width="200">
|
||||
</a>`;
|
||||
});
|
||||
html += '</div>';
|
||||
return html;
|
||||
}
|
||||
|
||||
function switchSectionTheme(section, theme) {
|
||||
const darkBtn = document.getElementById(section + '-dark-btn');
|
||||
const lightBtn = document.getElementById(section + '-light-btn');
|
||||
const darkContent = document.getElementById(section + '-dark');
|
||||
const lightContent = document.getElementById(section + '-light');
|
||||
|
||||
initSectionState(section);
|
||||
sectionStates[section].currentTheme = theme;
|
||||
|
||||
// Update button states
|
||||
if (darkBtn && lightBtn) {
|
||||
darkBtn.classList.toggle('active', theme === 'dark');
|
||||
lightBtn.classList.toggle('active', theme === 'light');
|
||||
}
|
||||
|
||||
// Switch content visibility
|
||||
if (darkContent && lightContent) {
|
||||
darkContent.classList.toggle('active', theme === 'dark');
|
||||
lightContent.classList.toggle('active', theme === 'light');
|
||||
}
|
||||
|
||||
// Load first page of selected theme
|
||||
loadPage(section, theme, 1);
|
||||
}
|
||||
|
||||
function loadPage(section, theme, page) {
|
||||
const data = window.sectionData[section];
|
||||
const images = data[theme];
|
||||
const startIdx = (page - 1) * data.maxPerPage;
|
||||
const endIdx = Math.min(startIdx + data.maxPerPage, images.length);
|
||||
const pageImages = images.slice(startIdx, endIdx);
|
||||
|
||||
const contentDiv = document.getElementById(`${section}-${theme}-content`);
|
||||
if (contentDiv) {
|
||||
contentDiv.innerHTML = generateImageGrid(pageImages);
|
||||
}
|
||||
|
||||
// Update pagination buttons
|
||||
const pagerButtons = document.getElementById(`${section}-${theme}`)?.getElementsByClassName('pager-btn');
|
||||
if (pagerButtons) {
|
||||
for (let i = 0; i < pagerButtons.length; i++) {
|
||||
pagerButtons[i].classList.toggle('selected', i === page - 1);
|
||||
}
|
||||
}
|
||||
|
||||
initSectionState(section);
|
||||
sectionStates[section].currentPages[theme] = page;
|
||||
}
|
||||
|
||||
// Main theme functions
|
||||
const HIDDEN_CLASS = 'hidden';
|
||||
|
||||
function hideThemeSwitcher(currentTheme) {
|
||||
if (currentTheme === 'dark') {
|
||||
document.getElementById('dark-icon')?.classList.add(HIDDEN_CLASS);
|
||||
document.getElementById('light-icon')?.classList.remove(HIDDEN_CLASS);
|
||||
} else {
|
||||
document.getElementById('light-icon')?.classList.add(HIDDEN_CLASS);
|
||||
document.getElementById('dark-icon')?.classList.remove(HIDDEN_CLASS);
|
||||
}
|
||||
}
|
||||
|
||||
function setMainTheme(newTheme) {
|
||||
document.documentElement.style.setProperty('color-scheme', newTheme);
|
||||
hideThemeSwitcher(newTheme);
|
||||
}
|
||||
|
||||
function switchMainTheme() {
|
||||
const current = document.documentElement.style.getPropertyValue('color-scheme');
|
||||
setMainTheme(current === 'dark' ? 'light' : 'dark');
|
||||
}
|
||||
|
||||
// Initialize
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
EOF
|
||||
|
||||
echo " activeSection('${sections[0]}');" >> index.html
|
||||
|
||||
cat >> index.html << 'EOF'
|
||||
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
setMainTheme('dark');
|
||||
} else {
|
||||
setMainTheme('light');
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>" >> ./index.html
|
||||
</html>
|
||||
EOF
|
||||
|
||||
echo "Build complete! Generated $(echo ${#sections[@]}) sections with dynamic content loading."
|
||||
echo "Sections with light variants: ${sections_with_light[*]}"
|
||||
|
||||
@@ -0,0 +1,27 @@
|
||||
{
|
||||
"nodes": {
|
||||
"nixpkgs": {
|
||||
"locked": {
|
||||
"lastModified": 1761907660,
|
||||
"narHash": "sha256-kJ8lIZsiPOmbkJypG+B5sReDXSD1KGu2VEPNqhRa/ew=",
|
||||
"owner": "nixos",
|
||||
"repo": "nixpkgs",
|
||||
"rev": "2fb006b87f04c4d3bdf08cfdbc7fab9c13d94a15",
|
||||
"type": "github"
|
||||
},
|
||||
"original": {
|
||||
"owner": "nixos",
|
||||
"ref": "nixos-unstable",
|
||||
"repo": "nixpkgs",
|
||||
"type": "github"
|
||||
}
|
||||
},
|
||||
"root": {
|
||||
"inputs": {
|
||||
"nixpkgs": "nixpkgs"
|
||||
}
|
||||
}
|
||||
},
|
||||
"root": "root",
|
||||
"version": 7
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
{
|
||||
description = "Gruvbox-inspired wallpaper collection";
|
||||
|
||||
inputs.nixpkgs.url = "github:nixos/nixpkgs/nixos-unstable";
|
||||
|
||||
outputs = {
|
||||
self,
|
||||
nixpkgs,
|
||||
}: let
|
||||
systems = ["x86_64-linux" "aarch64-linux" "x86_64-darwin" "aarch64-darwin"];
|
||||
forAllSystems = f: nixpkgs.lib.genAttrs systems (system: f (import nixpkgs {inherit system;}));
|
||||
|
||||
mkWallpapersPkg = pkgs: name: path:
|
||||
pkgs.stdenv.mkDerivation {
|
||||
pname = "gruvbox-wallpapers-${name}";
|
||||
version = self.shortRev or "dev";
|
||||
src = ./.;
|
||||
installPhase = ''
|
||||
mkdir -p $out
|
||||
${
|
||||
if name == "default"
|
||||
then "find wallpapers -type f -exec cp {} $out/ \\;"
|
||||
else "cp -r ${path}/* $out/"
|
||||
}
|
||||
'';
|
||||
};
|
||||
|
||||
subdirs = {
|
||||
default = "wallpapers";
|
||||
anime = "wallpapers/anime";
|
||||
brands = "wallpapers/brands";
|
||||
game = "wallpapers/game";
|
||||
minimalistic = "wallpapers/minimalistic";
|
||||
mix = "wallpapers/mix";
|
||||
painting = "wallpapers/painting";
|
||||
photography = "wallpapers/photography";
|
||||
pixelart = "wallpapers/pixelart";
|
||||
renders = "wallpapers/renders";
|
||||
};
|
||||
in {
|
||||
formatter = forAllSystems (pkgs: pkgs.alejandra);
|
||||
|
||||
packages = forAllSystems (
|
||||
pkgs:
|
||||
nixpkgs.lib.mapAttrs (name: path: mkWallpapersPkg pkgs name path) subdirs
|
||||
);
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 1rem;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 640px) {
|
||||
main {
|
||||
padding: 0 4rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
main {
|
||||
padding: 0 8rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1024px) {
|
||||
main {
|
||||
padding: 0 12rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1280px) {
|
||||
main {
|
||||
padding: 0 14rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1536px) {
|
||||
main {
|
||||
padding: 0 18rem;
|
||||
}
|
||||
}
|
||||
@@ -1,98 +1,342 @@
|
||||
@import url("/layout.css");
|
||||
|
||||
:root {
|
||||
color-scheme: light dark;
|
||||
--bg-color: light-dark(#fbf1c7, #282828);
|
||||
--fg-color: light-dark(#3c3836, #ebdbb2);
|
||||
|
||||
--bg-color-reverse: light-dark(#3c3836, #ebdbb2);
|
||||
--fg-color-reverse: light-dark(#fbf1c7, #282828);
|
||||
|
||||
--bg-color-3: light-dark(#bdae93, #665c54);
|
||||
--bg-color-3-switch: light-dark(#665c54, #bdae93);
|
||||
--bg-color-hard: light-dark(#f9f5d7, #1d2021);
|
||||
--gray: light-dark(#7c6f64, #a89984);
|
||||
|
||||
--orange: #d65d0e;
|
||||
--red: #cc241d;
|
||||
--green: #98971a;
|
||||
--yellow: #d79921;
|
||||
--blue: #458588;
|
||||
--purple: #b16286;
|
||||
--aqua: #689d6a;
|
||||
|
||||
--orange-dim: light-dark(#af3a03, #fe8019);
|
||||
--red-dim: light-dark(#9d0006, #fb4934);
|
||||
--green-dim: light-dark(#79740e, #b8bb26);
|
||||
--yellow-dim: light-dark(#b57614, #fabd2f);
|
||||
--blue-dim: light-dark(#076678, #83a598);
|
||||
--purple-dim: light-dark(#8f3f71, #d3869d);
|
||||
--aqua-dim: light-dark(#427b58, #8ec07c);
|
||||
}
|
||||
|
||||
body {
|
||||
color: #ebdbb2;
|
||||
background-color: #282828;
|
||||
padding-left: 15%;
|
||||
padding-right: 15%;
|
||||
background-color: var(--bg-color);
|
||||
/*container-type: inline-size;*/
|
||||
font-family: "Curier New", monospace;
|
||||
margin: 0;
|
||||
min-height: 100svh;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
h1 {
|
||||
background-color: #ebdbb2;
|
||||
color: #282828;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
* {
|
||||
color: var(--fg-color);
|
||||
border: none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2 {
|
||||
background-color: #ebdbb2;
|
||||
color: #282828;
|
||||
background-color: var(--bg-color-reverse);
|
||||
color: var(--fg-color-reverse);
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #ebdbb2;
|
||||
/* background-color: #ebdbb2; */
|
||||
/* color: #282828; */
|
||||
.s1, .s2, .s3, .s4, .s5, .s6, .s7 {
|
||||
transition: background 0.7s ease-in-out;
|
||||
margin-bottom: 0;
|
||||
&:hover { background-color: var(--dim-color); }
|
||||
}
|
||||
|
||||
.showmore{
|
||||
text-align: center;
|
||||
background-color: #ebdbb2;
|
||||
color: #282828;
|
||||
/* border: 2px solid #ebdbb2; */
|
||||
}
|
||||
.s1 { background-color: var(--orange); --dim-color: var(--orange-dim); }
|
||||
.s2 { background-color: var(--red); --dim-color: var(--red-dim); }
|
||||
.s3 { background-color: var(--green); --dim-color: var(--green-dim); }
|
||||
.s4 { background-color: var(--yellow); --dim-color: var(--yellow-dim); }
|
||||
.s5 { background-color: var(--blue); --dim-color: var(--blue-dim); }
|
||||
.s6 { background-color: var(--purple); --dim-color: var(--purple-dim); }
|
||||
.s7 { background-color: var(--aqua); --dim-color: var(--aqua-dim); }
|
||||
|
||||
#s1 {
|
||||
background-color: #d65d0e;
|
||||
}
|
||||
#s2 {
|
||||
background-color: #cc241d;
|
||||
}
|
||||
#s3 {
|
||||
background-color: #98971a;
|
||||
}
|
||||
#s4 {
|
||||
background-color: #d79921;
|
||||
}
|
||||
#s5 {
|
||||
background-color: #458588;
|
||||
}
|
||||
#s6 {
|
||||
background-color: #b16286;
|
||||
}
|
||||
#s7 {
|
||||
background-color: #689d6a;
|
||||
}
|
||||
|
||||
/* #c1 { */
|
||||
/* background-color: #fe8019; */
|
||||
/* } */
|
||||
/* #c2 { */
|
||||
/* background-color: #fb4934; */
|
||||
/* } */
|
||||
/* #c3 { */
|
||||
/* background-color: #b8bb26; */
|
||||
/* } */
|
||||
/* #c4 { */
|
||||
/* background-color: #fabd2f; */
|
||||
/* } */
|
||||
/* #c5 { */
|
||||
/* background-color: #83a598; */
|
||||
/* } */
|
||||
/* #c6 { */
|
||||
/* background-color: #d3869b; */
|
||||
/* } */
|
||||
/* #c7 { */
|
||||
/* background-color: #8ec807; */
|
||||
/* } */
|
||||
|
||||
#c {
|
||||
.c {
|
||||
padding: 1em;
|
||||
background-color: #665c54;
|
||||
background-color: var(--bg-color-3);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
img {
|
||||
transition: all .2s ease-in-out;
|
||||
/* border: 2px solid #ebdbb2; */
|
||||
/* padding: 5px; */
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
img:hover {
|
||||
transform: scale(2.5);
|
||||
transform: scale(1.3);
|
||||
border: none;
|
||||
box-shadow: 5px 4px 10px #000000;
|
||||
/* padding: none; */
|
||||
|
||||
box-shadow: 5px 4px 10px black;
|
||||
}
|
||||
|
||||
.pager {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 10px;
|
||||
padding: 5px;
|
||||
color: var(--fg-color-reverse);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.btn {
|
||||
transition: background 0.4s ease-in-out;
|
||||
|
||||
cursor: pointer;
|
||||
background-color: var(--bg-color-reverse);
|
||||
color: var(--fg-color-reverse);
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--bg-color-3-switch);
|
||||
}
|
||||
}
|
||||
|
||||
.btn.pager-btn {
|
||||
padding: 10px 20px;
|
||||
font-size: 16px;
|
||||
font-weight: 900;
|
||||
margin: 4px 2px;
|
||||
|
||||
&.selected {
|
||||
background-color: var(--bg-color);
|
||||
color: var(--fg-color);
|
||||
|
||||
border-color: var(--fg-color);
|
||||
border-width: thick;
|
||||
border-style: solid;
|
||||
}
|
||||
}
|
||||
|
||||
.clickable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.section {
|
||||
display: none;
|
||||
|
||||
&.selected {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.float-btns {
|
||||
z-index: 10;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin-bottom: 1rem;
|
||||
margin-right: 1rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
justify-content: end;
|
||||
}
|
||||
|
||||
.btn.float-btn {
|
||||
height: 2.5rem;
|
||||
width: 2.5rem;
|
||||
font-size: 1.5rem;
|
||||
|
||||
& i {
|
||||
color: var(--fg-color-reverse);
|
||||
}
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* Add these styles to your existing style.css */
|
||||
|
||||
.subsection-theme-switch {
|
||||
text-align: center;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.btn.subsection-theme-btn {
|
||||
padding: 8px 16px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
margin: 0 4px;
|
||||
border-radius: 4px;
|
||||
|
||||
&.selected {
|
||||
background-color: var(--bg-color);
|
||||
color: var(--fg-color);
|
||||
border: 2px solid var(--fg-color);
|
||||
}
|
||||
|
||||
&:not(.selected) {
|
||||
opacity: 0.7;
|
||||
}
|
||||
}
|
||||
|
||||
.subsection-content {
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
/* Ensure subsection content containers are properly spaced */
|
||||
.section .subsection-content + .subsection-content {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* Enhanced theme switch styles - Add to your style.css */
|
||||
|
||||
.subsection-theme-switch {
|
||||
text-align: center;
|
||||
margin: 15px 0 20px 0;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
transition: all 0.3s ease-in-out;
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
|
||||
/* Show theme switch only when section is selected */
|
||||
.section.selected .subsection-theme-switch {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
/* Theme switch container styled like a toggle */
|
||||
.theme-toggle-container {
|
||||
display: inline-flex;
|
||||
background-color: var(--bg-color-3);
|
||||
border-radius: 25px;
|
||||
padding: 4px;
|
||||
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
|
||||
border: 2px solid var(--fg-color);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.theme-toggle-container::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
left: 4px;
|
||||
width: calc(50% - 4px);
|
||||
height: calc(100% - 8px);
|
||||
background: linear-gradient(135deg, var(--bg-color-reverse), var(--bg-color-3-switch));
|
||||
border-radius: 20px;
|
||||
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.theme-toggle-container.light-active::before {
|
||||
transform: translateX(100%);
|
||||
}
|
||||
|
||||
.btn.subsection-theme-btn {
|
||||
padding: 12px 24px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
border: none;
|
||||
background: transparent;
|
||||
color: var(--fg-color);
|
||||
cursor: pointer;
|
||||
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
border-radius: 20px;
|
||||
min-width: 80px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
|
||||
&:hover {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
&.selected {
|
||||
color: var(--fg-color-reverse);
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
&:not(.selected) {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
/* Add subtle glow effect for selected button */
|
||||
&.selected {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
&.selected::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border-radius: 20px;
|
||||
background: rgba(255, 255, 255, 0.1);
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Animation for button text */
|
||||
.btn.subsection-theme-btn {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.btn.subsection-theme-btn::before {
|
||||
content: attr(data-text);
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
transition: transform 0.3s ease;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.btn.subsection-theme-btn.selected::before {
|
||||
opacity: 1;
|
||||
transform: translate(-50%, -50%) scale(1.05);
|
||||
}
|
||||
|
||||
svg {
|
||||
stroke: var(--fg-color-reverse) !important;
|
||||
}
|
||||
|
||||
/* Responsive adjustments */
|
||||
@media screen and (max-width: 640px) {
|
||||
.btn.subsection-theme-btn {
|
||||
padding: 10px 20px;
|
||||
font-size: 12px;
|
||||
min-width: 70px;
|
||||
}
|
||||
|
||||
.theme-toggle-container {
|
||||
padding: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Dark mode specific adjustments */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.theme-toggle-container {
|
||||
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.theme-toggle-container::before {
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
}
|
||||
|
||||
|
After Width: | Height: | Size: 3.4 MiB |
|
After Width: | Height: | Size: 3.3 MiB |
|
After Width: | Height: | Size: 2.3 MiB |
|
After Width: | Height: | Size: 4.5 MiB |
|
After Width: | Height: | Size: 330 KiB |
|
After Width: | Height: | Size: 1.5 MiB |
|
After Width: | Height: | Size: 2.9 MiB |
|
After Width: | Height: | Size: 1006 KiB |
|
After Width: | Height: | Size: 2.5 MiB |
|
After Width: | Height: | Size: 775 KiB |
|
After Width: | Height: | Size: 76 KiB |
|
After Width: | Height: | Size: 1.5 MiB |
|
After Width: | Height: | Size: 1.4 MiB |
|
After Width: | Height: | Size: 442 KiB |
|
After Width: | Height: | Size: 387 KiB |
|
After Width: | Height: | Size: 60 KiB |
|
After Width: | Height: | Size: 14 MiB |
|
After Width: | Height: | Size: 801 KiB |
|
After Width: | Height: | Size: 5.4 MiB |
|
After Width: | Height: | Size: 850 KiB |
|
Before Width: | Height: | Size: 932 KiB |
|
After Width: | Height: | Size: 560 KiB |
|
After Width: | Height: | Size: 802 KiB |
|
After Width: | Height: | Size: 166 KiB |
|
After Width: | Height: | Size: 2.1 MiB |
|
After Width: | Height: | Size: 11 MiB |
|
After Width: | Height: | Size: 8.3 MiB |
|
After Width: | Height: | Size: 2.2 MiB |
|
After Width: | Height: | Size: 4.4 MiB |
|
After Width: | Height: | Size: 1.7 MiB |
|
After Width: | Height: | Size: 12 MiB |
|
After Width: | Height: | Size: 3.3 MiB |
|
After Width: | Height: | Size: 14 MiB |
|
Before Width: | Height: | Size: 4.0 MiB After Width: | Height: | Size: 4.0 MiB |
|
After Width: | Height: | Size: 256 KiB |
|
After Width: | Height: | Size: 291 KiB |
|
After Width: | Height: | Size: 435 KiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 1.7 MiB |
|
After Width: | Height: | Size: 3.1 MiB |
|
After Width: | Height: | Size: 1022 KiB |
|
After Width: | Height: | Size: 14 MiB |
|
After Width: | Height: | Size: 2.2 MiB |
|
After Width: | Height: | Size: 277 KiB |
|
After Width: | Height: | Size: 277 KiB |
|
After Width: | Height: | Size: 893 KiB |
|
After Width: | Height: | Size: 8.9 MiB |
|
After Width: | Height: | Size: 2.5 MiB |
|
After Width: | Height: | Size: 4.8 MiB |
|
After Width: | Height: | Size: 661 KiB |
|
After Width: | Height: | Size: 1.2 MiB |
|
After Width: | Height: | Size: 1.2 MiB |
|
After Width: | Height: | Size: 781 KiB |
|
After Width: | Height: | Size: 6.3 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 167 KiB |
|
After Width: | Height: | Size: 63 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 78 KiB |
|
After Width: | Height: | Size: 49 KiB |
|
After Width: | Height: | Size: 179 KiB |
|
Before Width: | Height: | Size: 79 KiB After Width: | Height: | Size: 79 KiB |
|
Before Width: | Height: | Size: 270 KiB After Width: | Height: | Size: 270 KiB |
|
After Width: | Height: | Size: 343 KiB |
|
After Width: | Height: | Size: 287 KiB |
|
After Width: | Height: | Size: 283 KiB |
|
After Width: | Height: | Size: 74 KiB |
|
After Width: | Height: | Size: 286 KiB |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 56 KiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 88 KiB |
|
After Width: | Height: | Size: 100 KiB |
|
After Width: | Height: | Size: 169 KiB |
|
After Width: | Height: | Size: 175 KiB |
|
After Width: | Height: | Size: 71 KiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 71 KiB |
|
After Width: | Height: | Size: 59 KiB |
|
After Width: | Height: | Size: 56 KiB |
|
After Width: | Height: | Size: 7.9 MiB |
|
After Width: | Height: | Size: 25 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
Before Width: | Height: | Size: 90 KiB After Width: | Height: | Size: 90 KiB |
|
After Width: | Height: | Size: 25 KiB |