chore: migrate mailing list to component, add SEO to collections layout, fix image loading

This commit is contained in:
Corbin Crutchley
2022-10-06 18:28:56 -07:00
parent d6bbd7226c
commit d2fec4c908
11 changed files with 332 additions and 309 deletions

174
package-lock.json generated
View File

@@ -13,19 +13,19 @@
"probe-image-size": "^7.2.3" "probe-image-size": "^7.2.3"
}, },
"devDependencies": { "devDependencies": {
"@astrojs/image": "^0.9.1", "@astrojs/image": "^0.9.2",
"@astrojs/mdx": "^0.11.4", "@astrojs/mdx": "^0.11.4",
"@astrojs/preact": "^1.1.1", "@astrojs/preact": "^1.1.1",
"@remark-embedder/core": "^3.0.1", "@remark-embedder/core": "^3.0.1",
"@remark-embedder/transformer-oembed": "^3.0.0", "@remark-embedder/transformer-oembed": "^3.0.0",
"@types/classnames": "^2.3.1", "@types/classnames": "^2.3.1",
"@types/node": "^18.8.2", "@types/node": "^18.8.3",
"@types/parse5": "^7.0.0", "@types/parse5": "^7.0.0",
"@types/uuid": "^8.3.4", "@types/uuid": "^8.3.4",
"@typescript-eslint/eslint-plugin": "^5.39.0", "@typescript-eslint/eslint-plugin": "^5.39.0",
"@typescript-eslint/parser": "^5.39.0", "@typescript-eslint/parser": "^5.39.0",
"@vercel/node": "^2.5.21", "@vercel/node": "^2.5.22",
"astro": "^1.4.4", "astro": "^1.4.5",
"astro-icon": "^0.7.3", "astro-icon": "^0.7.3",
"classnames": "^2.3.2", "classnames": "^2.3.2",
"dayjs": "^1.11.5", "dayjs": "^1.11.5",
@@ -58,7 +58,7 @@
"rollup-plugin-copy": "^3.4.0", "rollup-plugin-copy": "^3.4.0",
"sass": "^1.55.0", "sass": "^1.55.0",
"slash": "^5.0.0", "slash": "^5.0.0",
"terser": "^5.15.0", "terser": "^5.15.1",
"unified": "^10.1.2", "unified": "^10.1.2",
"unist-util-replace-all-between": "^0.1.1", "unist-util-replace-all-between": "^0.1.1",
"unist-util-visit": "^4.1.1" "unist-util-visit": "^4.1.1"
@@ -218,9 +218,9 @@
"dev": true "dev": true
}, },
"node_modules/@astrojs/image": { "node_modules/@astrojs/image": {
"version": "0.9.1", "version": "0.9.2",
"resolved": "https://registry.npmjs.org/@astrojs/image/-/image-0.9.1.tgz", "resolved": "https://registry.npmjs.org/@astrojs/image/-/image-0.9.2.tgz",
"integrity": "sha512-tnrL9tL539gIzkM9oqRd+asOePPUE/ehtQjmrcsTjJtQx8aPhKHEteJIMuDhby94wRhV6vMK1Wqt4u5DBf6GQQ==", "integrity": "sha512-kmCcV9Nwk43Ll3AZFMwAk7ljzQP+WkJuEcKU6svGgN1vSAPS7CUFTQNFCGt80ZIiP4YOF7NR172XDAlBTFi4YA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@altano/tiny-async-pool": "^1.0.2", "@altano/tiny-async-pool": "^1.0.2",
@@ -2388,18 +2388,18 @@
"dev": true "dev": true
}, },
"node_modules/@edge-runtime/primitives": { "node_modules/@edge-runtime/primitives": {
"version": "1.1.0-beta.34", "version": "1.1.0-beta.36",
"resolved": "https://registry.npmjs.org/@edge-runtime/primitives/-/primitives-1.1.0-beta.34.tgz", "resolved": "https://registry.npmjs.org/@edge-runtime/primitives/-/primitives-1.1.0-beta.36.tgz",
"integrity": "sha512-gFubu4qIqg1k6sOM2Ho/txFUE/vZCn057wGiY0NIQ8h6tySiUO5FULCaebPrp+Yfxb3ZCWqDLeWanQGFB3TYQQ==", "integrity": "sha512-Tji7SGWmn1+JGSnzFtWUoS7+kODIFprTyIAw0EBOVWEQKWfs7r0aTEm1XkJR0+d1jP9f0GB5LBKG/Z7KFyhx7g==",
"dev": true "dev": true
}, },
"node_modules/@edge-runtime/vm": { "node_modules/@edge-runtime/vm": {
"version": "1.1.0-beta.32", "version": "1.1.0-beta.36",
"resolved": "https://registry.npmjs.org/@edge-runtime/vm/-/vm-1.1.0-beta.32.tgz", "resolved": "https://registry.npmjs.org/@edge-runtime/vm/-/vm-1.1.0-beta.36.tgz",
"integrity": "sha512-G0SH80am2XjlK6oFI3RoKlg1SBS5ZAeqakYasfNhJEXqM7g7tsoh5jURMQcNxpLvo48XBTgHgAVEMzhAGgDPZg==", "integrity": "sha512-uPZmL7X+lKBFJsTg8nC0qPDBx4JGgpRqlgJi2s77g2NOtqitQOI90BfIKHZSSoMQEwTqfvAkpu2ui8nazOwHxA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@edge-runtime/primitives": "^1.1.0-beta.32" "@edge-runtime/primitives": "1.1.0-beta.36"
} }
}, },
"node_modules/@emmetio/abbreviation": { "node_modules/@emmetio/abbreviation": {
@@ -5961,9 +5961,9 @@
} }
}, },
"node_modules/@types/node": { "node_modules/@types/node": {
"version": "18.8.2", "version": "18.8.3",
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.8.2.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-18.8.3.tgz",
"integrity": "sha512-cRMwIgdDN43GO4xMWAfJAecYn8wV4JbsOGHNfNUIDiuYkUYAR5ec4Rj7IO2SAhFPEfpPtLtUTbbny/TCT7aDwA==", "integrity": "sha512-0os9vz6BpGwxGe9LOhgP/ncvYN5Tx1fNcd2TM3rD/aCGBkysb+ZWpXEocG24h6ZzOi13+VB8HndAQFezsSOw1w==",
"dev": true "dev": true
}, },
"node_modules/@types/node-fetch": { "node_modules/@types/node-fetch": {
@@ -6449,23 +6449,23 @@
} }
}, },
"node_modules/@vercel/build-utils": { "node_modules/@vercel/build-utils": {
"version": "5.5.3", "version": "5.5.4",
"resolved": "https://registry.npmjs.org/@vercel/build-utils/-/build-utils-5.5.3.tgz", "resolved": "https://registry.npmjs.org/@vercel/build-utils/-/build-utils-5.5.4.tgz",
"integrity": "sha512-T4MYD87rwocybIQzv4giRFYiisQqFLZOsPXn5tglQfnsB0DJM47l8VW9oFgGX2cJyp/px7C/ovdLrhwY/XWhYQ==", "integrity": "sha512-urAVFyrH6NTznN8bG1S4KHMpMwEaRXMRMeUXuMZXdGiznB83pACZ/5xpSzaLTIKrOrdYWVUrGcFjhLDMVRqCWQ==",
"dev": true "dev": true
}, },
"node_modules/@vercel/node": { "node_modules/@vercel/node": {
"version": "2.5.21", "version": "2.5.22",
"resolved": "https://registry.npmjs.org/@vercel/node/-/node-2.5.21.tgz", "resolved": "https://registry.npmjs.org/@vercel/node/-/node-2.5.22.tgz",
"integrity": "sha512-sJajTZYCDl4euWHuOgL5xzR7eLyi5Xv58j/QgI0tkOhMrREpqW9Jv2K2eSRDDuPDMbUgqqK14LodHApLlenizA==", "integrity": "sha512-phlgW4qHGEt/yQ/nbGCd3vrFM0n48/MBbvmAKgTeVE/mjzdWxPnuSHNQlaipJkzfT3tv8kiiJu9ZoicuDoACTw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@edge-runtime/vm": "1.1.0-beta.32", "@edge-runtime/vm": "1.1.0-beta.36",
"@types/node": "*", "@types/node": "*",
"@vercel/build-utils": "5.5.3", "@vercel/build-utils": "5.5.4",
"@vercel/node-bridge": "3.0.0", "@vercel/node-bridge": "3.0.0",
"@vercel/static-config": "2.0.3", "@vercel/static-config": "2.0.3",
"edge-runtime": "1.1.0-beta.32", "edge-runtime": "1.1.0-beta.37",
"esbuild": "0.14.47", "esbuild": "0.14.47",
"exit-hook": "2.2.1", "exit-hook": "2.2.1",
"node-fetch": "2.6.7", "node-fetch": "2.6.7",
@@ -7635,12 +7635,12 @@
} }
}, },
"node_modules/astro": { "node_modules/astro": {
"version": "1.4.4", "version": "1.4.5",
"resolved": "https://registry.npmjs.org/astro/-/astro-1.4.4.tgz", "resolved": "https://registry.npmjs.org/astro/-/astro-1.4.5.tgz",
"integrity": "sha512-vxuHJ8C/3/NDau6EDUvi83JFDBK5Ylmo6VGAsUkdnutpGw77I4NoapoN56ANmU54ucYiu+x0apEPQvesY6GZiQ==", "integrity": "sha512-7uflNdFMsAONkEdtNRqP1XgtgdUhiiFfYd3DjtaoaskYhcnfKKYy8Lht0stIQaMtAqITIy0LLTDvDM/j8SfuUw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@astrojs/compiler": "^0.25.0", "@astrojs/compiler": "^0.26.0",
"@astrojs/language-server": "^0.26.2", "@astrojs/language-server": "^0.26.2",
"@astrojs/markdown-remark": "^1.1.3", "@astrojs/markdown-remark": "^1.1.3",
"@astrojs/telemetry": "^1.0.1", "@astrojs/telemetry": "^1.0.1",
@@ -7749,9 +7749,9 @@
} }
}, },
"node_modules/astro/node_modules/@astrojs/compiler": { "node_modules/astro/node_modules/@astrojs/compiler": {
"version": "0.25.2", "version": "0.26.1",
"resolved": "https://registry.npmjs.org/@astrojs/compiler/-/compiler-0.25.2.tgz", "resolved": "https://registry.npmjs.org/@astrojs/compiler/-/compiler-0.26.1.tgz",
"integrity": "sha512-GE7uLvH7rSHuTHdMun+867TWsgYNYsaGuhvXsywcaabl4W4n/3b1kzgzrIsrXYBo51J0k6qD33mVdsHdvwv5rw==", "integrity": "sha512-GoRi4qB05u+bVcSlR9nu9HJfSUGFBcoUUb+WFimKSm9e/KPTy0STOMb/Q0mLIcloavF4KvEqAnd9ukX62ewoaA==",
"dev": true "dev": true
}, },
"node_modules/astro/node_modules/cookie": { "node_modules/astro/node_modules/cookie": {
@@ -10995,15 +10995,15 @@
"dev": true "dev": true
}, },
"node_modules/edge-runtime": { "node_modules/edge-runtime": {
"version": "1.1.0-beta.32", "version": "1.1.0-beta.37",
"resolved": "https://registry.npmjs.org/edge-runtime/-/edge-runtime-1.1.0-beta.32.tgz", "resolved": "https://registry.npmjs.org/edge-runtime/-/edge-runtime-1.1.0-beta.37.tgz",
"integrity": "sha512-fbqqUF3OKynqtWgExhjyxXX2SwbkWuwmjUYhml3Sv8Y/vkrTxyTKrxS0MoxUy5sGPB3BBEtpopn36cQgwlOpAg==", "integrity": "sha512-IP0xYNmp0XXoXVnrAf/e67224ZkMUUBMyUUohVxWWI5XdyetIGRNWp3GifDy3LpbuE02yv42rgtoE+tm+whcLA==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@edge-runtime/format": "^1.1.0-beta.32", "@edge-runtime/format": "1.1.0-beta.33",
"@edge-runtime/vm": "^1.1.0-beta.32", "@edge-runtime/vm": "1.1.0-beta.36",
"exit-hook": "2.2.1", "exit-hook": "2.2.1",
"http-status": "1.5.2", "http-status": "1.5.3",
"mri": "1.2.0", "mri": "1.2.0",
"picocolors": "1.0.0", "picocolors": "1.0.0",
"pretty-bytes": "5.6.0", "pretty-bytes": "5.6.0",
@@ -17252,9 +17252,9 @@
} }
}, },
"node_modules/http-status": { "node_modules/http-status": {
"version": "1.5.2", "version": "1.5.3",
"resolved": "https://registry.npmjs.org/http-status/-/http-status-1.5.2.tgz", "resolved": "https://registry.npmjs.org/http-status/-/http-status-1.5.3.tgz",
"integrity": "sha512-HzxX+/hV/8US1Gq4V6R6PgUmJ5Pt/DGATs4QhdEOpG8LrdS9/3UG2nnOvkqUpRks04yjVtV5p/NODjO+wvf6vg==", "integrity": "sha512-jCClqdnnwigYslmtfb28vPplOgoiZ0siP2Z8C5Ua+3UKbx410v+c+jT+jh1bbI4TvcEySuX0vd/CfFZFbDkJeQ==",
"dev": true, "dev": true,
"engines": { "engines": {
"node": ">= 0.4.0" "node": ">= 0.4.0"
@@ -27347,9 +27347,9 @@
} }
}, },
"node_modules/terser": { "node_modules/terser": {
"version": "5.15.0", "version": "5.15.1",
"resolved": "https://registry.npmjs.org/terser/-/terser-5.15.0.tgz", "resolved": "https://registry.npmjs.org/terser/-/terser-5.15.1.tgz",
"integrity": "sha512-L1BJiXVmheAQQy+as0oF3Pwtlo4s3Wi1X2zNZ2NxOB4wx9bdS9Vk67XQENLFdLYGCK/Z2di53mTj/hBafR+dTA==", "integrity": "sha512-K1faMUvpm/FBxjBXud0LWVAGxmvoPbZbfTCYbSgaaYQaIXI3/TdI7a7ZGA73Zrou6Q8Zmz3oeUTsp/dj+ag2Xw==",
"dev": true, "dev": true,
"dependencies": { "dependencies": {
"@jridgewell/source-map": "^0.3.2", "@jridgewell/source-map": "^0.3.2",
@@ -30401,9 +30401,9 @@
"dev": true "dev": true
}, },
"@astrojs/image": { "@astrojs/image": {
"version": "0.9.1", "version": "0.9.2",
"resolved": "https://registry.npmjs.org/@astrojs/image/-/image-0.9.1.tgz", "resolved": "https://registry.npmjs.org/@astrojs/image/-/image-0.9.2.tgz",
"integrity": "sha512-tnrL9tL539gIzkM9oqRd+asOePPUE/ehtQjmrcsTjJtQx8aPhKHEteJIMuDhby94wRhV6vMK1Wqt4u5DBf6GQQ==", "integrity": "sha512-kmCcV9Nwk43Ll3AZFMwAk7ljzQP+WkJuEcKU6svGgN1vSAPS7CUFTQNFCGt80ZIiP4YOF7NR172XDAlBTFi4YA==",
"dev": true, "dev": true,
"requires": { "requires": {
"@altano/tiny-async-pool": "^1.0.2", "@altano/tiny-async-pool": "^1.0.2",
@@ -31965,18 +31965,18 @@
"dev": true "dev": true
}, },
"@edge-runtime/primitives": { "@edge-runtime/primitives": {
"version": "1.1.0-beta.34", "version": "1.1.0-beta.36",
"resolved": "https://registry.npmjs.org/@edge-runtime/primitives/-/primitives-1.1.0-beta.34.tgz", "resolved": "https://registry.npmjs.org/@edge-runtime/primitives/-/primitives-1.1.0-beta.36.tgz",
"integrity": "sha512-gFubu4qIqg1k6sOM2Ho/txFUE/vZCn057wGiY0NIQ8h6tySiUO5FULCaebPrp+Yfxb3ZCWqDLeWanQGFB3TYQQ==", "integrity": "sha512-Tji7SGWmn1+JGSnzFtWUoS7+kODIFprTyIAw0EBOVWEQKWfs7r0aTEm1XkJR0+d1jP9f0GB5LBKG/Z7KFyhx7g==",
"dev": true "dev": true
}, },
"@edge-runtime/vm": { "@edge-runtime/vm": {
"version": "1.1.0-beta.32", "version": "1.1.0-beta.36",
"resolved": "https://registry.npmjs.org/@edge-runtime/vm/-/vm-1.1.0-beta.32.tgz", "resolved": "https://registry.npmjs.org/@edge-runtime/vm/-/vm-1.1.0-beta.36.tgz",
"integrity": "sha512-G0SH80am2XjlK6oFI3RoKlg1SBS5ZAeqakYasfNhJEXqM7g7tsoh5jURMQcNxpLvo48XBTgHgAVEMzhAGgDPZg==", "integrity": "sha512-uPZmL7X+lKBFJsTg8nC0qPDBx4JGgpRqlgJi2s77g2NOtqitQOI90BfIKHZSSoMQEwTqfvAkpu2ui8nazOwHxA==",
"dev": true, "dev": true,
"requires": { "requires": {
"@edge-runtime/primitives": "^1.1.0-beta.32" "@edge-runtime/primitives": "1.1.0-beta.36"
} }
}, },
"@emmetio/abbreviation": { "@emmetio/abbreviation": {
@@ -34713,9 +34713,9 @@
} }
}, },
"@types/node": { "@types/node": {
"version": "18.8.2", "version": "18.8.3",
"resolved": "https://registry.npmjs.org/@types/node/-/node-18.8.2.tgz", "resolved": "https://registry.npmjs.org/@types/node/-/node-18.8.3.tgz",
"integrity": "sha512-cRMwIgdDN43GO4xMWAfJAecYn8wV4JbsOGHNfNUIDiuYkUYAR5ec4Rj7IO2SAhFPEfpPtLtUTbbny/TCT7aDwA==", "integrity": "sha512-0os9vz6BpGwxGe9LOhgP/ncvYN5Tx1fNcd2TM3rD/aCGBkysb+ZWpXEocG24h6ZzOi13+VB8HndAQFezsSOw1w==",
"dev": true "dev": true
}, },
"@types/node-fetch": { "@types/node-fetch": {
@@ -35071,23 +35071,23 @@
} }
}, },
"@vercel/build-utils": { "@vercel/build-utils": {
"version": "5.5.3", "version": "5.5.4",
"resolved": "https://registry.npmjs.org/@vercel/build-utils/-/build-utils-5.5.3.tgz", "resolved": "https://registry.npmjs.org/@vercel/build-utils/-/build-utils-5.5.4.tgz",
"integrity": "sha512-T4MYD87rwocybIQzv4giRFYiisQqFLZOsPXn5tglQfnsB0DJM47l8VW9oFgGX2cJyp/px7C/ovdLrhwY/XWhYQ==", "integrity": "sha512-urAVFyrH6NTznN8bG1S4KHMpMwEaRXMRMeUXuMZXdGiznB83pACZ/5xpSzaLTIKrOrdYWVUrGcFjhLDMVRqCWQ==",
"dev": true "dev": true
}, },
"@vercel/node": { "@vercel/node": {
"version": "2.5.21", "version": "2.5.22",
"resolved": "https://registry.npmjs.org/@vercel/node/-/node-2.5.21.tgz", "resolved": "https://registry.npmjs.org/@vercel/node/-/node-2.5.22.tgz",
"integrity": "sha512-sJajTZYCDl4euWHuOgL5xzR7eLyi5Xv58j/QgI0tkOhMrREpqW9Jv2K2eSRDDuPDMbUgqqK14LodHApLlenizA==", "integrity": "sha512-phlgW4qHGEt/yQ/nbGCd3vrFM0n48/MBbvmAKgTeVE/mjzdWxPnuSHNQlaipJkzfT3tv8kiiJu9ZoicuDoACTw==",
"dev": true, "dev": true,
"requires": { "requires": {
"@edge-runtime/vm": "1.1.0-beta.32", "@edge-runtime/vm": "1.1.0-beta.36",
"@types/node": "*", "@types/node": "*",
"@vercel/build-utils": "5.5.3", "@vercel/build-utils": "5.5.4",
"@vercel/node-bridge": "3.0.0", "@vercel/node-bridge": "3.0.0",
"@vercel/static-config": "2.0.3", "@vercel/static-config": "2.0.3",
"edge-runtime": "1.1.0-beta.32", "edge-runtime": "1.1.0-beta.37",
"esbuild": "0.14.47", "esbuild": "0.14.47",
"exit-hook": "2.2.1", "exit-hook": "2.2.1",
"node-fetch": "2.6.7", "node-fetch": "2.6.7",
@@ -35913,12 +35913,12 @@
"dev": true "dev": true
}, },
"astro": { "astro": {
"version": "1.4.4", "version": "1.4.5",
"resolved": "https://registry.npmjs.org/astro/-/astro-1.4.4.tgz", "resolved": "https://registry.npmjs.org/astro/-/astro-1.4.5.tgz",
"integrity": "sha512-vxuHJ8C/3/NDau6EDUvi83JFDBK5Ylmo6VGAsUkdnutpGw77I4NoapoN56ANmU54ucYiu+x0apEPQvesY6GZiQ==", "integrity": "sha512-7uflNdFMsAONkEdtNRqP1XgtgdUhiiFfYd3DjtaoaskYhcnfKKYy8Lht0stIQaMtAqITIy0LLTDvDM/j8SfuUw==",
"dev": true, "dev": true,
"requires": { "requires": {
"@astrojs/compiler": "^0.25.0", "@astrojs/compiler": "^0.26.0",
"@astrojs/language-server": "^0.26.2", "@astrojs/language-server": "^0.26.2",
"@astrojs/markdown-remark": "^1.1.3", "@astrojs/markdown-remark": "^1.1.3",
"@astrojs/telemetry": "^1.0.1", "@astrojs/telemetry": "^1.0.1",
@@ -35980,9 +35980,9 @@
}, },
"dependencies": { "dependencies": {
"@astrojs/compiler": { "@astrojs/compiler": {
"version": "0.25.2", "version": "0.26.1",
"resolved": "https://registry.npmjs.org/@astrojs/compiler/-/compiler-0.25.2.tgz", "resolved": "https://registry.npmjs.org/@astrojs/compiler/-/compiler-0.26.1.tgz",
"integrity": "sha512-GE7uLvH7rSHuTHdMun+867TWsgYNYsaGuhvXsywcaabl4W4n/3b1kzgzrIsrXYBo51J0k6qD33mVdsHdvwv5rw==", "integrity": "sha512-GoRi4qB05u+bVcSlR9nu9HJfSUGFBcoUUb+WFimKSm9e/KPTy0STOMb/Q0mLIcloavF4KvEqAnd9ukX62ewoaA==",
"dev": true "dev": true
}, },
"cookie": { "cookie": {
@@ -38506,15 +38506,15 @@
"dev": true "dev": true
}, },
"edge-runtime": { "edge-runtime": {
"version": "1.1.0-beta.32", "version": "1.1.0-beta.37",
"resolved": "https://registry.npmjs.org/edge-runtime/-/edge-runtime-1.1.0-beta.32.tgz", "resolved": "https://registry.npmjs.org/edge-runtime/-/edge-runtime-1.1.0-beta.37.tgz",
"integrity": "sha512-fbqqUF3OKynqtWgExhjyxXX2SwbkWuwmjUYhml3Sv8Y/vkrTxyTKrxS0MoxUy5sGPB3BBEtpopn36cQgwlOpAg==", "integrity": "sha512-IP0xYNmp0XXoXVnrAf/e67224ZkMUUBMyUUohVxWWI5XdyetIGRNWp3GifDy3LpbuE02yv42rgtoE+tm+whcLA==",
"dev": true, "dev": true,
"requires": { "requires": {
"@edge-runtime/format": "^1.1.0-beta.32", "@edge-runtime/format": "1.1.0-beta.33",
"@edge-runtime/vm": "^1.1.0-beta.32", "@edge-runtime/vm": "1.1.0-beta.36",
"exit-hook": "2.2.1", "exit-hook": "2.2.1",
"http-status": "1.5.2", "http-status": "1.5.3",
"mri": "1.2.0", "mri": "1.2.0",
"picocolors": "1.0.0", "picocolors": "1.0.0",
"pretty-bytes": "5.6.0", "pretty-bytes": "5.6.0",
@@ -43114,9 +43114,9 @@
} }
}, },
"http-status": { "http-status": {
"version": "1.5.2", "version": "1.5.3",
"resolved": "https://registry.npmjs.org/http-status/-/http-status-1.5.2.tgz", "resolved": "https://registry.npmjs.org/http-status/-/http-status-1.5.3.tgz",
"integrity": "sha512-HzxX+/hV/8US1Gq4V6R6PgUmJ5Pt/DGATs4QhdEOpG8LrdS9/3UG2nnOvkqUpRks04yjVtV5p/NODjO+wvf6vg==", "integrity": "sha512-jCClqdnnwigYslmtfb28vPplOgoiZ0siP2Z8C5Ua+3UKbx410v+c+jT+jh1bbI4TvcEySuX0vd/CfFZFbDkJeQ==",
"dev": true "dev": true
}, },
"http2-wrapper": { "http2-wrapper": {
@@ -50713,9 +50713,9 @@
"peer": true "peer": true
}, },
"terser": { "terser": {
"version": "5.15.0", "version": "5.15.1",
"resolved": "https://registry.npmjs.org/terser/-/terser-5.15.0.tgz", "resolved": "https://registry.npmjs.org/terser/-/terser-5.15.1.tgz",
"integrity": "sha512-L1BJiXVmheAQQy+as0oF3Pwtlo4s3Wi1X2zNZ2NxOB4wx9bdS9Vk67XQENLFdLYGCK/Z2di53mTj/hBafR+dTA==", "integrity": "sha512-K1faMUvpm/FBxjBXud0LWVAGxmvoPbZbfTCYbSgaaYQaIXI3/TdI7a7ZGA73Zrou6Q8Zmz3oeUTsp/dj+ag2Xw==",
"dev": true, "dev": true,
"requires": { "requires": {
"@jridgewell/source-map": "^0.3.2", "@jridgewell/source-map": "^0.3.2",

View File

@@ -32,19 +32,19 @@
"prepare": "husky install" "prepare": "husky install"
}, },
"devDependencies": { "devDependencies": {
"@astrojs/image": "^0.9.1", "@astrojs/image": "^0.9.2",
"@astrojs/mdx": "^0.11.4", "@astrojs/mdx": "^0.11.4",
"@astrojs/preact": "^1.1.1", "@astrojs/preact": "^1.1.1",
"@remark-embedder/core": "^3.0.1", "@remark-embedder/core": "^3.0.1",
"@remark-embedder/transformer-oembed": "^3.0.0", "@remark-embedder/transformer-oembed": "^3.0.0",
"@types/classnames": "^2.3.1", "@types/classnames": "^2.3.1",
"@types/node": "^18.8.2", "@types/node": "^18.8.3",
"@types/parse5": "^7.0.0", "@types/parse5": "^7.0.0",
"@types/uuid": "^8.3.4", "@types/uuid": "^8.3.4",
"@typescript-eslint/eslint-plugin": "^5.39.0", "@typescript-eslint/eslint-plugin": "^5.39.0",
"@typescript-eslint/parser": "^5.39.0", "@typescript-eslint/parser": "^5.39.0",
"@vercel/node": "^2.5.21", "@vercel/node": "^2.5.22",
"astro": "^1.4.4", "astro": "^1.4.5",
"astro-icon": "^0.7.3", "astro-icon": "^0.7.3",
"classnames": "^2.3.2", "classnames": "^2.3.2",
"dayjs": "^1.11.5", "dayjs": "^1.11.5",
@@ -77,7 +77,7 @@
"rollup-plugin-copy": "^3.4.0", "rollup-plugin-copy": "^3.4.0",
"sass": "^1.55.0", "sass": "^1.55.0",
"slash": "^5.0.0", "slash": "^5.0.0",
"terser": "^5.15.0", "terser": "^5.15.1",
"unified": "^10.1.2", "unified": "^10.1.2",
"unist-util-replace-all-between": "^0.1.1", "unist-util-replace-all-between": "^0.1.1",
"unist-util-visit": "^4.1.1" "unist-util-visit": "^4.1.1"

View File

Before

Width:  |  Height:  |  Size: 446 KiB

After

Width:  |  Height:  |  Size: 446 KiB

View File

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 1.4 MiB

View File

@@ -0,0 +1,59 @@
<form
action="https://app.convertkit.com/forms/1254394/subscriptions"
class="seva-form formkit-form"
method="post"
style="border: none;"
data-sv-form="1254394"
data-uid="882d42bb6f"
data-format="inline"
data-version="5"
data-options='{"settings":{"after_subscribe":{"action":"redirect","success_message":"Success! Now check your email to confirm your subscription.","redirect_url":"https://unicorn-utterances.com/confirm"},"analytics":{"google":null,"fathom":null,"facebook":null,"segment":null,"pinterest":null,"sparkloop":null,"googletagmanager":null},"modal":{"trigger":"timer","scroll_percentage":null,"timer":5,"devices":"all","show_once_every":15},"powered_by":{"show":false,"url":"https://convertkit.com/features/forms?utm_campaign=poweredby&amp;utm_content=form&amp;utm_medium=referral&amp;utm_source=dynamic"},"recaptcha":{"enabled":false},"return_visitor":{"action":"hide","custom_content":""},"slide_in":{"display_in":"bottom_right","trigger":"timer","scroll_percentage":null,"timer":5,"devices":"all","show_once_every":15},"sticky_bar":{"display_in":"top","trigger":"timer","scroll_percentage":null,"timer":5,"devices":"all","show_once_every":15}},"version":"5"}'
min-width="400 500 600 700 800"
>
<div data-style="clean">
<ul
class="formkit-alert formkit-alert-error"
data-element="errors"
data-group="alert"
></ul>
<div
data-element="fields"
data-stacked="false"
class="seva-fields formkit-fields"
>
<div class="formkit-field">
<input
class="formkit-input"
aria-label="Your first name"
style="color: rgb(0, 0, 0); border-color: rgb(227, 227, 227); border-radius: 4px; font-weight: 400;"
name="fields[first_name]"
placeholder="Your first name"
type="text"
/>
</div>
<div class="formkit-field">
<input
class="formkit-input"
name="email_address"
style="color: rgb(0, 0, 0); border-color: rgb(227, 227, 227); border-radius: 4px; font-weight: 400;"
aria-label="Your email address"
placeholder="Your email address"
required=""
type="email"
/>
</div>
<button
data-element="submit"
class="formkit-submit formkit-submit"
style="color: rgb(255, 255, 255); background-color: rgb(18, 125, 179); border-radius: 4px; font-weight: 400;"
>
<div class="formkit-spinner">
<div></div>
<div></div>
<div></div>
</div>
<span class="">Notify Me</span>
</button>
</div>
</div>
</form>

View File

@@ -1,12 +1,24 @@
--- ---
import Document from "./document.astro"; import Document from "./document.astro";
import SEO from "components/seo/seo.astro";
import "../page-components/collections/collections.scss"; import "../page-components/collections/collections.scss";
import "../styles/post-body.scss"; import "../styles/post-body.scss";
import "../styles/tabs.scss";
import "../styles/shiki.scss"; import "../styles/shiki.scss";
import "../styles/convertkit.scss"; import "../styles/convertkit.scss";
const {frontmatter} = Astro.props;
--- ---
<Document> <Document>
<div class="collectionsContainer">
<SEO
title={frontmatter.title}
description={frontmatter.description}
unicornsData={frontmatter.authorsMeta}
publishedTime={frontmatter.published}
type={frontmatter.type}
shareImage={frontmatter.socialImg || frontmatter.coverImgPath}
/>
<slot /> <slot />
</div>
</Document> </Document>

View File

@@ -2,8 +2,8 @@
import { Picture } from "@astrojs/image/components"; import { Picture } from "@astrojs/image/components";
interface CollectionHeaderDefaultProps { interface CollectionHeaderDefaultProps {
coverImgPath: string; coverImgPath: string | Promise<{default: {src: string, height: number, width: number, format: string}}>;
coverImgAspectRatio: number; coverImgAspectRatio?: number;
collection: { collection: {
title: string; title: string;
description: string; description: string;
@@ -11,8 +11,15 @@ interface CollectionHeaderDefaultProps {
}; };
} }
const { coverImgPath, coverImgAspectRatio, collection } = let { coverImgPath, coverImgAspectRatio, collection } =
Astro.props as CollectionHeaderDefaultProps; Astro.props as CollectionHeaderDefaultProps;
// dynamic import of `coverImgPath`
if (coverImgPath instanceof Promise && !coverImgAspectRatio) {
const coverImgData = await coverImgPath;
coverImgPath = coverImgData.default.src
coverImgAspectRatio = coverImgData.default.width / coverImgData.default.height ;
}
--- ---
<div class="listViewContent"> <div class="listViewContent">

View File

@@ -3,191 +3,192 @@
@import "../../styles/text_styles"; @import "../../styles/text_styles";
.collectionsContainer { .collectionsContainer {
padding-bottom: 4rem; padding-bottom: 4rem;
.topHeader { .topHeader {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: nowrap; flex-wrap: nowrap;
min-height: 600px; min-height: 600px;
padding: 1rem; padding: 1rem;
@include until($endSmallScreenSize) { @include until($endSmallScreenSize) {
flex-direction: column; flex-direction: column;
min-height: auto; min-height: auto;
} }
} }
.bigImageContainer img, .smallImageContainer img { .bigImageContainer img,
min-width: 100%; .smallImageContainer img {
max-width: 100%; min-width: 100%;
min-height: 100%; max-width: 100%;
max-height: 100%; min-height: 100%;
object-fit: contain; max-height: 100%;
} object-fit: contain;
}
.bigImageContainer { .bigImageContainer {
flex-basis: 50%; flex-basis: 50%;
position: relative; position: relative;
margin-right: 3.5rem; margin-right: 3.5rem;
img { img {
width: 0; width: 0;
height: 0; height: 0;
} }
@include until($endSmallScreenSize) { @include until($endSmallScreenSize) {
display: none; display: none;
} }
} }
.smallImageContainer { .smallImageContainer {
display: none; display: none;
width: 60%; width: 60%;
margin: 0 auto; margin: 0 auto;
@include until($endSmallScreenSize) { @include until($endSmallScreenSize) {
display: block; display: block;
} }
} }
.topDescContainer { .topDescContainer {
flex-basis: 50%; flex-basis: 50%;
} }
.title { .title {
@extend %beeg; @extend %beeg;
color: var(--darkPrimary); color: var(--darkPrimary);
} }
.description { .description {
@extend %headline-5; @extend %headline-5;
color: var(--lightPrimary); color: var(--lightPrimary);
white-space: break-spaces; white-space: break-spaces;
} }
.buttonContainer { .buttonContainer {
display: flex; display: flex;
} }
.collectionButton { .collectionButton {
border: var(--cardOutlineStyle) !important; border: var(--cardOutlineStyle) !important;
@extend %button; @extend %button;
margin-right: 1rem !important; margin-right: 1rem !important;
padding: 0.5rem !important; padding: 0.5rem !important;
} }
.stitchedAreaContainer { .stitchedAreaContainer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin-top: 4rem; margin-top: 4rem;
margin-bottom: 4rem; margin-bottom: 4rem;
} }
.postsContainer { .postsContainer {
background: var(--white); background: var(--white);
color: var(--lightPrimary); color: var(--lightPrimary);
padding-bottom: 5rem; padding-bottom: 5rem;
} }
.postsInnerContainer { .postsInnerContainer {
max-width: 800px; max-width: 800px;
padding: 0 2rem; padding: 0 2rem;
} }
.chapterListingHeader { .chapterListingHeader {
@extend %headline-1; @extend %headline-1;
margin-top: 4rem; margin-top: 4rem;
margin-bottom: 2rem; margin-bottom: 2rem;
} }
.collectionPostList { .collectionPostList {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.postContainer { .postContainer {
margin-bottom: 2rem; margin-bottom: 2rem;
list-style: none; list-style: none;
} }
.postLink { .postLink {
text-decoration: none; text-decoration: none;
display: flex; display: flex;
} }
.orderContainer { .orderContainer {
font-size: 2rem; font-size: 2rem;
flex-shrink: 0; flex-shrink: 0;
background: var(--backgroundColor); background: var(--backgroundColor);
width: 2.5rem; width: 2.5rem;
height: 2.5rem; height: 2.5rem;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
border-radius: 32px; border-radius: 32px;
border: 4px dashed var(--lightPrimary); border: 4px dashed var(--lightPrimary);
font-weight: bold; font-weight: bold;
margin-right: 1rem; margin-right: 1rem;
} }
.postTitle { .postTitle {
@extend %headline-4; @extend %headline-4;
margin-top: 0.25rem; margin-top: 0.25rem;
margin-bottom: 0; margin-bottom: 0;
text-decoration: underline; text-decoration: underline;
} }
.noLink { .noLink {
text-decoration: none !important; text-decoration: none !important;
} }
.postDesc { .postDesc {
@extend %body-1; @extend %body-1;
} }
.markdownContainer { .markdownContainer {
color: var(--darkPrimary); color: var(--darkPrimary);
padding: 0 2rem; padding: 0 2rem;
} }
} }
.collectionsContainer .topBorderArea { .collectionsContainer .topBorderArea {
height: 1rem; height: 1rem;
background-size: contain; background-size: contain;
background-image: url("/collections_top_border_light.png"); background-image: url("/collections_top_border_light.png");
background-repeat: repeat-x; background-repeat: repeat-x;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.dark .collectionsContainer .topBorderArea { .dark .collectionsContainer .topBorderArea {
background-image: url("/collections_top_border_dark.png"); background-image: url("/collections_top_border_dark.png");
} }
.collectionsContainer .bottomBorderArea { .collectionsContainer .bottomBorderArea {
height: 1rem; height: 1rem;
background-size: contain; background-size: contain;
background-image: url("/collections_bottom_border_light.png"); background-image: url("/collections_bottom_border_light.png");
background-repeat: repeat-x; background-repeat: repeat-x;
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
.dark .collectionsContainer .bottomBorderArea { .dark .collectionsContainer .bottomBorderArea {
background-image: url("/collections_bottom_border_dark.png"); background-image: url("/collections_bottom_border_dark.png");
} }
.collectionsContainer .themedImage { .collectionsContainer .themedImage {
filter: drop-shadow(0 3px 4px rgba(21, 62, 103, 0.12)) filter: drop-shadow(0 3px 4px rgba(21, 62, 103, 0.12))
drop-shadow(0 3px 3px rgba(21, 62, 103, 0.14)) drop-shadow(0 3px 3px rgba(21, 62, 103, 0.14))
drop-shadow(0 1px 8px rgba(21, 62, 103, 0.12)) drop-shadow(0 1px 8px rgba(21, 62, 103, 0.12))
drop-shadow(0 -2px 2px rgba(21, 62, 103, 0.1)); drop-shadow(0 -2px 2px rgba(21, 62, 103, 0.1));
} }
.dark .collectionsContainer .themedImage { .dark .collectionsContainer .themedImage {
filter: drop-shadow(0 3px 4px rgba(228, 244, 255, 0.04)) filter: drop-shadow(0 3px 4px rgba(228, 244, 255, 0.04))
drop-shadow(0 3px 3px rgba(228, 244, 255, 0.05)) drop-shadow(0 3px 3px rgba(228, 244, 255, 0.05))
drop-shadow(0 1px 8px rgba(228, 244, 255, 0.04)) drop-shadow(0 1px 8px rgba(228, 244, 255, 0.04))
drop-shadow(0 -2px 2px rgba(228, 244, 255, 0.1)); drop-shadow(0 -2px 2px rgba(228, 244, 255, 0.1));
} }

View File

@@ -4,8 +4,8 @@
associatedSeries: "Framework Field Guide", associatedSeries: "Framework Field Guide",
description: "A practical and free way to teach Angular, React, and Vue all at once, so you can choose the right tool for the job and learn the underlying concepts in depth.", description: "A practical and free way to teach Angular, React, and Vue all at once, so you can choose the right tool for the job and learn the underlying concepts in depth.",
authors: ["crutchcorn"], authors: ["crutchcorn"],
coverImg: "./cover.png", coverImg: "/custom-content/collections/framework-field-guide/cover.png",
socialImg: "/framework_field_guide_social.png", socialImg: "/custom-content/collections/framework-field-guide/framework_field_guide_social.png",
type: "book", type: "book",
published: "2023-01-01T13:45:00.284Z", published: "2023-01-01T13:45:00.284Z",
layout: "../../../layouts/collections-mdx.astro", layout: "../../../layouts/collections-mdx.astro",
@@ -14,6 +14,8 @@
import CollectionHeaderDefault from '../../../page-components/collections/collection-header-default.astro'; import CollectionHeaderDefault from '../../../page-components/collections/collection-header-default.astro';
import CollectionTableOfContents from '../../../page-components/collections/collection-table-of-contents.astro'; import CollectionTableOfContents from '../../../page-components/collections/collection-table-of-contents.astro';
import MailingListInline from '../../../components/mailing-list/mailing-list-inline.astro';
import {Picture} from '@astrojs/image/components';
export const buttons = [ export const buttons = [
{ {
@@ -66,7 +68,7 @@ export const chapterList = [
}, },
]; ];
<CollectionHeaderDefault coverImgPath="/ffg-cover.png" coverImgAspectRatio={1} collection={frontmatter}/> <CollectionHeaderDefault coverImgPath={import('../public/custom-content/collections/framework-field-guide/cover.png')} collection={frontmatter}/>
<div style="display: flex; flex-wrap: nowrap;"> <div style="display: flex; flex-wrap: nowrap;">
<div> <div>
@@ -84,12 +86,12 @@ Don't want to learn all three? **That's okay.** You can easily select a single f
</div> </div>
<div class="hide-for-mobile hide-on-dark"> <div class="hide-for-mobile hide-on-dark">
<img src="./hiker_with_bag.png" height="100%" alt="" data-nozoom="true" /> <Picture src={import('./hiker_with_bag.png')} widths={[230]} formats={['webp', 'png']} alt="" />
</div> </div>
<div class="hide-for-mobile show-on-dark"> <div class="hide-for-mobile show-on-dark">
<img src="./hiker_with_bag_dark.png" height="100%" alt="" data-nozoom="true" /> <Picture src={import('./hiker_with_bag_dark.png')} widths={[230]} formats={['webp', 'png']} alt="" />
</div> </div>
@@ -99,7 +101,7 @@ Don't want to learn all three? **That's okay.** You can easily select a single f
<div style="display: flex; align-items: center; justify-content: center; flex-wrap: wrap"> <div style="display: flex; align-items: center; justify-content: center; flex-wrap: wrap">
<div style="margin: 1rem; width: 128px; flex-shrink: 0;"> <div style="margin: 1rem; width: 128px; flex-shrink: 0;">
<img src="./crutchcorn.png" alt="" data-nozoom="true" /> <Picture src={import('./crutchcorn.png')} widths={[128]} formats={['webp', 'png']} alt="" />
</div> </div>
<p style="width: 1px; flex-grow: 1; flex-shrink: 1; min-width: 350px; font-weight: bold;"> <p style="width: 1px; flex-grow: 1; flex-shrink: 1; min-width: 350px; font-weight: bold;">
Hi! I'm <a href="https://crutchcorn.dev">Corbin Crutchley</a>, the author of Hi! I'm <a href="https://crutchcorn.dev">Corbin Crutchley</a>, the author of
@@ -139,64 +141,6 @@ while it's being worked on, feel free to [reach out to me on Twitter](https://tw
Otherwise, if you want to be notified when the book releases, you can [join our Discord](https://discord.com/invite/FMcvc6T) Otherwise, if you want to be notified when the book releases, you can [join our Discord](https://discord.com/invite/FMcvc6T)
or sign up to be notified via email when the book releases. or sign up to be notified via email when the book releases.
<form <MailingListInline/>
action="https://app.convertkit.com/forms/1254394/subscriptions"
class="seva-form formkit-form"
method="post"
style="border: none;"
data-sv-form="1254394"
data-uid="882d42bb6f"
data-format="inline"
data-version="5"
data-options='{"settings":{"after_subscribe":{"action":"redirect","success_message":"Success! Now check your email to confirm your subscription.","redirect_url":"https://unicorn-utterances.com/confirm"},"analytics":{"google":null,"fathom":null,"facebook":null,"segment":null,"pinterest":null,"sparkloop":null,"googletagmanager":null},"modal":{"trigger":"timer","scroll_percentage":null,"timer":5,"devices":"all","show_once_every":15},"powered_by":{"show":false,"url":"https://convertkit.com/features/forms?utm_campaign=poweredby&amp;utm_content=form&amp;utm_medium=referral&amp;utm_source=dynamic"},"recaptcha":{"enabled":false},"return_visitor":{"action":"hide","custom_content":""},"slide_in":{"display_in":"bottom_right","trigger":"timer","scroll_percentage":null,"timer":5,"devices":"all","show_once_every":15},"sticky_bar":{"display_in":"top","trigger":"timer","scroll_percentage":null,"timer":5,"devices":"all","show_once_every":15}},"version":"5"}'
min-width="400 500 600 700 800"
>
<div data-style="clean">
<ul
class="formkit-alert formkit-alert-error"
data-element="errors"
data-group="alert"
></ul>
<div
data-element="fields"
data-stacked="false"
class="seva-fields formkit-fields"
>
<div class="formkit-field">
<input
class="formkit-input"
aria-label="Your first name"
style="color: rgb(0, 0, 0); border-color: rgb(227, 227, 227); border-radius: 4px; font-weight: 400;"
name="fields[first_name]"
placeholder="Your first name"
type="text"
/>
</div>
<div class="formkit-field">
<input
class="formkit-input"
name="email_address"
style="color: rgb(0, 0, 0); border-color: rgb(227, 227, 227); border-radius: 4px; font-weight: 400;"
aria-label="Your email address"
placeholder="Your email address"
required=""
type="email"
/>
</div>
<button
data-element="submit"
class="formkit-submit formkit-submit"
style="color: rgb(255, 255, 255); background-color: rgb(18, 125, 179); border-radius: 4px; font-weight: 400;"
>
<div class="formkit-spinner">
<div></div>
<div></div>
<div></div>
</div>
<span class="">Notify Me</span>
</button>
</div>
</div>
</form>
> I promise you won't get spammed with emails if you sign up for notifications. Again, the book is free and we will never share or sell your email with anyone. > I promise you won't get spammed with emails if you sign up for notifications. Again, the book is free and we will never share or sell your email with anyone.

View File

@@ -7,7 +7,7 @@ import PostTitleHeader from "src/page-components/blog-post/post-title-header/pos
import PostMetadata from "src/page-components/blog-post/post-metadata/post-metadata.astro"; import PostMetadata from "src/page-components/blog-post/post-metadata/post-metadata.astro";
import SuggestedArticles from "src/page-components/blog-post/suggested-articles/suggested-articles.astro"; import SuggestedArticles from "src/page-components/blog-post/suggested-articles/suggested-articles.astro";
import TableOfContents from "components/table-of-contents/table-of-contents.astro"; import TableOfContents from "components/table-of-contents/table-of-contents.astro";
import MailingList from "components/mailing-list/mailing-list.astro"; import MailingListFull from "components/mailing-list/mailing-list-full.astro";
import Disqus from "components/disqus/disqus.astro"; import Disqus from "components/disqus/disqus.astro";
import { Icon } from "astro-icon"; import { Icon } from "astro-icon";
@@ -123,7 +123,7 @@ const GHLink = `https://github.com/${siteMetadata.repoPath}/tree/master${siteMet
/> />
</a> </a>
</div> </div>
<MailingList /> <MailingListFull />
<div class="postBottom"> <div class="postBottom">
<div class="btnLike prependIcon"> <div class="btnLike prependIcon">
<Icon height="36" width="36" name="message" /> <Icon height="36" width="36" name="message" />