LukeParke/sveltekit-og
1
0
Fork 0
mirror of https://github.com/LukeHagar/sveltekit-og.git synced 2025-12-07 04:21:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Examples Complete

Browse Source
This commit is contained in:
Shivam Meena
2022-10-31 01:08:25 +05:30
parent 2e4d9731dd
commit 6cf23055cb
4 changed files with 61 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
examples/package-lock.json generated
View File

@@ -8,7 +8,7 @@
"name": "examples", "name": "examples",
"version": "0.0.1", "version": "0.0.1",
"dependencies": { "dependencies": {
"@ethercorps/sveltekit-og": "^0.1.5" "@ethercorps/sveltekit-og": "^0.1.7"
}, },
"devDependencies": { "devDependencies": {
"@playwright/test": "^1.25.0", "@playwright/test": "^1.25.0",
@@ -85,9 +85,9 @@
} }
}, },
"node_modules/@ethercorps/sveltekit-og": { "node_modules/@ethercorps/sveltekit-og": {
"version": "0.1.5", "version": "0.1.7",
"resolved": "https://registry.npmjs.org/@ethercorps/sveltekit-og/-/sveltekit-og-0.1.5.tgz", "resolved": "https://registry.npmjs.org/@ethercorps/sveltekit-og/-/sveltekit-og-0.1.7.tgz",
"integrity": "sha512-wFPXA9lyQ4gg2gaAl/Ww6Z2MR/tx3fQ0Ap7CDdMvy7qhNmRZli83VK5q0YpQBYlDM3Jd36OvnjDaAUD6xn5cBQ==", "integrity": "sha512-Z5NBmntBLG1kYr6MSBtvBdzQ1YrrI461i/v+RgGRrBQVy4T9Gl2BzaCEfP1mHOtjb9XkE0gtdExl9Td93JghvA==",
"dependencies": { "dependencies": {
"@resvg/resvg-wasm": "^2.1.0", "@resvg/resvg-wasm": "^2.1.0",
"satori": "^0.0.43", "satori": "^0.0.43",
@@ -2901,9 +2901,9 @@
} }
}, },
"@ethercorps/sveltekit-og": { "@ethercorps/sveltekit-og": {
"version": "0.1.5", "version": "0.1.7",
"resolved": "https://registry.npmjs.org/@ethercorps/sveltekit-og/-/sveltekit-og-0.1.5.tgz", "resolved": "https://registry.npmjs.org/@ethercorps/sveltekit-og/-/sveltekit-og-0.1.7.tgz",
"integrity": "sha512-wFPXA9lyQ4gg2gaAl/Ww6Z2MR/tx3fQ0Ap7CDdMvy7qhNmRZli83VK5q0YpQBYlDM3Jd36OvnjDaAUD6xn5cBQ==", "integrity": "sha512-Z5NBmntBLG1kYr6MSBtvBdzQ1YrrI461i/v+RgGRrBQVy4T9Gl2BzaCEfP1mHOtjb9XkE0gtdExl9Td93JghvA==",
"requires": { "requires": {
"@resvg/resvg-wasm": "^2.1.0", "@resvg/resvg-wasm": "^2.1.0",
"satori": "^0.0.43", "satori": "^0.0.43",

2
examples/package.json
View File

@@ -24,6 +24,6 @@
}, },
"type": "module", "type": "module",
"dependencies": { "dependencies": {
"@ethercorps/sveltekit-og": "^0.1.5" "@ethercorps/sveltekit-og": "^0.1.7"
} }
} }

24
examples/src/routes/cog/+server.ts Normal file
View File

@@ -0,0 +1,24 @@
import OG from './OG.svelte';
import type { RequestHandler } from '@sveltejs/kit';
import {componentToImageResponse} from "@ethercorps/sveltekit-og";
const fontFile = await fetch('https://og-playground.vercel.app/inter-latin-ext-700-normal.woff');
const fontData: ArrayBuffer = await fontFile.arrayBuffer();
export const GET: RequestHandler = async () => {
return new componentToImageResponse(
OG,
{ text: 'Ready to dive in?', spanText: 'Start your free trial today.' },
{
height: 250,
width: 500,
fonts: [
{
name: 'Inter Latin',
data: fontData,
weight: 700
}
]
}
);
};

29
examples/src/routes/cog/OG.svelte Normal file
View File

@@ -0,0 +1,29 @@
<script>
export let text;
export let spanText;
</script>
<div tw="bg-gray-50 flex w-full h-full items-center justify-center">
<div tw="flex flex-col md:flex-row w-full py-12 px-4 md:items-center justify-between p-8">
<h2 tw="flex flex-col text-3xl sm:text-4xl font-bold tracking-tight text-gray-900 text-left">
<span>{text}</span>
<span tw="text-indigo-600">{spanText}</span>
</h2>
<div tw="mt-8 flex md:mt-0">
<div tw="flex rounded-md shadow">
<a
href="#"
tw="flex items-center justify-center rounded-md border border-transparent bg-indigo-600 px-5 py-3 text-base font-medium text-white"
>Get started</a
>
</div>
<div tw="ml-3 flex rounded-md shadow">
<a
href="#"
tw="flex items-center justify-center rounded-md border border-transparent bg-white px-5 py-3 text-base font-medium text-indigo-600"
>Learn more</a
>
</div>
</div>
</div>
</div>