diff --git a/apps/web/app/landing/download.tsx b/apps/web/app/landing/download.tsx new file mode 100644 index 00000000..21052327 --- /dev/null +++ b/apps/web/app/landing/download.tsx @@ -0,0 +1,20 @@ +"use client" +import * as htmlToImage from "html-to-image" + +export function Download({ selector }: { selector: string }) { + const onClick = async () => { + const nodes = document.querySelectorAll(selector) as any + for (const node of nodes) { + const dataUrl = await htmlToImage.toPng(node as HTMLElement) + var img = new Image() + img.src = dataUrl + document.getElementById("out")!.appendChild(img) + } + } + return ( +
+ +
+
+ ) +} diff --git a/apps/web/app/landing/sponsors.json b/apps/web/app/landing/sponsors.json index 84af8d3e..bcde2026 100644 --- a/apps/web/app/landing/sponsors.json +++ b/apps/web/app/landing/sponsors.json @@ -9,7 +9,7 @@ }, { "name": "speakeasy-api", - "amount": 4331 + "amount": 4649 }, { "name": "uidotdev", @@ -29,11 +29,11 @@ }, { "name": "kickstartDS", - "amount": 957 + "amount": 986 }, { "name": "brianespinosa", - "amount": 912 + "amount": 941 }, { "name": "jsheroes", @@ -47,9 +47,13 @@ "name": "scvnc", "amount": 421 }, + { + "name": "remotion-dev", + "amount": 400 + }, { "name": "nathanclevenger", - "amount": 372 + "amount": 391 }, { "name": "arosenkranz", @@ -57,11 +61,11 @@ }, { "name": "molebox", - "amount": 333 + "amount": 342 }, { "name": "traviscooper", - "amount": 315 + "amount": 324 }, { "name": "obgibson", @@ -85,15 +89,15 @@ }, { "name": "codeSTACKr", - "amount": 252 + "amount": 261 }, { - "name": "matthiaszepper", - "amount": 250 + "name": "kiliman", + "amount": 255 }, { - "name": "kiliman", - "amount": 246 + "name": "matthiaszepper", + "amount": 250 }, { "name": "lostintangent", @@ -219,6 +223,10 @@ "name": "ranman", "amount": 86 }, + { + "name": "zmzlois", + "amount": 84 + }, { "name": "grikomsn", "amount": 81 @@ -243,10 +251,6 @@ "name": "devopsbarista", "amount": 67 }, - { - "name": "zmzlois", - "amount": 65 - }, { "name": "cdalsoniii", "amount": 63 @@ -371,6 +375,10 @@ "name": "1rodriguez", "amount": 25 }, + { + "name": "yowainwright", + "amount": 25 + }, { "name": "codebender828", "amount": 23 @@ -464,12 +472,12 @@ "amount": 9 }, { - "name": "achan-godaddy", - "amount": 7 + "name": "peterfox", + "amount": 8 }, { - "name": "peterfox", - "amount": 6 + "name": "achan-godaddy", + "amount": 7 }, { "name": "RayJason", diff --git a/apps/web/package.json b/apps/web/package.json index cea779f6..f7bd58a3 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -26,6 +26,7 @@ "diff": "^5.1.0", "dotenv": "^16.4.1", "estree-util-to-js": "^2.0.0", + "html-to-image": "^1.11.11", "lucide-react": "^0.303.0", "next": "14.1.0", "next-docs-mdx": "7.1.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4606390b..90afdf7a 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -107,6 +107,9 @@ importers: estree-util-to-js: specifier: ^2.0.0 version: 2.0.0 + html-to-image: + specifier: ^1.11.11 + version: 1.11.11 lucide-react: specifier: ^0.303.0 version: 0.303.0(react@18.2.0) @@ -2677,6 +2680,9 @@ packages: hosted-git-info@2.8.9: resolution: {integrity: sha512-mxIDAb9Lsm6DoOJ7xH+5+X4y1LU/4Hi50L9C5sIswK3JzULS4bwk1FvjdBgvYR4bzT4tuUQiC15FE2f5HbLvYw==} + html-to-image@1.11.11: + resolution: {integrity: sha512-9gux8QhvjRO/erSnDPv28noDZcPZmYE7e1vFsBLKLlRlKDSqNJYebj6Qz1TGd5lsRV+X+xYyjCKjuZdABinWjA==} + human-id@1.0.2: resolution: {integrity: sha512-UNopramDEhHJD+VR+ehk8rOslwSfByxPIZyJRfV739NDhN5LF1fa1MqnzKm2lGTQRjNrjK19Q5fhkgIfjlVUKw==} @@ -7236,6 +7242,8 @@ snapshots: hosted-git-info@2.8.9: {} + html-to-image@1.11.11: {} + human-id@1.0.2: {} human-id@4.1.1: {} diff --git a/readme.md b/readme.md index bf701c34..c27a1d36 100644 --- a/readme.md +++ b/readme.md @@ -1,3 +1,5 @@ +# Code Hike + ### Build rich content websites with Markdown and React Code Hike is an open-source library that bridges the gap between Markdown and React to help you create technical content that takes advantage of the modern web. @@ -12,13 +14,37 @@ Try it online on [StackBlitz](https://stackblitz.com/github/code-hike/v1-starter npx create-next-app -e https://github.com/code-hike/v1-starter ``` - +[![BrowserStack](https://user-images.githubusercontent.com/1911623/145201872-8940020c-5659-4066-9a0b-0eb25ace3e61.png#gh-light-mode-only)](https://www.browserstack.com/#gh-light-mode-only) +![spacer](https://user-images.githubusercontent.com/1911623/145202317-0bcfb3ed-403c-4737-a781-2eeb6b796e8b.png) +[![Gitpod](https://github.com/user-attachments/assets/e219d74d-2154-4e02-aceb-45408fee6f90#gh-dark-mode-only)](https://www.gitpod.io/#gh-dark-mode-only) +[![Gitpod](https://github.com/user-attachments/assets/d3095f51-0d43-41f1-84f4-92dba8486d61#gh-light-mode-only)](https://www.gitpod.io//#gh-light-mode-only) + +--- #### License