Compare commits

...

2 commits

Author SHA1 Message Date
9058bb89d9
Add interests to interests page
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
2025-07-14 15:26:14 -06:00
09f8eda192
Nest media queries into CSS 2025-07-14 08:57:17 -06:00
12 changed files with 451 additions and 204 deletions

5
.postcssrc Normal file
View file

@ -0,0 +1,5 @@
{
"plugins": {
"postcss-custom-media": true
}
}

BIN
assets/dancerush.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 70 KiB

View file

@ -17,8 +17,10 @@
"@parcel/config-default": "^2.15.4",
"markdown-it-sup": "^2.0.0",
"parcel": "^2.15.4",
"postcss": "^8.5.6",
"postcss-custom-media": "^11.0.6",
"posthtml": "^0.16.6",
"posthtml-component": "^2.2.0",
"posthtml-component": "github:StratusFearMe21/posthtml-components#reorder_processing",
"posthtml-include": "^2.0.1",
"posthtml-markdownit": "^3.1.2"
},

192
pnpm-lock.yaml generated
View file

@ -30,12 +30,18 @@ importers:
parcel:
specifier: ^2.15.4
version: 2.15.4(@swc/helpers@0.5.17)
postcss:
specifier: ^8.5.6
version: 8.5.6
postcss-custom-media:
specifier: ^11.0.6
version: 11.0.6(postcss@8.5.6)
posthtml:
specifier: ^0.16.6
version: 0.16.6
posthtml-component:
specifier: ^2.2.0
version: 2.2.0
specifier: github:StratusFearMe21/posthtml-components#reorder_processing
version: https://codeload.github.com/StratusFearMe21/posthtml-components/tar.gz/476bad0284275f5d1ff32273602bf0c0bdd6de93
posthtml-include:
specifier: ^2.0.1
version: 2.0.1
@ -45,6 +51,30 @@ importers:
packages:
'@csstools/cascade-layer-name-parser@2.0.5':
resolution: {integrity: sha512-p1ko5eHgV+MgXFVa4STPKpvPxr6ReS8oS2jzTukjR74i5zJNyWO1ZM1m8YKBXnzDKWfBN1ztLYlHxbVemDD88A==}
engines: {node: '>=18'}
peerDependencies:
'@csstools/css-parser-algorithms': ^3.0.5
'@csstools/css-tokenizer': ^3.0.4
'@csstools/css-parser-algorithms@3.0.5':
resolution: {integrity: sha512-DaDeUkXZKjdGhgYaHNJTV9pV7Y9B3b644jCLs9Upc3VeNGg6LWARAT6O+Q+/COo+2gg/bM5rhpMAtf70WqfBdQ==}
engines: {node: '>=18'}
peerDependencies:
'@csstools/css-tokenizer': ^3.0.4
'@csstools/css-tokenizer@3.0.4':
resolution: {integrity: sha512-Vd/9EVDiu6PPJt9yAh6roZP6El1xHrdvIVGjyBsHR0RYwNHgL7FJPyIIW4fANJNG6FtyZfvlRPpFI4ZM/lubvw==}
engines: {node: '>=18'}
'@csstools/media-query-list-parser@4.0.3':
resolution: {integrity: sha512-HAYH7d3TLRHDOUQK4mZKf9k9Ph/m8Akstg66ywKR4SFAigjs3yBiUeZtFxywiTm5moZMAp/5W/ZuFnNXXYLuuQ==}
engines: {node: '>=18'}
peerDependencies:
'@csstools/css-parser-algorithms': ^3.0.5
'@csstools/css-tokenizer': ^3.0.4
'@lezer/common@1.2.3':
resolution: {integrity: sha512-w7ojc8ejBqr2REPsWxJjrMFsA/ysDCFICn8zEOR9mrqzOu2amhITYuLD8ag6XZf0CFXDrhKqw7+tW8cX66NaDA==}
@ -495,68 +525,68 @@ packages:
peerDependencies:
'@parcel/core': ^2.15.4
'@swc/core-darwin-arm64@1.12.11':
resolution: {integrity: sha512-J19Jj9Y5x/N0loExH7W0OI9OwwoVyxutDdkyq1o/kgXyBqmmzV7Y/Q9QekI2Fm/qc5mNeAdP7aj4boY4AY/JPw==}
'@swc/core-darwin-arm64@1.12.14':
resolution: {integrity: sha512-HNukQoOKgMsHSETj8vgGGKK3SEcH7Cz6k4bpntCxBKNkO3sH7RcBTDulWGGHJfZaDNix7Rw2ExUVWtLZlzkzXg==}
engines: {node: '>=10'}
cpu: [arm64]
os: [darwin]
'@swc/core-darwin-x64@1.12.11':
resolution: {integrity: sha512-PTuUQrfStQ6cjW+uprGO2lpQHy84/l0v+GqRqq8s/jdK55rFRjMfCeyf6FAR0l6saO5oNOQl+zWR1aNpj8pMQw==}
'@swc/core-darwin-x64@1.12.14':
resolution: {integrity: sha512-4Ttf3Obtk3MvFrR0e04qr6HfXh4L1Z+K3dRej63TAFuYpo+cPXeOZdPUddAW73lSUGkj+61IHnGPoXD3OQYy4Q==}
engines: {node: '>=10'}
cpu: [x64]
os: [darwin]
'@swc/core-linux-arm-gnueabihf@1.12.11':
resolution: {integrity: sha512-poxBq152HsupOtnZilenvHmxZ9a8SRj4LtfxUnkMDNOGrZR9oxbQNwEzNKfi3RXEcXz+P8c0Rai1ubBazXv8oQ==}
'@swc/core-linux-arm-gnueabihf@1.12.14':
resolution: {integrity: sha512-zhJOH2KWjtQpzJ27Xjw/RKLVOa1aiEJC2b70xbCwEX6ZTVAl8tKbhkZ3GMphhfVmLJ9gf/2UQR58oxVnsXqX5Q==}
engines: {node: '>=10'}
cpu: [arm]
os: [linux]
'@swc/core-linux-arm64-gnu@1.12.11':
resolution: {integrity: sha512-y1HNamR/D0Hc8xIE910ysyLe269UYiGaQPoLjQS0phzWFfWdMj9bHM++oydVXZ4RSWycO7KyJ3uvw4NilvyMKQ==}
'@swc/core-linux-arm64-gnu@1.12.14':
resolution: {integrity: sha512-akUAe1YrBqZf1EDdUxahQ8QZnJi8Ts6Ya0jf6GBIMvnXL4Y6QIuvKTRwfNxy7rJ+x9zpzP1Vlh14ZZkSKZ1EGA==}
engines: {node: '>=10'}
cpu: [arm64]
os: [linux]
'@swc/core-linux-arm64-musl@1.12.11':
resolution: {integrity: sha512-LlBxPh/32pyQsu2emMEOFRm7poEFLsw12Y1mPY7FWZiZeptomKSOSHRzKDz9EolMiV4qhK1caP1lvW4vminYgQ==}
'@swc/core-linux-arm64-musl@1.12.14':
resolution: {integrity: sha512-ZkOOIpSMXuPAjfOXEIAEQcrPOgLi6CaXvA5W+GYnpIpFG21Nd0qb0WbwFRv4K8BRtl993Q21v0gPpOaFHU+wdA==}
engines: {node: '>=10'}
cpu: [arm64]
os: [linux]
'@swc/core-linux-x64-gnu@1.12.11':
resolution: {integrity: sha512-bOjiZB8O/1AzHkzjge1jqX62HGRIpOHqFUrGPfAln/NC6NR+Z2A78u3ixV7k5KesWZFhCV0YVGJL+qToL27myA==}
'@swc/core-linux-x64-gnu@1.12.14':
resolution: {integrity: sha512-71EPPccwJiJUxd2aMwNlTfom2mqWEWYGdbeTju01tzSHsEuD7E6ePlgC3P3ngBqB3urj41qKs87z7zPOswT5Iw==}
engines: {node: '>=10'}
cpu: [x64]
os: [linux]
'@swc/core-linux-x64-musl@1.12.11':
resolution: {integrity: sha512-4dzAtbT/m3/UjF045+33gLiHd8aSXJDoqof7gTtu4q0ZyAf7XJ3HHspz+/AvOJLVo4FHHdFcdXhmo/zi1nFn8A==}
'@swc/core-linux-x64-musl@1.12.14':
resolution: {integrity: sha512-nImF1hZJqKTcl0WWjHqlelOhvuB9rU9kHIw/CmISBUZXogjLIvGyop1TtJNz0ULcz2Oxr3Q2YpwfrzsgvgbGkA==}
engines: {node: '>=10'}
cpu: [x64]
os: [linux]
'@swc/core-win32-arm64-msvc@1.12.11':
resolution: {integrity: sha512-h8HiwBZErKvCAmjW92JvQp0iOqm6bncU4ac5jxBGkRApabpUenNJcj3h2g5O6GL5K6T9/WhnXE5gyq/s1fhPQg==}
'@swc/core-win32-arm64-msvc@1.12.14':
resolution: {integrity: sha512-sABFQFxSuStFoxvEWZUHWYldtB1B4A9eDNFd4Ty50q7cemxp7uoscFoaCqfXSGNBwwBwpS5EiPB6YN4y6hqmLQ==}
engines: {node: '>=10'}
cpu: [arm64]
os: [win32]
'@swc/core-win32-ia32-msvc@1.12.11':
resolution: {integrity: sha512-1pwr325mXRNUhxTtXmx1IokV5SiRL+6iDvnt3FRXj+X5UvXXKtg2zeyftk+03u8v8v8WUr5I32hIypVJPTNxNg==}
'@swc/core-win32-ia32-msvc@1.12.14':
resolution: {integrity: sha512-KBznRB02NASkpepRdWIK4f1AvmaJCDipKWdW1M1xV9QL2tE4aySJFojVuG1+t0tVDkjRfwcZjycQfRoJ4RjD7Q==}
engines: {node: '>=10'}
cpu: [ia32]
os: [win32]
'@swc/core-win32-x64-msvc@1.12.11':
resolution: {integrity: sha512-5gggWo690Gvs7XiPxAmb5tHwzB9RTVXUV7AWoGb6bmyUd1OXYaebQF0HAOtade5jIoNhfQMQJ7QReRgt/d2jAA==}
'@swc/core-win32-x64-msvc@1.12.14':
resolution: {integrity: sha512-SymoP2CJHzrYaFKjWvuQljcF7BkTpzaS1vpywv7K9EzdTb5N8qPDvNd+PhWUqBz9JHBhbJxpaeTDQBXF/WWPmw==}
engines: {node: '>=10'}
cpu: [x64]
os: [win32]
'@swc/core@1.12.11':
resolution: {integrity: sha512-P3GM+0lqjFctcp5HhR9mOcvLSX3SptI9L1aux0Fuvgt8oH4f92rCUrkodAa0U2ktmdjcyIiG37xg2mb/dSCYSA==}
'@swc/core@1.12.14':
resolution: {integrity: sha512-CJSn2vstd17ddWIHBsjuD4OQnn9krQfaq6EO+w9YfId5DKznyPmzxAARlOXG99cC8/3Kli8ysKy6phL43bSr0w==}
engines: {node: '>=10'}
peerDependencies:
'@swc/helpers': '>=0.5.17'
@ -661,8 +691,8 @@ packages:
resolution: {integrity: sha512-uBq4egWHTcTt33a72vpSG0z3HnPuIl6NqYcTrKEg2azoEyl2hpW0zqlxysq2pK9HlDIHyHyakeYaYnSAwd8bow==}
engines: {node: '>=12'}
electron-to-chromium@1.5.181:
resolution: {integrity: sha512-+ISMj8OIQ+0qEeDj14Rt8WwcTOiqHyAB+5bnK1K7xNNLjBJ4hRCQfUkw8RWtcLbfBzDwc15ZnKH0c7SNOfwiyA==}
electron-to-chromium@1.5.183:
resolution: {integrity: sha512-vCrDBYjQCAEefWGjlK3EpoSKfKbT10pR4XXPdn65q7snuNOZnthoVpBfZPykmDapOKfoD+MMIPG8ZjKyyc9oHA==}
entities@2.2.0:
resolution: {integrity: sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==}
@ -829,6 +859,11 @@ packages:
msgpackr@1.11.4:
resolution: {integrity: sha512-uaff7RG9VIC4jacFW9xzL3jc0iM32DNHe4jYVycBcjUePT/Klnfj7pqtWJt9khvDFizmjN2TlYniYmSS2LIaZg==}
nanoid@3.3.11:
resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==}
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
hasBin: true
node-addon-api@6.1.0:
resolution: {integrity: sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA==}
@ -864,15 +899,26 @@ packages:
resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
engines: {node: '>=8.6'}
postcss-custom-media@11.0.6:
resolution: {integrity: sha512-C4lD4b7mUIw+RZhtY7qUbf4eADmb7Ey8BFA2px9jUbwg7pjTZDl4KY4bvlUV+/vXQvzQRfiGEVJyAbtOsCMInw==}
engines: {node: '>=18'}
peerDependencies:
postcss: ^8.4
postcss-value-parser@4.2.0:
resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
postcss@8.5.6:
resolution: {integrity: sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==}
engines: {node: ^10 || ^12 || >=14}
posthtml-attrs-parser@1.1.2:
resolution: {integrity: sha512-9Que9y4k8c33iv8h5QyTfHKlurmsJIscozy7oeFRxuWeX/osXjVGu9o9MKrmo4TI6Vr9a9vh9b4LYXqm3/GvhA==}
engines: {node: '>=16.0.0'}
posthtml-component@2.2.0:
resolution: {integrity: sha512-Nf8ejKuEjny0Tg71/xqRXvFyEMujH84FyYU/YoOKxwnC8fT8eQySj82PDVECwMcGsJt3UG91UvyD6Wco7EweFA==}
posthtml-component@https://codeload.github.com/StratusFearMe21/posthtml-components/tar.gz/476bad0284275f5d1ff32273602bf0c0bdd6de93:
resolution: {tarball: https://codeload.github.com/StratusFearMe21/posthtml-components/tar.gz/476bad0284275f5d1ff32273602bf0c0bdd6de93}
version: 2.2.0
engines: {node: '>=18'}
posthtml-expressions@1.11.4:
@ -931,6 +977,10 @@ packages:
engines: {node: '>=10'}
hasBin: true
source-map-js@1.2.1:
resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
engines: {node: '>=0.10.0'}
style-to-object@1.0.9:
resolution: {integrity: sha512-G4qppLgKu/k6FwRpHiGiKPaPTFcG3g4wNVX/Qsfu+RqQM30E7Tyu/TEgxcL9PNLF5pdRLwQdE3YKKf+KF2Dzlw==}
@ -971,6 +1021,22 @@ packages:
snapshots:
'@csstools/cascade-layer-name-parser@2.0.5(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)':
dependencies:
'@csstools/css-parser-algorithms': 3.0.5(@csstools/css-tokenizer@3.0.4)
'@csstools/css-tokenizer': 3.0.4
'@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4)':
dependencies:
'@csstools/css-tokenizer': 3.0.4
'@csstools/css-tokenizer@3.0.4': {}
'@csstools/media-query-list-parser@4.0.3(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)':
dependencies:
'@csstools/css-parser-algorithms': 3.0.5(@csstools/css-tokenizer@3.0.4)
'@csstools/css-tokenizer': 3.0.4
'@lezer/common@1.2.3': {}
'@lezer/lr@1.4.2':
@ -1243,7 +1309,7 @@ snapshots:
'@parcel/plugin': 2.15.4(@parcel/core@2.15.4(@swc/helpers@0.5.17))
'@parcel/source-map': 2.1.1
'@parcel/utils': 2.15.4
'@swc/core': 1.12.11(@swc/helpers@0.5.17)
'@swc/core': 1.12.14(@swc/helpers@0.5.17)
nullthrows: 1.1.1
transitivePeerDependencies:
- '@parcel/core'
@ -1260,7 +1326,7 @@ snapshots:
'@parcel/types': 2.15.4(@parcel/core@2.15.4(@swc/helpers@0.5.17))
'@parcel/utils': 2.15.4
'@parcel/workers': 2.15.4(@parcel/core@2.15.4(@swc/helpers@0.5.17))
'@swc/core': 1.12.11(@swc/helpers@0.5.17)
'@swc/core': 1.12.14(@swc/helpers@0.5.17)
semver: 7.7.2
transitivePeerDependencies:
- '@swc/helpers'
@ -1681,51 +1747,51 @@ snapshots:
transitivePeerDependencies:
- napi-wasm
'@swc/core-darwin-arm64@1.12.11':
'@swc/core-darwin-arm64@1.12.14':
optional: true
'@swc/core-darwin-x64@1.12.11':
'@swc/core-darwin-x64@1.12.14':
optional: true
'@swc/core-linux-arm-gnueabihf@1.12.11':
'@swc/core-linux-arm-gnueabihf@1.12.14':
optional: true
'@swc/core-linux-arm64-gnu@1.12.11':
'@swc/core-linux-arm64-gnu@1.12.14':
optional: true
'@swc/core-linux-arm64-musl@1.12.11':
'@swc/core-linux-arm64-musl@1.12.14':
optional: true
'@swc/core-linux-x64-gnu@1.12.11':
'@swc/core-linux-x64-gnu@1.12.14':
optional: true
'@swc/core-linux-x64-musl@1.12.11':
'@swc/core-linux-x64-musl@1.12.14':
optional: true
'@swc/core-win32-arm64-msvc@1.12.11':
'@swc/core-win32-arm64-msvc@1.12.14':
optional: true
'@swc/core-win32-ia32-msvc@1.12.11':
'@swc/core-win32-ia32-msvc@1.12.14':
optional: true
'@swc/core-win32-x64-msvc@1.12.11':
'@swc/core-win32-x64-msvc@1.12.14':
optional: true
'@swc/core@1.12.11(@swc/helpers@0.5.17)':
'@swc/core@1.12.14(@swc/helpers@0.5.17)':
dependencies:
'@swc/counter': 0.1.3
'@swc/types': 0.1.23
optionalDependencies:
'@swc/core-darwin-arm64': 1.12.11
'@swc/core-darwin-x64': 1.12.11
'@swc/core-linux-arm-gnueabihf': 1.12.11
'@swc/core-linux-arm64-gnu': 1.12.11
'@swc/core-linux-arm64-musl': 1.12.11
'@swc/core-linux-x64-gnu': 1.12.11
'@swc/core-linux-x64-musl': 1.12.11
'@swc/core-win32-arm64-msvc': 1.12.11
'@swc/core-win32-ia32-msvc': 1.12.11
'@swc/core-win32-x64-msvc': 1.12.11
'@swc/core-darwin-arm64': 1.12.14
'@swc/core-darwin-x64': 1.12.14
'@swc/core-linux-arm-gnueabihf': 1.12.14
'@swc/core-linux-arm64-gnu': 1.12.14
'@swc/core-linux-arm64-musl': 1.12.14
'@swc/core-linux-x64-gnu': 1.12.14
'@swc/core-linux-x64-musl': 1.12.14
'@swc/core-win32-arm64-msvc': 1.12.14
'@swc/core-win32-ia32-msvc': 1.12.14
'@swc/core-win32-x64-msvc': 1.12.14
'@swc/helpers': 0.5.17
'@swc/counter@0.1.3': {}
@ -1757,7 +1823,7 @@ snapshots:
browserslist@4.25.1:
dependencies:
caniuse-lite: 1.0.30001727
electron-to-chromium: 1.5.181
electron-to-chromium: 1.5.183
node-releases: 2.0.19
update-browserslist-db: 1.1.3(browserslist@4.25.1)
@ -1824,7 +1890,7 @@ snapshots:
dotenv@16.6.1: {}
electron-to-chromium@1.5.181: {}
electron-to-chromium@1.5.183: {}
entities@2.2.0: {}
@ -1980,6 +2046,8 @@ snapshots:
optionalDependencies:
msgpackr-extract: 3.0.3
nanoid@3.3.11: {}
node-addon-api@6.1.0: {}
node-addon-api@7.1.1: {}
@ -2024,11 +2092,25 @@ snapshots:
picomatch@2.3.1: {}
postcss-custom-media@11.0.6(postcss@8.5.6):
dependencies:
'@csstools/cascade-layer-name-parser': 2.0.5(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)
'@csstools/css-parser-algorithms': 3.0.5(@csstools/css-tokenizer@3.0.4)
'@csstools/css-tokenizer': 3.0.4
'@csstools/media-query-list-parser': 4.0.3(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)
postcss: 8.5.6
postcss-value-parser@4.2.0: {}
postcss@8.5.6:
dependencies:
nanoid: 3.3.11
picocolors: 1.1.1
source-map-js: 1.2.1
posthtml-attrs-parser@1.1.2: {}
posthtml-component@2.2.0:
posthtml-component@https://codeload.github.com/StratusFearMe21/posthtml-components/tar.gz/476bad0284275f5d1ff32273602bf0c0bdd6de93:
dependencies:
lodash: 4.17.21
posthtml: 0.16.6
@ -2095,6 +2177,8 @@ snapshots:
semver@7.7.2: {}
source-map-js@1.2.1: {}
style-to-object@1.0.9:
dependencies:
inline-style-parser: 0.2.4

View file

@ -0,0 +1,46 @@
<script props>
module.exports = {
onclick: props.onclick || '',
titlestyle: props.titlestyle || '',
headerstyle: props.headerstyle || '',
person: props.person,
}
</script>
<div class="interest">
<a href="/src/who_we_are.html#{{person}}" hx-get="/partials/who_we_are.html" hx-push-url="/who_we_are.html#{{person}}"
hx-swap="innerHtml show:#{{person}}:top">
<div class="figure">
<img src="/assets/{{person}}.jpg" class="person">
</div>
</a>
<svg height="4rem" width="4rem" viewBox="0 0 4 4" style="min-width: 4rem;">
<circle cx="2" cy="2" r="2" fill="#484848"></circle>
</svg>
<x-project onclick="{{onclick}}" titlestyle="{{titlestyle}}" headerstyle="{{headerstyle}}">
<if condition="$slots.img?.filled">
<fill:img>
<slot:img></slot:img>
</fill:img>
</if>
<if condition="$slots.title?.filled">
<fill:title>
<slot:title></slot:title>
</fill:title>
</if>
<if condition="$slots.links?.filled">
<fill:links>
<slot:links></slot:links>
</fill:links>
</if>
<if condition="$slots.subtitle?.filled">
<fill:subtitle>
<slot:subtitle></slot:subtitle>
</fill:subtitle>
</if>
<if condition="$slots.description?.filled">
<fill:description>
<slot:description></slot:description>
</fill:description>
</if>
</x-project>
</div>

View file

@ -0,0 +1,17 @@
<script props>
module.exports = {
href: props.href,
}
</script>
<a href="https://instagram.com/{{href}}" target="_blank" aria-label="{{href}} on GitHub">
<svg width="16pt" height="16pt" version="1.1" viewBox="0 0 16 16" xml:space="preserve"
xmlns="http://www.w3.org/2000/svg">
<g fill="#fff" stroke-width=".66667">
<path
d="m8 1.4413c2.136 0 2.3893 8e-3 3.2327 0.046667 0.872 0.04 1.77 0.23867 2.4053 0.874 0.64133 0.64133 0.834 1.5307 0.874 2.4053 0.038666 0.84333 0.046666 1.0967 0.046666 3.2327 0 2.136-8e-3 2.3893-0.046666 3.2327-0.039334 0.86733-0.24267 1.774-0.874 2.4053-0.64133 0.64133-1.53 0.834-2.4053 0.874-0.84333 0.038666-1.0967 0.046666-3.2327 0.046666-2.136 0-2.3893-8e-3 -3.2327-0.046666-0.86067-0.039334-1.7793-0.24733-2.4053-0.874-0.638-0.638-0.834-1.536-0.874-2.4053-0.038667-0.84333-0.046667-1.0967-0.046667-3.2327 0-2.136 8e-3 -2.3893 0.046667-3.2327 0.039333-0.864 0.24467-1.776 0.874-2.4053 0.64-0.64 1.5327-0.834 2.4053-0.874 0.84333-0.038667 1.0967-0.046667 3.2327-0.046667m0-1.4413c-2.1727 0-2.4453 0.0093333-3.2987 0.048-1.2367 0.056667-2.4647 0.40067-3.3587 1.2947-0.89733 0.89733-1.238 2.1227-1.2947 3.3587-0.038667 0.85333-0.048 1.126-0.048 3.2987 0 2.1727 0.0093333 2.4453 0.048 3.2987 0.056667 1.2353 0.402 2.4667 1.2947 3.3587 0.89667 0.89667 2.124 1.238 3.3587 1.2947 0.85333 0.038666 1.126 0.048 3.2987 0.048 2.1727 0 2.4453-0.009334 3.2987-0.048 1.236-0.056667 2.4653-0.40133 3.3587-1.2947 0.898-0.898 1.238-2.1227 1.2947-3.3587 0.038666-0.85333 0.048-1.126 0.048-3.2987 0-2.1727-0.009334-2.4453-0.048-3.2987-0.056667-1.2367-0.40133-2.4653-1.2947-3.3587-0.89533-0.89533-2.126-1.2387-3.3587-1.2947-0.85333-0.038667-1.126-0.048-3.2987-0.048z" />
<path
d="m8 3.892c-2.2687 0-4.108 1.8393-4.108 4.108 0 2.2687 1.8393 4.108 4.108 4.108 2.2687 0 4.108-1.8393 4.108-4.108 0-2.2687-1.8393-4.108-4.108-4.108zm0 6.7747c-1.4727 0-2.6667-1.194-2.6667-2.6667s1.194-2.6667 2.6667-2.6667 2.6667 1.194 2.6667 2.6667-1.194 2.6667-2.6667 2.6667z" />
<circle cx="12.271" cy="3.7293" r=".96" />
</g>
</svg>
</a>

View file

@ -0,0 +1,30 @@
<script props>
module.exports = {
onclick: props.onclick || '',
titlestyle: props.titlestyle || '',
headerstyle: props.headerstyle || '',
}
</script>
<div class="project">
<if condition="$slots.img?.filled || $slots.links?.filled">
<div class="project-title" style="{{titlestyle}}">
<if condition="$slots.img?.filled">
<div class="figure">
<slot:img></slot:img>
</div>
</if>
<slot:title></slot:title>
<if condition="$slots.links?.filled">
<div class="links">
<slot:links></slot:links>
</div>
</if>
</div>
</if>
<div class="description">
<div onclick="{{onclick}}" style="{{headerstyle}}">
<slot:subtitle></slot:subtitle>
</div>
<slot:description></slot:description>
</div>
</div>

View file

@ -1,28 +0,0 @@
<script props>
module.exports = {
onclick: props.onclick || '',
titlestyle: props.titlestyle || '',
headerstyle: props.headerstyle || '',
}
</script>
<div class="project">
<div class="project-title" style="{{titlestyle}}">
<if condition="$slots.img?.filled">
<div class="figure">
<slot:img></slot:img>
</div>
</if>
<slot:title></slot:title>
<if condition="$slots.links?.filled">
<div class="links">
<slot:links></slot:links>
</div>
</if>
</div>
<div class="description">
<div onclick="{{onclick}}" style="{{headerstyle}}">
<slot:subtitle></slot:subtitle>
</div>
<slot:description></slot:description>
</div>
</div>

View file

@ -4,20 +4,62 @@
That's crazy
</x-blockquote>
</x-section-head>
<x-project>
<x-interest person="isaac">
<fill:description>
<markdown>
I love listening to the **works** albums from **Diverse System** while I'm working! Here's a 24-hour livestream
from them
</markdown>
<iframe src="https://www.youtube-nocookie.com/embed/HXB5A7Psifk" title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</fill:description>
</x-interest>
<x-interest class="project-alt" person="richard">
<fill:img>
<x-project.text>?</x-project.text>
<img src="/assets/dancerush.png">
</fill:img>
<fill:title>
<markdown>
# Coming soon to theaters
# Dance Rush
</markdown>
</fill:title>
<fill:subtitle>
<markdown>
## This website is under construction
## Very good game
</markdown>
</fill:subtitle>
<fill:description>We'll get to it, trust</fill:description>
</x-project>
<fill:description>
<!-- <markdown> -->
<!-- I love going over to Round One in Provo, Utah and tearing it up on the dance floor! -->
<!-- </markdown> -->
</fill:description>
</x-interest>
<x-interest person="isaac">
<fill:description>
<markdown>
I also love listening to Diverse System's **AD:** albums in my free time as well. This is a highlight reel of
one of my
favorites.
</markdown>
<iframe src="https://www.youtube-nocookie.com/embed/gNGcEwi2e5M" title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</fill:description>
</x-interest>
<x-interest class="project-alt" person="isaac">
<fill:person>
<img src="/assets/isaac.jpg" class="person">
</fill:person>
<fill:description>
<markdown>
My favorite artist under Diverse System has gotta be **xi**. This is a highlight reel of my favorite album
by them.
</markdown>
<iframe src="https://www.youtube-nocookie.com/embed/ii8t_TZluvA?si=-PrfEwqZqAbMeFWS" title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</fill:description>
</x-interest>
</x-tab.content>

View file

@ -44,7 +44,7 @@
</fill:title>
<fill:links>
<x-link.github href="richgrov/simulo"></x-link.github>
<x-link.website href="https://simulo.grover.sh" referencing="Simulo"></x-link.website>
<x-link.website href="https://simulo.tech" referencing="Simulo"></x-link.website>
</fill:links>
<fill:subtitle>
<markdown>

View file

@ -29,16 +29,12 @@
Tyson, let's get out of here
</x-blockquote>
</fill:subtitle>
<!-- <fill:description> -->
<!-- <markdown> -->
<!-- I have a passion for helping entertainment find it's place in the world. Where some people see brains rotting, I -->
<!-- see oppurtunities for generations to be brought closer together, empowered with critical thinking. I've been -->
<!-- writing code -->
<!-- since I was -->
<!-- 12, -->
<!-- and creating value since I was 17. -->
<!-- </markdown> -->
<!-- </fill:description> -->
<fill:description>
<markdown>
I think the rest of the card explains enough about me ngl. I don't think another bit of text would add much
value
</markdown>
</fill:description>
</x-project>
<x-project class="project-alt" id="tyson">
<fill:img>
@ -65,48 +61,52 @@
Step on it, Richard!
</x-blockquote>
</fill:subtitle>
<fill:description>
<markdown>
I love everything from making distributed systems, to physically building them. I'm in my element when I'm
making software with Python, and deploying it via Docker.
</markdown>
</fill:description>
<!-- <fill:description> -->
<!-- <markdown> -->
<!-- I love everything from making distributed systems, to physically building them. I'm in my element when I'm -->
<!-- making software with Python, and deploying it via Docker. -->
<!-- </markdown> -->
<!-- </fill:description> -->
</x-project>
<!-- <x-project id="gunnar"> -->
<!-- <fill:img> -->
<!-- <img src="/assets/gunnar.jpg" class="person"> -->
<!-- </fill:img> -->
<!-- <fill:title> -->
<!-- <markdown> -->
<!-- # Gunnar Huscroft -->
<!-- </markdown> -->
<!-- <x-link href="projects.html" show="c0re"> -->
<!-- <markdown> -->
<!-- #### CEO of c0re (same thing) -->
<!-- </markdown> -->
<!-- </x-link> -->
<!-- </fill:title> -->
<!-- <fill:links> -->
<!-- <x-link.github href="Ghussy"></x-link.github> -->
<!-- <x-link.website href="https://churchofjesuschrist.org/" referencing="Gunnar"></x-link.website> -->
<!-- <x-link.youtube href="UCApj2bfCQRDWym4684z2TXQ"></x-link.youtube> -->
<!-- <x-link.linkedin href="gunnarhuscroft"></x-link.linkedin> -->
<!-- <x-link.x href="ChEEEky_SCRUB"></x-link.x> -->
<!-- </fill:links> -->
<!-- <fill:subtitle> -->
<!-- <x-blockquote cite="C.S. Lewis"> -->
<!-- Nothing but the courage and unselfishness of individuals is ever going to make any system work properly -->
<!-- </x-blockquote> -->
<!-- </fill:subtitle> -->
<!-- <fill:description> -->
<!-- <markdown> -->
<!-- Some people believe in test-driven development, or compiler-driven development. But I believe in values-driven -->
<!-- development. My passion lies in using my skills to help lift other people up, and leave the world better than I -->
<!-- found it. -->
<!-- </markdown> -->
<!-- </fill:description> -->
<!-- </x-project> -->
<x-project id="khayden">
<x-project id="gunnar">
<fill:img>
<img src="/assets/gunnar.jpg" class="person">
</fill:img>
<fill:title>
<markdown>
# Gunnar Huscroft
</markdown>
<x-link href="projects.html" show="c0re">
<markdown>
#### CEO of c0re (same thing)
</markdown>
</x-link>
</fill:title>
<fill:links>
<x-link.github href="Ghussy"></x-link.github>
<!-- <x-link.website href="https://churchofjesuschrist.org/" referencing="Gunnar"></x-link.website> -->
<x-link.youtube href="UCApj2bfCQRDWym4684z2TXQ"></x-link.youtube>
<x-link.linkedin href="gunnarhuscroft"></x-link.linkedin>
<x-link.x href="ChEEEky_SCRUB"></x-link.x>
<x-link.instagram href=""></x-link.instagram>
</fill:links>
<fill:subtitle>
<x-blockquote cite="C.S. Lewis">
Nothing but the courage and unselfishness of individuals is ever going to make any system work properly
</x-blockquote>
<!-- <x-blockquote cite="Gunnar"> -->
<!-- Placeholder -->
<!-- </x-blockquote> -->
</fill:subtitle>
<!-- <fill:description> -->
<!-- <markdown> -->
<!-- Some people believe in test-driven development, or compiler-driven development. But I believe in values-driven -->
<!-- development. My passion lies in using my skills to help lift other people up, and leave the world better than I -->
<!-- found it. -->
<!-- </markdown> -->
<!-- </fill:description> -->
</x-project>
<x-project class="project-alt" id="khayden">
<fill:img>
<img src="/assets/khayden.jpg" class="person">
</fill:img>
@ -136,7 +136,7 @@
</markdown>
</fill:description>
</x-project>
<x-project class="project-alt" id="isaac">
<x-project id="isaac">
<fill:img>
<img src="/assets/isaac.jpg" class="person">
</fill:img>

View file

@ -1,9 +1,18 @@
@custom-media --tablet only screen and (max-width: 1200px);
@custom-media --phone only screen and (max-width: 800px);
@custom-media --smaller-phone only screen and (max-width: 500px);
:root {
--energy: 0px;
--page-width: min(100%, 1024px);
color: white;
}
html {
color-scheme: dark;
font-family: system-ui;
}
.title {
font-size: min(10vw, 36pt);
margin-bottom: 48px;
@ -18,13 +27,18 @@
h1 {
font-size: 48pt;
}
@media (--tablet) {
text-align: center;
display: flex;
flex-direction: column-reverse;
}
}
center:has(> blockquote) {
margin: 10px auto;
font-size: min(5vw, 22pt);
padding: 15px;
border-radius: 5px;
}
blockquote {
@ -43,11 +57,10 @@ blockquote {
&+p {
text-align: right;
}
}
html {
color-scheme: dark;
font-family: system-ui;
@media (--phone) {
margin: 0px auto;
}
}
#page-content {
@ -77,21 +90,91 @@ html {
padding: 0 40;
}
.project-alt {
flex-direction: row-reverse;
}
.project {
background-color: #484848;
padding: 16px 24px;
display: flex;
align-items: center;
margin: 32px;
padding: 24px;
border-radius: 5rem;
iframe {
width: 100%;
aspect-ratio: 16/9;
margin: 16pt 0;
}
&>div {
padding: 16px;
}
@media (--phone) {
flex-direction: column;
padding: 32px;
&>div {
padding-top: 0;
padding-bottom: 0;
}
}
@media (--smaller-phone) {
margin: 8px;
p {
font-size: 14pt;
}
iframe {
margin: 14pt 0;
}
}
}
.interest {
display: flex;
align-items: flex-start;
justify-content: space-between;
.person {
width: 128px;
margin: 25px;
}
.project {
border-radius: 5rem;
padding: 36px;
}
@media (--tablet) {
flex-direction: column;
align-items: flex-start;
padding: 18px;
&.project-alt {
align-items: flex-end;
}
}
@media (--smaller-phone) {
.project {
margin: 0;
}
}
}
.project-title {
min-width: 275px;
@media (--smaller-phone) {
min-width: 0;
}
h1 {
font-size: 24pt;
margin: 0;
@ -100,6 +183,10 @@ html {
.description {
width: 100%;
@media (--phone) {
width: unset;
}
}
.links {
@ -127,6 +214,24 @@ html {
font-weight: bold;
border-bottom: solid 6px #eee;
}
@media only screen and (max-width: 550px) {
flex-direction: column;
a {
background-color: transparent;
border: solid 3px #999;
font-size: 16pt;
padding: 8px;
}
a[aria-selected=true] {
background-color: #eee;
font-weight: bold;
color: black;
border: solid 12px #eee;
}
}
}
.figure {
@ -139,9 +244,6 @@ html {
}
}
.project-alt {
flex-direction: row-reverse;
}
.person {
clip-path: circle(50%);
@ -193,57 +295,4 @@ a {
color: inherit;
/* no underline */
text-decoration: none;
}
@media only screen and (max-width: 1200px) {
.section-header {
text-align: center;
display: flex;
flex-direction: column-reverse;
}
}
@media only screen and (max-width: 700px) {
.description {
width: unset;
}
.project {
flex-direction: column;
padding: 18px;
&>div {
padding-top: 0;
padding-bottom: 0;
}
p {
font-size: 14pt;
}
}
blockquote {
margin: 0px auto;
}
}
@media only screen and (max-width: 500px) {
.tab-list {
flex-direction: column;
a {
background-color: transparent;
border: solid 3px #999;
font-size: 16pt;
padding: 8px;
}
a[aria-selected=true] {
background-color: #eee;
font-weight: bold;
color: black;
border: solid 12px #eee;
}
}
}