hyprwm/hyprland-website
1
0
Fork 0
mirror of https://github.com/hyprwm/hyprland-website.git synced 2024-11-17 02:45:59 +01:00
Code Issues Projects Releases Packages Wiki Activity

playing around

Browse source
This commit is contained in:
Christofer 2023-07-23 01:49:29 +02:00
parent 7e97ddccee
commit 40a6544b85
9 changed files with 301 additions and 82 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
package.json
View file

@ -47,6 +47,9 @@
"type": "module", "type": "module",
"dependencies": { "dependencies": {
"clsx": "^1.2.1", "clsx": "^1.2.1",
"less": "^4.1.3",
"remeda": "^1.24.0",
"sass": "^1.64.1",
"simplex-noise": "^4.0.1", "simplex-noise": "^4.0.1",
"svelte-inview": "^4.0.1", "svelte-inview": "^4.0.1",
"tailwindcss-animate": "^1.0.6", "tailwindcss-animate": "^1.0.6",

174
pnpm-lock.yaml
View file

@ -8,6 +8,15 @@ dependencies:
clsx: clsx:
specifier: ^1.2.1 specifier: ^1.2.1
version: 1.2.1 version: 1.2.1
less:
specifier: ^4.1.3
version: 4.1.3
remeda:
specifier: ^1.24.0
version: 1.24.0
sass:
specifier: ^1.64.1
version: 1.64.1
simplex-noise: simplex-noise:
specifier: ^4.0.1 specifier: ^4.0.1
version: 4.0.1 version: 4.0.1
@ -66,7 +75,7 @@ devDependencies:
version: 4.0.1 version: 4.0.1
svelte-check: svelte-check:
specifier: ^3.4.3 specifier: ^3.4.3
version: 3.4.4(postcss@8.4.25)(svelte@4.0.1) version: 3.4.4(less@4.1.3)(postcss@8.4.25)(sass@1.64.1)(svelte@4.0.1)
tailwindcss: tailwindcss:
specifier: ^3.3.2 specifier: ^3.3.2
version: 3.3.2 version: 3.3.2
@ -75,7 +84,7 @@ devDependencies:
version: 5.1.6 version: 5.1.6
vite: vite:
specifier: ^4.3.6 specifier: ^4.3.6
version: 4.3.9 version: 4.3.9(less@4.1.3)(sass@1.64.1)
packages: packages:
@ -473,7 +482,7 @@ packages:
sirv: 2.0.3 sirv: 2.0.3
svelte: 4.0.1 svelte: 4.0.1
undici: 5.22.1 undici: 5.22.1
vite: 4.3.9 vite: 4.3.9(less@4.1.3)(sass@1.64.1)
transitivePeerDependencies: transitivePeerDependencies:
- supports-color - supports-color
dev: true dev: true
@ -489,7 +498,7 @@ packages:
'@sveltejs/vite-plugin-svelte': 2.4.2(svelte@4.0.1)(vite@4.3.9) '@sveltejs/vite-plugin-svelte': 2.4.2(svelte@4.0.1)(vite@4.3.9)
debug: 4.3.4 debug: 4.3.4
svelte: 4.0.1 svelte: 4.0.1
vite: 4.3.9 vite: 4.3.9(less@4.1.3)(sass@1.64.1)
transitivePeerDependencies: transitivePeerDependencies:
- supports-color - supports-color
dev: true dev: true
@ -508,7 +517,7 @@ packages:
magic-string: 0.30.0 magic-string: 0.30.0
svelte: 4.0.1 svelte: 4.0.1
svelte-hmr: 0.15.2(svelte@4.0.1) svelte-hmr: 0.15.2(svelte@4.0.1)
vite: 4.3.9 vite: 4.3.9(less@4.1.3)(sass@1.64.1)
vitefu: 0.2.4(vite@4.3.9) vitefu: 0.2.4(vite@4.3.9)
transitivePeerDependencies: transitivePeerDependencies:
- supports-color - supports-color
@ -715,6 +724,11 @@ packages:
engines: {node: '>= 0.6'} engines: {node: '>= 0.6'}
dev: true dev: true
/copy-anything@2.0.6:
resolution: {integrity: sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==}
dependencies:
is-what: 3.14.1
/cross-spawn@7.0.3: /cross-spawn@7.0.3:
resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==} resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
engines: {node: '>= 8'} engines: {node: '>= 8'}
@ -735,6 +749,17 @@ packages:
engines: {node: '>=4'} engines: {node: '>=4'}
hasBin: true hasBin: true
/debug@3.2.7:
resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==}
peerDependencies:
supports-color: '*'
peerDependenciesMeta:
supports-color:
optional: true
dependencies:
ms: 2.1.2
optional: true
/debug@4.3.4: /debug@4.3.4:
resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==} resolution: {integrity: sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==}
engines: {node: '>=6.0'} engines: {node: '>=6.0'}
@ -785,6 +810,14 @@ packages:
resolution: {integrity: sha512-pmf1rbAStw8UEQ0sr2cdJtWl48ZMuPD9Sto8HVQOq9vx9j2WgDEN6lYoaqFvqEHYOmGA9oRGn7LqWI9ta0YugQ==} resolution: {integrity: sha512-pmf1rbAStw8UEQ0sr2cdJtWl48ZMuPD9Sto8HVQOq9vx9j2WgDEN6lYoaqFvqEHYOmGA9oRGn7LqWI9ta0YugQ==}
dev: true dev: true
/errno@0.1.8:
resolution: {integrity: sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==}
hasBin: true
requiresBuild: true
dependencies:
prr: 1.0.1
optional: true
/es6-promise@3.3.1: /es6-promise@3.3.1:
resolution: {integrity: sha512-SOp9Phqvqn7jtEUxPWdWfWoLmyt2VaJ6MpvP9Comy1MceMXqE6bxvaTu4iaxpYYPzhny28Lc+M87/c2cPK6lDg==} resolution: {integrity: sha512-SOp9Phqvqn7jtEUxPWdWfWoLmyt2VaJ6MpvP9Comy1MceMXqE6bxvaTu4iaxpYYPzhny28Lc+M87/c2cPK6lDg==}
dev: true dev: true
@ -1107,7 +1140,6 @@ packages:
/graceful-fs@4.2.11: /graceful-fs@4.2.11:
resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==} resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
dev: true
/graphemer@1.4.0: /graphemer@1.4.0:
resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==} resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
@ -1129,11 +1161,28 @@ packages:
engines: {node: '>=10.17.0'} engines: {node: '>=10.17.0'}
dev: false dev: false
/iconv-lite@0.6.3:
resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
engines: {node: '>=0.10.0'}
dependencies:
safer-buffer: 2.1.2
optional: true
/ignore@5.2.4: /ignore@5.2.4:
resolution: {integrity: sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==} resolution: {integrity: sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==}
engines: {node: '>= 4'} engines: {node: '>= 4'}
dev: true dev: true
/image-size@0.5.5:
resolution: {integrity: sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==}
engines: {node: '>=0.10.0'}
hasBin: true
requiresBuild: true
optional: true
/immutable@4.3.1:
resolution: {integrity: sha512-lj9cnmB/kVS0QHsJnYKD1uo3o39nrbKxszjnqS9Fr6NB7bZzW45U6WSGBPKXDL/CvDKqDNPA4r3DoDQ8GTxo2A==}
/import-fresh@3.3.0: /import-fresh@3.3.0:
resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==} resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==}
engines: {node: '>=6'} engines: {node: '>=6'}
@ -1200,6 +1249,9 @@ packages:
engines: {node: '>=8'} engines: {node: '>=8'}
dev: false dev: false
/is-what@3.14.1:
resolution: {integrity: sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==}
/isexe@2.0.0: /isexe@2.0.0:
resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==} resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
@ -1235,6 +1287,25 @@ packages:
resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==} resolution: {integrity: sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==}
dev: false dev: false
/less@4.1.3:
resolution: {integrity: sha512-w16Xk/Ta9Hhyei0Gpz9m7VS8F28nieJaL/VyShID7cYvP6IL5oHeL6p4TXSDJqZE/lNv0oJ2pGVjJsRkfwm5FA==}
engines: {node: '>=6'}
hasBin: true
dependencies:
copy-anything: 2.0.6
parse-node-version: 1.0.1
tslib: 2.6.0
optionalDependencies:
errno: 0.1.8
graceful-fs: 4.2.11
image-size: 0.5.5
make-dir: 2.1.0
mime: 1.6.0
needle: 3.2.0
source-map: 0.6.1
transitivePeerDependencies:
- supports-color
/levn@0.4.1: /levn@0.4.1:
resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==} resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==}
engines: {node: '>= 0.8.0'} engines: {node: '>= 0.8.0'}
@ -1288,6 +1359,15 @@ packages:
dependencies: dependencies:
'@jridgewell/sourcemap-codec': 1.4.15 '@jridgewell/sourcemap-codec': 1.4.15
/make-dir@2.1.0:
resolution: {integrity: sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==}
engines: {node: '>=6'}
requiresBuild: true
dependencies:
pify: 4.0.1
semver: 5.7.2
optional: true
/mdn-data@2.0.30: /mdn-data@2.0.30:
resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==} resolution: {integrity: sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==}
@ -1306,6 +1386,13 @@ packages:
braces: 3.0.2 braces: 3.0.2
picomatch: 2.3.1 picomatch: 2.3.1
/mime@1.6.0:
resolution: {integrity: sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==}
engines: {node: '>=4'}
hasBin: true
requiresBuild: true
optional: true
/mime@3.0.0: /mime@3.0.0:
resolution: {integrity: sha512-jSCU7/VB1loIWBZe14aEYHU/+1UMEHoaO7qxCOVJOw9GgH72VAWppxNcjU+x9a2k3GSIBXNKxXQFqRvvZ7vr3A==} resolution: {integrity: sha512-jSCU7/VB1loIWBZe14aEYHU/+1UMEHoaO7qxCOVJOw9GgH72VAWppxNcjU+x9a2k3GSIBXNKxXQFqRvvZ7vr3A==}
engines: {node: '>=10.0.0'} engines: {node: '>=10.0.0'}
@ -1367,6 +1454,19 @@ packages:
resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==} resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
dev: true dev: true
/needle@3.2.0:
resolution: {integrity: sha512-oUvzXnyLiVyVGoianLijF9O/RecZUf7TkBfimjGrLM4eQhXyeJwM6GeAWccwfQ9aa4gMCZKqhAOuLaMIcQxajQ==}
engines: {node: '>= 4.4.x'}
hasBin: true
requiresBuild: true
dependencies:
debug: 3.2.7
iconv-lite: 0.6.3
sax: 1.2.4
transitivePeerDependencies:
- supports-color
optional: true
/node-releases@2.0.13: /node-releases@2.0.13:
resolution: {integrity: sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==} resolution: {integrity: sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==}
dev: true dev: true
@ -1438,6 +1538,10 @@ packages:
callsites: 3.1.0 callsites: 3.1.0
dev: true dev: true
/parse-node-version@1.0.1:
resolution: {integrity: sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==}
engines: {node: '>= 0.10'}
/path-exists@4.0.0: /path-exists@4.0.0:
resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==} resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==}
engines: {node: '>=8'} engines: {node: '>=8'}
@ -1475,6 +1579,11 @@ packages:
resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==} resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
engines: {node: '>=0.10.0'} engines: {node: '>=0.10.0'}
/pify@4.0.1:
resolution: {integrity: sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==}
engines: {node: '>=6'}
optional: true
/pirates@4.0.6: /pirates@4.0.6:
resolution: {integrity: sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==} resolution: {integrity: sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==}
engines: {node: '>= 6'} engines: {node: '>= 6'}
@ -1598,6 +1707,10 @@ packages:
hasBin: true hasBin: true
dev: true dev: true
/prr@1.0.1:
resolution: {integrity: sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==}
optional: true
/punycode@2.3.0: /punycode@2.3.0:
resolution: {integrity: sha512-rRV+zQD8tVFys26lAGR9WUuS4iUAngJScM+ZRSKtvl5tKeZ2t5bvdNFdNHBW9FWR4guGHlgmsZ1G7BSm2wTbuA==} resolution: {integrity: sha512-rRV+zQD8tVFys26lAGR9WUuS4iUAngJScM+ZRSKtvl5tKeZ2t5bvdNFdNHBW9FWR4guGHlgmsZ1G7BSm2wTbuA==}
engines: {node: '>=6'} engines: {node: '>=6'}
@ -1617,6 +1730,10 @@ packages:
dependencies: dependencies:
picomatch: 2.3.1 picomatch: 2.3.1
/remeda@1.24.0:
resolution: {integrity: sha512-tjLxwU4yLtvX8yHlePnE7CdQXRe2pKatlVY+AunqAQV5t9FNw1yuiIAqKpu6zevd+No5LQHEJ/HK3r3ZFK7KXg==}
dev: false
/resolve-from@4.0.0: /resolve-from@4.0.0:
resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==} resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==}
engines: {node: '>=4'} engines: {node: '>=4'}
@ -1668,6 +1785,10 @@ packages:
mri: 1.2.0 mri: 1.2.0
dev: true dev: true
/safer-buffer@2.1.2:
resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
optional: true
/sander@0.5.1: /sander@0.5.1:
resolution: {integrity: sha512-3lVqBir7WuKDHGrKRDn/1Ye3kwpXaDOMsiRP1wd6wpZW56gJhsbp5RqQpA6JG/P+pkXizygnr1dKR8vzWaVsfA==} resolution: {integrity: sha512-3lVqBir7WuKDHGrKRDn/1Ye3kwpXaDOMsiRP1wd6wpZW56gJhsbp5RqQpA6JG/P+pkXizygnr1dKR8vzWaVsfA==}
dependencies: dependencies:
@ -1677,6 +1798,24 @@ packages:
rimraf: 2.7.1 rimraf: 2.7.1
dev: true dev: true
/sass@1.64.1:
resolution: {integrity: sha512-16rRACSOFEE8VN7SCgBu1MpYCyN7urj9At898tyzdXFhC+a+yOX5dXwAR7L8/IdPJ1NB8OYoXmD55DM30B2kEQ==}
engines: {node: '>=14.0.0'}
hasBin: true
dependencies:
chokidar: 3.5.3
immutable: 4.3.1
source-map-js: 1.0.2
/sax@1.2.4:
resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==}
optional: true
/semver@5.7.2:
resolution: {integrity: sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==}
hasBin: true
optional: true
/semver@7.5.3: /semver@7.5.3:
resolution: {integrity: sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ==} resolution: {integrity: sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ==}
engines: {node: '>=10'} engines: {node: '>=10'}
@ -1730,6 +1869,12 @@ packages:
resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==} resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==}
engines: {node: '>=0.10.0'} engines: {node: '>=0.10.0'}
/source-map@0.6.1:
resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
engines: {node: '>=0.10.0'}
requiresBuild: true
optional: true
/streamsearch@1.1.0: /streamsearch@1.1.0:
resolution: {integrity: sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==} resolution: {integrity: sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==}
engines: {node: '>=10.0.0'} engines: {node: '>=10.0.0'}
@ -1783,7 +1928,7 @@ packages:
resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==} resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
engines: {node: '>= 0.4'} engines: {node: '>= 0.4'}
/svelte-check@3.4.4(postcss@8.4.25)(svelte@4.0.1): /svelte-check@3.4.4(less@4.1.3)(postcss@8.4.25)(sass@1.64.1)(svelte@4.0.1):
resolution: {integrity: sha512-Uys9+R65cj8TmP8f5UpS7B2xKpNLYNxEWJsA5ZoKcWq/uwvABFF7xS6iPQGLoa7hxz0DS6xU60YFpmq06E4JxA==} resolution: {integrity: sha512-Uys9+R65cj8TmP8f5UpS7B2xKpNLYNxEWJsA5ZoKcWq/uwvABFF7xS6iPQGLoa7hxz0DS6xU60YFpmq06E4JxA==}
hasBin: true hasBin: true
peerDependencies: peerDependencies:
@ -1796,7 +1941,7 @@ packages:
picocolors: 1.0.0 picocolors: 1.0.0
sade: 1.8.1 sade: 1.8.1
svelte: 4.0.1 svelte: 4.0.1
svelte-preprocess: 5.0.4(postcss@8.4.25)(svelte@4.0.1)(typescript@5.1.6) svelte-preprocess: 5.0.4(less@4.1.3)(postcss@8.4.25)(sass@1.64.1)(svelte@4.0.1)(typescript@5.1.6)
typescript: 5.1.6 typescript: 5.1.6
transitivePeerDependencies: transitivePeerDependencies:
- '@babel/core' - '@babel/core'
@ -1844,7 +1989,7 @@ packages:
svelte: 4.0.1 svelte: 4.0.1
dev: false dev: false
/svelte-preprocess@5.0.4(postcss@8.4.25)(svelte@4.0.1)(typescript@5.1.6): /svelte-preprocess@5.0.4(less@4.1.3)(postcss@8.4.25)(sass@1.64.1)(svelte@4.0.1)(typescript@5.1.6):
resolution: {integrity: sha512-ABia2QegosxOGsVlsSBJvoWeXy1wUKSfF7SWJdTjLAbx/Y3SrVevvvbFNQqrSJw89+lNSsM58SipmZJ5SRi5iw==} resolution: {integrity: sha512-ABia2QegosxOGsVlsSBJvoWeXy1wUKSfF7SWJdTjLAbx/Y3SrVevvvbFNQqrSJw89+lNSsM58SipmZJ5SRi5iw==}
engines: {node: '>= 14.10.0'} engines: {node: '>= 14.10.0'}
requiresBuild: true requiresBuild: true
@ -1884,8 +2029,10 @@ packages:
dependencies: dependencies:
'@types/pug': 2.0.6 '@types/pug': 2.0.6
detect-indent: 6.1.0 detect-indent: 6.1.0
less: 4.1.3
magic-string: 0.27.0 magic-string: 0.27.0
postcss: 8.4.25 postcss: 8.4.25
sass: 1.64.1
sorcery: 0.11.0 sorcery: 0.11.0
strip-indent: 3.0.0 strip-indent: 3.0.0
svelte: 4.0.1 svelte: 4.0.1
@ -1982,6 +2129,9 @@ packages:
resolution: {integrity: sha512-ZyNm28Lsg34Co5DS3e9DVyjlX2Y+2exkI4jqTKyU+9/OL6Y2fKOOuL8i+7no71o74C6mVS+UFoP3ekM3iCT1HQ==} resolution: {integrity: sha512-ZyNm28Lsg34Co5DS3e9DVyjlX2Y+2exkI4jqTKyU+9/OL6Y2fKOOuL8i+7no71o74C6mVS+UFoP3ekM3iCT1HQ==}
dev: false dev: false
/tslib@2.6.0:
resolution: {integrity: sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA==}
/type-check@0.4.0: /type-check@0.4.0:
resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==} resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
engines: {node: '>= 0.8.0'} engines: {node: '>= 0.8.0'}
@ -2064,7 +2214,7 @@ packages:
/util-deprecate@1.0.2: /util-deprecate@1.0.2:
resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==} resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
/vite@4.3.9: /vite@4.3.9(less@4.1.3)(sass@1.64.1):
resolution: {integrity: sha512-qsTNZjO9NoJNW7KnOrgYwczm0WctJ8m/yqYAMAK9Lxt4SoySUfS5S8ia9K7JHpa3KEeMfyF8LoJ3c5NeBJy6pg==} resolution: {integrity: sha512-qsTNZjO9NoJNW7KnOrgYwczm0WctJ8m/yqYAMAK9Lxt4SoySUfS5S8ia9K7JHpa3KEeMfyF8LoJ3c5NeBJy6pg==}
engines: {node: ^14.18.0 || >=16.0.0} engines: {node: ^14.18.0 || >=16.0.0}
hasBin: true hasBin: true
@ -2090,8 +2240,10 @@ packages:
optional: true optional: true
dependencies: dependencies:
esbuild: 0.17.19 esbuild: 0.17.19
less: 4.1.3
postcss: 8.4.25 postcss: 8.4.25
rollup: 3.26.0 rollup: 3.26.0
sass: 1.64.1
optionalDependencies: optionalDependencies:
fsevents: 2.3.2 fsevents: 2.3.2
dev: true dev: true
@ -2104,7 +2256,7 @@ packages:
vite: vite:
optional: true optional: true
dependencies: dependencies:
vite: 4.3.9 vite: 4.3.9(less@4.1.3)(sass@1.64.1)
dev: true dev: true
/webpack-sources@3.2.3: /webpack-sources@3.2.3:

15
src/lib/Helper.mjs
View file

@ -1,5 +1,5 @@
import { inview } from 'svelte-inview' import { inview } from 'svelte-inview'
import { pick } from 'remeda'
// const mappingAnimate = { // const mappingAnimate = {
// slide: 'translate', // slide: 'translate',
// zoom: 'scale', // zoom: 'scale',
@ -23,7 +23,9 @@ export function animateIn(node, options) {
options.duration ??= 840 options.duration ??= 840
const style = Object.entries(options) const effects = Object.entries(pick(options, ['fade', 'zoom', 'slide']))
const style = effects
.map(([effect, value], _, all) => { .map(([effect, value], _, all) => {
if (effect === 'slide') return `translate: 0px ${value}px` if (effect === 'slide') return `translate: 0px ${value}px`
@ -42,10 +44,11 @@ export function animateIn(node, options) {
node.addEventListener('inview_enter', callback) node.addEventListener('inview_enter', callback)
function callback() { function callback() {
console.log('Callbacked!!') effects.forEach(([effect]) => {
node.style.opacity = '1' if (effect === 'slide') node.style.translate = '0 0'
node.style.scale = '1 1' else if (effect === 'fade') node.style.opacity = '1'
node.style.translate = '0 0' else if (effect === 'zoom') node.style.scale = '1 1'
})
} }
return { destroy: observer.destroy } return { destroy: observer.destroy }

2
src/routes/+page.svelte
View file

@ -22,7 +22,7 @@
<HallOfFameSlice /> <HallOfFameSlice />
<div class="px-8 lg:px-32"><Community /></div> <Community />
</div> </div>
<div class="mt-[16rem]" /> <div class="mt-[16rem]" />

52
src/routes/Community.svelte
View file

@ -1,9 +1,59 @@
<script lang="ts"> <script lang="ts">
import Button from '$lib/components/Button.svelte'
import DiscordIcon from '~icons/prime/discord'
</script> </script>
<section> <section class="relative overflow-hidden w-screen min-h-max h-[850px]">
<h1 class="text-8xl font-bold text-center mb-8">Join a great community</h1> <h1 class="text-8xl font-bold text-center mb-8">Join a great community</h1>
<div class="text-center font-extrabold text-slate-300"> <div class="text-center font-extrabold text-slate-300">
Get help from Distro Hoppers, Haiku writers, Hydrohomies and human_(probably) Get help from Distro Hoppers, Haiku writers, Hydrohomies and human_(probably)
</div> </div>
<div class="flex flex-col w-full items-center">
<div class="w-28 h-28"><DiscordIcon class="h-full w-full" /></div>
<a href="https://discord.com/invite/hQ9XvMUjjr">
<Button type="fancyOutline">Join us on Discord</Button>
</a>
</div>
<div class=" absolute inset-0 w-[1024px]">
<div class="_bg-color bg-yellow-500 top-[146px] right-[17px] w-[359px] h-[207px] opacity-20" />
<div class="_bg-color bg-orange-500 top-[411px] right-0 w-[400px] h-[300px] opacity-30" />
<div class="_bg-color bg-purple-500 opacity-30 w-[321px] h-[295px] top-[209px] left-[368px]" />
<div class="_bg-color bg-cyan-500 opacity-30 w-[363px] h-[250px] left-[402px] top-[462px]" />
<div class="_bg-color bg-red-500 opacity-30 w-[323px] h-[482px] left-[53px] top-[179px]" />
<div class="_bg-color bg-fuchsia-500 opacity-30 w-[243px] h-[167px] left-[135px] top-[596px]" />
</div>
</section> </section>
<style lang="sass">
// taken from https://codepen.io/mikegolus/pen/Jegvym?editors=1100
$quantity: 6
._bg-color
position: absolute
animation: ease 200s alternate infinite
pointer-events: none
animation: drift ease alternate infinite
filter: blur(80px)
border-radius: 50%
z-index: -50
// Randomize Motion
@for $i from 1 through $quantity
$steps: random(12) + 16
._bg-color:nth-child(#{$i})
// animation-name: move#{$i}
animation-duration: random(6000) + 50000ms
animation-delay: 0ms, random(8000) + 500ms
@keyframes move#{$i}
@for $step from 0 through $steps
#{$step * (100 / $steps)}%
transform: translateX(random(50) - 50px) translateY(random(50) - 50px) scale(calc(random(5) / 100 + 0.95))
</style>

46
src/routes/FameRicePreview.svelte Normal file
View file

@ -0,0 +1,46 @@
<script>
import { animateIn } from '$lib/Helper.mjs'
/** @type {{ name: string, url: string }} */
export let createdBy
/** @type {string}
* The path to the image. Usually the file within `static`, but can also be an URL
*/
export let image
/** @type {string | undefined} */
export let imageClass = undefined
/** @type {string | undefined} */
export let containerClass = undefined
</script>
<div
class="rice {containerClass} group"
use:animateIn={{ fade: 0, duration: 1200, threshold: 0.4 }}
>
<img
src={image}
alt="Rice desktop"
class="w-full nice-hover object-cover object-top rounded-xl overflow-hidden shadow-2xl hover:scale-[1.01] {imageClass}"
/>
<img src={image} alt="Rice desktop" aria-hidden="true" class="rice-bg" />
<div class="group-hover:opacity-100 opacity-0 transition-opacity absolute top-6 right-6 p-4">
{createdBy.name}
{createdBy.url}
</div>
</div>
<style lang="postcss">
.rice {
@apply relative w-full max-w-[1100px];
}
.nice-hover {
transition: transform 540ms cubic-bezier(0.1, -0.81, 0.31, 2);
}
.rice-bg {
@apply w-[calc(100%-24px)] pointer-events-none transition-[filter] duration-500 absolute left-3 brightness-150 rounded-3xl -z-10 saturate-[5] h-full blur-2xl -bottom-10 opacity-50;
.rice:hover & {
@apply brightness-200;
}
}
</style>

78
src/routes/HallOfFameSlice.svelte
View file

@ -1,78 +1,56 @@
<script lang="ts"> <script lang="ts">
import { animateIn } from '$lib/Helper.mjs' import { animateIn } from '$lib/Helper.mjs'
import Button from '$lib/components/Button.svelte' import Button from '$lib/components/Button.svelte'
import FameRicePreview from './FameRicePreview.svelte'
</script> </script>
<section <section
class="w-full relative" class="w-full relative"
use:animateIn={{ fade: 0, slide: 24, duration: 1200, threshold: 0.1 }} use:animateIn={{ fade: 0, slide: 24, duration: 1200, threshold: 0.1 }}
> >
<div class="text-center font-extrabold mb-3 text-slate-300">Memorials of the ricing legends</div> <div class="absolute inset-0">
<h1 class="text-8xl font-bold text-center">Hall of Fame</h1> <div class="text-center font-extrabold mb-3 text-slate-300">
Memorials of the ricing legends
</div>
<h1 class="text-8xl font-bold text-center">Hall of Fame</h1>
</div>
<div <div
class="w-full flex relative flex-col gap-16 lg:gap-24 items-center pt-16 overflow-hidden px-16" class="w-full flex relative flex-col gap-16 lg:gap-24 items-center justify-end pt-16 overflow-hidden px-16 [perspective:100px]"
> >
<div class="rice" use:animateIn={{ fade: 0, slide: 24, duration: 1200, threshold: 0.4 }}> <a class="absolute bottom-24 left-1/2 z-20 -translate-x-1/2" href="/hall-of-fame">
<img
src="/imgs/env_4 novelknock-10.png"
alt="Rice desktop"
class="w-full nice-hover rounded-xl overflow-hidden shadow-2xl hover:scale-[1.01]"
/>
<img
src="/imgs/env_4 novelknock-10.png"
alt="Rice desktop"
aria-hidden="true"
class="rice-bg"
/>
</div>
<div class="rice" use:animateIn={{ slide: 48, duration: 1400, threshold: 0.4 }}>
<img
src="/imgs/ricingcomp1/amadeus.png"
alt="Rice desktop"
class="w-full rounded-t-xl overflow-hidden nice-hover hover:scale-[1.005] shadow-2xl object-cover object-top h-[200px] sm:h-[250px] lg:h-[500px] ] bottom-rice"
/>
<img
src="/imgs/ricingcomp1/amadeus.png"
alt="Rice desktop"
aria-hidden="true"
class="rice-bg clop"
/>
</div>
<a class="absolute bottom-16 left-1/2 z-20 -translate-x-1/2" href="/hall-of-fame">
<Button size="lg" type="fancyOutline">Go to Hall of Fame</Button> <Button size="lg" type="fancyOutline">Go to Hall of Fame</Button>
</a> </a>
<FameRicePreview
createdBy={{ name: 'flicko', url: 'http://flicko.com' }}
image="/imgs/ricingcomp1/flicko.png"
containerClass="[translate:0px_0px_-100px] -mb-[30%] hover:[translate:0px_0px_-70px] hover:mb-[-15%] transition-all duration-500"
imageClass="[mask-image:linear-gradient(black_50%,transparent_95%)] "
/>
<FameRicePreview
createdBy={{ name: 'flicko', url: 'http://flicko.com' }}
image="/imgs/env_4 novelknock-10.png"
containerClass="[translate:0px_0px_-40px] -mb-[30%]"
imageClass="[mask-image:linear-gradient(black,transparent_95%)]"
/>
<FameRicePreview
createdBy={{ name: 'flicko', url: 'http://flicko.com' }}
image="/imgs/ricingcomp1/amadeus.png"
imageClass="rounded-none [mask-image:linear-gradient(black,transparent)] rounded-t-xl h-[200px] sm:h-[250px] lg:h-[500px]"
/>
</div> </div>
<div class="glow" /> <div class="glow" />
</section> </section>
<style lang="postcss"> <style lang="postcss">
.rice {
@apply relative w-full max-w-[1100px];
}
.nice-hover {
transition: transform 540ms cubic-bezier(0.1, -0.81, 0.31, 2);
}
.rice-bg {
@apply w-[calc(100%-24px)] pointer-events-none transition-[filter] duration-500 absolute left-3 brightness-150 rounded-3xl -z-10 saturate-[5] h-full blur-2xl -bottom-10 opacity-50;
.rice:hover & {
@apply brightness-200;
}
}
.bottom-rice {
mask-image: linear-gradient(black, transparent);
}
.glow { .glow {
@apply h-[200px] lg:h-[400px]; @apply h-[200px] lg:h-[400px];
width: 100%; width: 100%;
/* min-width: 8800px; */ /* min-width: 8800px; */
position: absolute; position: absolute;
opacity: 0.8; opacity: 0.5;
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;

13
src/routes/Hero.svelte
View file

@ -96,19 +96,6 @@
animate: title_effect 1s ease infinite alternate; animate: title_effect 1s ease infinite alternate;
} }
@keyframes title_effect {
0% {
transform: translateX(-99px);
opacity: 0;
}
50% {
transform: translateX(0px);
}
100% {
transform: translateX(9px);
}
}
@keyframes move { @keyframes move {
0% { 0% {
transform: translate3d( transform: translate3d(

BIN
static/imgs/env_4 novelknock-10.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.8 MiB

After

Width:  |  Height:  |  Size: 1.9 MiB